/* Theme Name: Food and Health 2016 Theme URI: http://mtomas.com/1/ Author: My Guy Solutions, LLC Author URI: http://www.myguysolutions.com/ Description: Based on Tiny Framework (2.1.1) and modeled after Magnus. Version: 1.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: light, gray, white, one-column, two-columns, right-sidebar, fluid-layout, responsive-layout, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready, accessibility-ready Text Domain: tinyframework 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. */ /* Notes -------------------------------------------------------------- This stylesheet uses rem values with a pixel fallback. The rem values (and line heights) are calculated using two variables: $rembase: 16; $line-height: 24; We use rem for: font-size, margin, padding, width, max-width when using in px. For easy calculation you may use this tool, set "Choose your font-size (px)" to 16: @link https://offroadcode.com/prototypes/rem-calculator/ ---------- Examples padding: 5px 0; padding: 0.3125rem 0; (5 / $rembase) * Set a font-size and then set a line-height based on the font-size: font-size: 16px font-size: 1rem; (16 / $rembase) line-height: 1.5; ($line-height / 16) ---------- Vertical spacing Vertical spacing between most elements should use 24px or 48px to maintain vertical rhythm: .my-new-div { margin: 24px 0; margin: 1.5rem 0; ( 24 / $rembase ) } ---------- Further reading http://snook.ca/archives/html_and_css/font-size-with-rem http://blog.typekit.com/2011/11/09/type-study-sizing-the-legible-letter/ To calculate golden ratio for font size and line height you will need these tools: http://www.pearsonified.com/typography/ http://cssleading.com Sizes in rem units for quick reference: 1px: 0.0625rem 2px: 0.125rem 3px: 0.1875rem 4px: 0.25rem 5px: 0.3125rem 6px: 0.375rem 7px: 0.4375rem 8px: 0.5rem 9px: 0.5625rem 10px: 0.625rem 11px: 0.6875rem 12px: 0.75rem 13px: 0.8125rem 14px: 0.875rem 15px: 0.9375rem 16px: 1rem 17px: 1.0625rem 18px: 1.125rem 19px: 1.1875rem 20px: 1.25rem 21px: 1.3125rem 22px: 1.375rem 23px: 1.4375rem 24px: 1.5rem 25px: 1.5625rem 26px: 1.625rem 27px: 1.6875rem 28px: 1.75rem 29px: 1.8125rem 30px: 1.875rem 31px: 1.9375rem 32px: 2rem 33px: 2.0625rem 34px: 2.125rem 35px: 2.1875rem 36px: 2.25rem 37px: 2.3125rem 38px: 2.375rem 39px: 2.4375rem 40px: 2.5rem 41px: 2.5625rem 42px: 2.625rem 43px: 2.6875rem 44px: 2.75rem 45px: 2.8125rem 46px: 2.875rem 47px: 2.9375rem 48px: 3rem */ /* Accessibility: Colors * All major background and text colors are recorded here. * Border and shadow colors are defined using rgba values. * Color contrast must meet a minimum of 4.5:1 luminosity ratio, or 3:1 for text rendered larger than 18pt/14pt bold * * For links: * A 4.5:1 contrast between the link text color and the background. * A 3:1 contrast between the link text color and the surrounding non-link text color. * More info at: http://webaim.org/blog/wcag-2-0-and-link-colors/ */ /* Site colors Green for icon-font: #6ba420 Green for blockquote: #6ba420 Orange for widget titles and hover link state: #ff6111 Body text color: #222 Content links: Link: #0066df Visited: #800080 Hover, active: #dd3811 Headings: #333 Entry title: In mobile view: #333 Link, visited: #000 Hover, active: #ff6111 Meta, comment links: Link, visited: #555 Hover, active: #dd3811 Sidebar and footer links: Link, visited: #555 Hover, active: #dd3811 Current and parent categories: #dd3811 */ /* Table of Contents: * * 1.0 - Normalize * 2.0 - Typography * 3.0 - Elements * 3.1 - FontAwesome webfont * 4.0 - Forms * 4.1 - General styles first * 4.2 - Buttons * 4.3 - Twitter Bootstrap style button * 5.0 - Navigation * 5.1 - Links * 5.2 - Menus * 5.3 - Post, archive navigation * 6.0 - Accessibility * 7.0 - Alignments * 8.0 - Clearings * 9.0 - Widgets * 9.1 - General widget styles * 9.2 - Specific widget styles * 9.3 - Footer widget styles * 10.0 - Header * 10.1 - Site Header * 11.0 - Content * 11.1 - Posts and pages * 11.2 - Post Formats * 11.3 - Comments * 11.4 - Page templates * 12.0 - Footer * 13.0 - Media * 13.1 - Images * 13.2 - Captions * 13.3 - Galleries * 14.0 - Other styles * 14.1 - Twitter Bootstrap style alerts * 14.2 - Misc. styles * 15.0 - Media queries * 15.1 - Minimum width of 783 pixels (small screens - mobile phones, small tablets in portrait view mode) * 15.2 - Minimum width of 1100 pixels (average size screens - monitors, small tablets in landscape view mode, larger tablets) * 15.3 - Minimum width of 1240 pixels (big screens - widescreen monitors, high resolution tablets) * 15.4 - Retina-specific styles. This style cannot be processed by LESS * 16.0 - Print * 16.1 - Comments * * ---------------------------------------------------------------------------- */ /* 1.0 Normalize -------------------------------------------------------------- */ html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; min-width: 320px; } body { margin: 0; min-width: 320px; } 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; } a { background-color: transparent; } a:active, a:hover { outline: 0; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } h1 { font-size: 2em; margin: 0.67em 0; } mark { background: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 1em 40px; } hr { box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"], input[type="email"] { -webkit-appearance: textfield; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration, input[type="email"]::-webkit-search-cancel-button, input[type="email"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /* 2.0 Typography -------------------------------------------------------------- */ /* Tip22 - Improve font rendering and fallback in Linux - http://www.onedesigns.com/tutorials/font-families-for-cross-compatible-typography */ body, button, input, select, textarea { color: #222; /* Improving font rendering in Linux, in case default Open Sans font is disabled */ font-family: Verdana, Geneva, "DejaVu Sans", sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.8; /* original: 1.714285714 */ text-rendering: optimizeLegibility; } body.custom-font-enabled { /* Improving font fallback in Linux */ font-family: "Open Sans", Verdana, Geneva, "DejaVu Sans", sans-serif; } h1, h2, h3, h4, h5, h6 { clear: both; font-weight: bold; margin: 0; text-align: left; } dfn, cite, em, i { font-style: italic; } /* Also check rtl.css in case you need to adjust blockquote styles for rtl language */ blockquote { color: #6ba420; font-size: 20px; font-size: 1.25rem; line-height: 1.6; padding: 0; margin: 12px 0 24px 48px; margin: 0.75rem 0 1.5rem 3rem; } /* Tip21 - Icon webfont support implementation and examples */ blockquote p:first-child:before { color: #6ba420; content: "\f10d"; /* fa-quote-left */ font: normal 36px/1 "FontAwesome"; margin-left: -48px; margin-left: -3rem; padding-right: 12px; padding-right: 0.75rem; vertical-align: bottom; } .comment-content blockquote { color: #555; font-size: 16px; font-size: 1rem; line-height: 1.667; margin: 12px 0 12px 34px; margin: 0.75rem 0 0.75rem 2.125rem; } .comment-content blockquote p:first-child:before { color: #8f8f8f; font: normal 24px/1 "FontAwesome"; margin-left: -34px; margin-left: -2.125rem; } blockquote p { margin-bottom: 12px; margin-bottom: 0.75rem; } blockquote > p:last-child { margin-bottom: 0; } blockquote cite, blockquote small { font-size: 75%; line-height: 1.6; } blockquote em, blockquote i, blockquote cite { font-style: italic; } blockquote cite { display: block; text-align: right; margin-top: 2px; margin-top: 0.125rem; } /* Tip37 - automatically style author's name in a blockquote. Author's name should be enclosed in . * * The symbol list for content: @link http://www.w3schools.com/charsets/ref_utf_punctuation.asp */ /* blockquote cite:before { content: "\2012\00a0"; } */ blockquote strong, blockquote b { font-weight: 700; } address { font-style: italic; margin: 0 0 24px; margin: 0 0 1.5rem; } code, kbd, tt, var, samp, pre { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } code { background-color: #f7f7f9; border: 1px solid #e1e1e8; color: #dd1144; font-size: 13px; font-size: 0.8125rem; padding: 2px 4px; padding: 0.125rem 0.25rem; white-space: pre; white-space: pre-wrap; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } pre { background-color: transparent; line-height: 1.2; margin: 24px 0; margin: 1.5rem 0; max-width: 100%; overflow: auto; white-space: pre; white-space: pre-wrap; word-break: break-all; word-wrap: break-word; } pre code { background-color: #f7f7f9; border: 1px solid #e1e1e8; color: inherit; display: block; line-height: 2; padding: 24px; padding: 1.5rem; word-break: normal; word-break: break-word; /* Non standard for webkit */ } abbr[title], acronym, dfn { border-bottom: 1px dotted #777; cursor: help; } mark, ins { background-color: #fff9c0; text-decoration: none; } small { font-size: 75%; } big { font-size: 125%; } /* 3.0 Elements -------------------------------------------------------------- */ html { box-sizing: border-box; } *, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; } body { background: #fff; /* Fallback for when there is no custom background color defined. */ } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 24px; margin-bottom: 1.5rem; } ul, ol { margin: 0 0 1.5rem 1.375rem; padding: 0; } ul { list-style: disc; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; } dl { margin-bottom: 24px; margin-bottom: 1.5rem; } dt { font-weight: bold; } dd { margin-bottom: 24px; margin-bottom: 1.5rem; } table, th, td { border: 1px solid #ccc; } table { border-collapse: separate; border-spacing: 0; border-width: 1px 0 0 1px; /* border-bottom: 1px solid #ededed; */ margin: 0 0 24px; margin: 0 0 1.5rem; table-layout: fixed; /* Prevents HTML tables from becoming too wide */ width: 100%; } caption, th, td { font-weight: normal; text-align: left; } th { border-width: 0 1px 1px 0; } td { border-width: 0 1px 1px 0; } th, td { padding: 0.4375rem; } thead tr { background-color: #eff7ff; } tbody tr:nth-child(even) { background-color: #f7f7f7; } tbody tr:nth-child(odd) { background-color: #fff; } img { -ms-interpolation-mode: bicubic; border: 0; height: auto; max-width: 100%; vertical-align: middle; } del { opacity: 0.8; } /* 3.1 FontAwesome webfont */ /* Tip21 - Icon webfont support implementation and examples * * All icon webfont related styles (except for Tip21 and Tip05) are in this section so it would be easy to change them * in case of migration to another icon webfont. */ .author-link:after, .byline:before, .cat-links:before, .comments-link:before, .content-area a[href$=pdf]:before, .content-area .icon-pdf:before, .content-area a[href$=doc]:before, .content-area a[href$=docx]:before, .content-area .icon-word:before, .content-area a[href$=xls]:before, .content-area a[href$=xlsx]:before, .content-area .icon-excel:before, .content-area a[href$=ppt]:before, .content-area a[href$=pptx]:before, .content-area .icon-powerpoint:before, .content-area a[href$=zip]:before, .content-area a[href$=rar]:before, .content-area a[href$=gz]:before, .content-area .icon-archive-file:before, .edit-link:before, .entry-format:before, .format-aside .entry-format:before, .format-image .entry-format:before, .format-link .entry-format:before, .format-quote .entry-format:before, .format-status .entry-format:before, .full-size-link:before, .icon-webfont, .posted-on:before, .tags-links:before, .author .page-title:before, .category .page-title:before, .date .page-title:before, .error-404 .page-title:before, .nav-previous a:before, .nav-next a:after, .pagination .prev:before, .pagination .next:after, .search-results .page-title:before, .search-no-results .page-title:before, .sticky .page-title:before, .tag .page-title:before, .post-password-required .entry-title:before, .status-private .entry-title:before, .entry-content a[target=_blank]:link:after, .entry-content .more-link:after, .entry-summary .more-link:after, .entry-header .title-comment-meta a:before, .nav-menu .menu-item-has-children > a:after, .nav-menu .page_item_has_children > a:after, .sub-menu .menu-item-has-children > a:after, .sub-menu .page_item_has_children > a:after, .social-navigation a, .social-navigation a:before, ul.list-icon-ok li:before, ul.list-icon-file li:before, ul.list-icon-hand-right li:before { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-family: FontAwesome; font-size: 16px; font-size: 1rem; font-style: normal; font-weight: normal; font-variant: normal; line-height: 1; speak: none; text-rendering: auto; text-align: center; text-decoration: inherit; text-transform: none; } a.icon-webfont, a .icon-webfont, a:hover.icon-webfont, a:hover .icon-webfont, a:active.icon-webfont, a:active .icon-webfont, .entry-content a[target=_blank]:link:after { text-decoration: none!important; } .author .page-title:before, .category .page-title:before, .date .page-title:before, .error-404 .page-title:before, .search-results .page-title:before, .search-no-results .page-title:before, .sticky .page-title:before, .tag .page-title:before, .post-password-required .entry-title:before, .status-private .entry-title:before { font-size: 28px; font-size: 1.75rem; padding-right: 10px; padding-right: 0.625rem; vertical-align: middle; } .author .page-title:before { content: "\f007"; } .category .page-title:before { content: "\f07c"; } .date .page-title:before { content: "\f073"; vertical-align: baseline; } .error-404 .page-title:before, .search-no-results .page-title:before { content: "\f071"; } .search-results .page-title:before { content: "\f002"; } .sticky .page-title:before{ content: "\f0eb"; vertical-align: baseline; } .tag .page-title:before { content: "\f02c"; } .post-password-required .entry-title:before { color: #ff0000; content: "\f023"; padding-right: 5px; padding-right: 0.3125rem; vertical-align: baseline; } .status-private .entry-title:before { color: #ff0000; content: "\f007"; padding-right: 5px; padding-right: 0.3125rem; vertical-align: baseline; } /* Tip23 - Mark links to documents with corresponding icons for PDF, Word, Excel, PowerPoint and archive documents. * * You can always invoke document icons with classes: icon-pdf, icon-word, icon-excel, icon-powerpoint, icon-archive-file * * To activate automatic icon placement on links to the documents, uncomment next block of CSS rules. * * 7z extension was non added because it produces error, most likelly because of lack of MIME type support on some servers: * https://stackoverflow.com/questions/18562580/possible-to-add-mime-type-to-web-config-without-possibly-breaking-the-site */ /* .content-area a[href$=pdf]:before, .content-area a[href$=doc]:before, .content-area a[href$=docx]:before, .content-area a[href$=xls]:before, .content-area a[href$=xlsx]:before, .content-area a[href$=ppt]:before, .content-area a[href$=pptx]:before, .content-area a[href$=zip]:before, .content-area a[href$=rar]:before, .content-area a[href$=gz]:before { font-size: 18px; font-size: 1.125rem; padding-right: 5px; padding-right: 0.3125rem; vertical-align: baseline; } .content-area a[href$=pdf]:before { color: #bb0706; content: "\f1c1"; } .content-area a[href$=doc]:before, .content-area a[href$=docx]:before { color: #2a5699; content: "\f1c2"; } .content-area a[href$=xls]:before, .content-area a[href$=xlsx]:before { color: #207245; content: "\f1c3"; } .content-area a[href$=ppt]:before, .content-area a[href$=pptx]:before { color: #d24625; content: "\f1c4"; } .content-area a[href$=zip]:before, .content-area a[href$=rar]:before, .content-area a[href$=gz]:before { color: #428f27; content: "\f1c6"; } */ /* Do not add file type icon to buttons */ /* .content-area a.btn[href$=pdf]:before, .content-area a.btn[href$=doc]:before, .content-area a.btn[href$=docx]:before, .content-area a.btn[href$=xls]:before, .content-area a.btn[href$=xlsx]:before, .content-area a.btn[href$=ppt]:before, .content-area a.btn[href$=pptx]:before, .content-area a.btn[href$=zip]:before, .content-area a.btn[href$=rar]:before, .content-area a.btn[href$=gz]:before { content: none; } */ .content-area .icon-pdf:before, .content-area .icon-word:before, .content-area .icon-excel:before, .content-area .icon-powerpoint:before, .content-area .icon-archive-file:before { font-size: 18px; font-size: 1.125rem; padding-right: 5px; padding-right: 0.3125rem; vertical-align: baseline; } .content-area .icon-pdf:before { color: #bb0706; content: "\f1c1"; } .content-area .icon-word:before { color: #2a5699; content: "\f1c2"; } .content-area .icon-excel:before { color: #207245; content: "\f1c3"; } .content-area .icon-powerpoint:before { color: #d24625; content: "\f1c4"; } .content-area .icon-archive-file:before { color: #428f27; content: "\f1c6"; } /* Remaining css for webfont icons is plugged-in via functions.php */ /* 4.0 Forms -------------------------------------------------------------- */ /* 4.1 General styles first */ button, input, select, textarea { border: 1px solid #ccc; border-radius: 3px; font-family: inherit; padding: 6px; padding: 0.375rem; } button, input { line-height: normal; hyphens: none; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; } textarea { font-size: 100%; overflow: auto; vertical-align: top; } /* Tip83 - Make focused input fields glow - from Twitter Bootstrap */ textarea:focus, input:focus { border-color: rgba(82, 168, 236, 0.8); outline: 0; outline: thin dotted \9; /* IE6-9 hack */ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); } /* 4.2 Buttons */ .btn, .menu-toggle, input[type="submit"], input[type="button"], input[type="reset"], article.post-password-required input[type=submit], .bypostauthor cite .post-author-label { /* Twitter Bootstrap .btn style */ display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: normal; line-height: 1.42857143; text-align: center; white-space: nowrap; /*vertical-align: middle;*/ -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 4px; /* End - Twitter Bootstrap .btn style */ background-color: #e6e6e6; background-repeat: repeat-x; background-image: -moz-linear-gradient(top, #f4f4f4, #e6e6e6); background-image: -ms-linear-gradient(top, #f4f4f4, #e6e6e6); background-image: -webkit-linear-gradient(top, #f4f4f4, #e6e6e6); background-image: -o-linear-gradient(top, #f4f4f4, #e6e6e6); background-image: linear-gradient(top, #f4f4f4, #e6e6e6); border: 1px solid #ccc; border-radius: 3px; -webkit-box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1); -moz-box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1); box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1); color: #5a5a5a; } .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus, .menu-toggle:focus, button:focus, input[type="submit"]:focus, input[type="button"]:focus, input[type="reset"]:focus, article.post-password-required input[type=submit]:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .btn:hover, .btn:focus, .btn.focus, .menu-toggle:hover, button:hover, button:focus, input[type="submit"]:hover, input[type="submit"]:focus, input[type="button"]:hover, input[type="button"]:focus, input[type="reset"]:hover, input[type="reset"]:focus, article.post-password-required input[type=submit]:hover, article.post-password-required input[type=submit]:focus { color: #333; text-decoration: none; background-color: transparent; /* Back compat. for IE8 */ background-color: rgba(0%, 0%, 0%, 0.045); background-image: none; } .btn:active, .btn.active, .menu-toggle:active, .menu-toggle.toggled-on, button:active, input[type="submit"]:active, input[type="button"]:active, input[type="reset"]:active { color: #333; text-decoration: none; background-color: transparent; /* Back compat. for IE8 */ background-color: rgba(0%, 0%, 0%, 0.1); background-image: none; outline: 0; } button[disabled], input[disabled], .btn.disabled, .btn[disabled], fieldset[disabled] .btn { cursor: not-allowed; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; opacity: .65; } a.btn.disabled, fieldset[disabled] a.btn { pointer-events: none; } .btn-lg { padding: 10px 16px; font-size: 18px; line-height: 1.3333333; border-radius: 6px; } .btn-sm { padding: 5px 10px; font-size: 12px; line-height: 1.5; border-radius: 3px; } .btn-xs { padding: 1px 5px; font-size: 12px; line-height: 1.5; border-radius: 3px; } .btn + .btn { margin: 12px 0; margin: 0.75rem 0; } /* 4.3 Twitter Bootstrap style buttons */ /* Find more custom Twitter BootStrap style button examples at http://charliepark.org/bootstrap_buttons/ */ .btn-custom-blue { background-color: hsl(200, 100%, 30%) !important; /* blue color */ background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00a9ff", endColorstr="#006599"); background-image: -khtml-gradient(linear, left top, left bottom, from(#00a9ff), to(#006599)); background-image: -moz-linear-gradient(top, #00a9ff, #006599); background-image: -ms-linear-gradient(top, #00a9ff, #006599); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #00a9ff), color-stop(100%, #006599)); background-image: -webkit-linear-gradient(top, #00a9ff, #006599); background-image: -o-linear-gradient(top, #00a9ff, #006599); background-image: linear-gradient(#00a9ff, #006599); border-color: #006599 #006599 hsl(200, 100%, 25%); color: #fff !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .btn-custom-orange { background-color: hsl(25, 100%, 41%) !important; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fe8a38", endColorstr="#d15700"); background-image: -khtml-gradient(linear, left top, left bottom, from(#fe8a38), to(#d15700)); background-image: -moz-linear-gradient(top, #fe8a38, #d15700); background-image: -ms-linear-gradient(top, #fe8a38, #d15700); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fe8a38), color-stop(100%, #d15700)); background-image: -webkit-linear-gradient(top, #fe8a38, #d15700); background-image: -o-linear-gradient(top, #fe8a38, #d15700); background-image: linear-gradient(#fe8a38, #d15700); border-color: #d15700 #d15700 hsl(25, 100%, 36%); color: #fff !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .btn-custom-red { background-color: hsl(0, 100%, 30%) !important; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff0000", endColorstr="#990000"); background-image: -khtml-gradient(linear, left top, left bottom, from(#ff0000), to(#990000)); background-image: -moz-linear-gradient(top, #ff0000, #990000); background-image: -ms-linear-gradient(top, #ff0000, #990000); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff0000), color-stop(100%, #990000)); background-image: -webkit-linear-gradient(top, #ff0000, #990000); background-image: -o-linear-gradient(top, #ff0000, #990000); background-image: linear-gradient(#ff0000, #990000); border-color: #990000 #990000 hsl(0, 100%, 25%); color: #fff !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .btn-custom-green { background-color: hsl(110, 100%, 24%) !important; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#25e000", endColorstr="#147a00"); background-image: -khtml-gradient(linear, left top, left bottom, from(#25e000), to(#147a00)); background-image: -moz-linear-gradient(top, #25e000, #147a00); background-image: -ms-linear-gradient(top, #25e000, #147a00); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #25e000), color-stop(100%, #147a00)); background-image: -webkit-linear-gradient(top, #25e000, #147a00); background-image: -o-linear-gradient(top, #25e000, #147a00); background-image: linear-gradient(#25e000, #147a00); border-color: #147a00 #147a00 hsl(110, 100%, 19%); color: #fff !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .btn-custom-black { background-color: hsl(0, 0%, 16%) !important; background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5b5b5b", endColorstr="#282828"); background-image: -khtml-gradient(linear, left top, left bottom, from(#5b5b5b), to(#282828)); background-image: -moz-linear-gradient(top, #5b5b5b, #282828); background-image: -ms-linear-gradient(top, #5b5b5b, #282828); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5b5b5b), color-stop(100%, #282828)); background-image: -webkit-linear-gradient(top, #5b5b5b, #282828); background-image: -o-linear-gradient(top, #5b5b5b, #282828); background-image: linear-gradient(#5b5b5b, #282828); border-color: #282828 #282828 hsl(0, 0%, 11%); color: #fff !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* 5.0 Navigation -------------------------------------------------------------- */ /* 5.1 Links */ /* Default link colors, if used in alerts, would not comply with accessibility text contrast requirements, that's why * it's better to use "alert-link" class for the links inside alert boxes. */ a { color: #0066df; } a:visited { color: #800080; } a:hover, a:active, a:focus { color: #dd3811; text-decoration: none; } a:hover, a:active { outline: 0; } a:focus { outline: thin dotted; } /* Button-like links */ a.btn, .widget-area .textwidget a.btn, .btn a, .widget-area .textwidget .btn a { text-decoration: none; color: #5a5a5a; } a.btn:hover, .widget-area .textwidget a.btn:hover, .btn a:hover, .widget-area .textwidget .btn a:hover { text-decoration: none; } /* 5.2 Menus */ /* Make WP admin-bar sticky from the beginning for a consistent user experience and avoid theme menu covering it */ #wpadminbar{ position:fixed; } /* Small (mobile) menu */ .main-navigation { position: fixed; top: 0px; right: 0px; height: 42px; width: 100%; display: inline-block; margin-top: 0; z-index: 300; background-color: #3a3a3a; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4); } /* Make theme admin-bar-aware */ body.admin-bar .main-navigation { margin-top: 46px; margin-top: 2.875rem; } /* Make scrollable long menu that extends over the screen limits */ .main-navigation.toggled { overflow-y: auto; /* if auto is not working, use scroll */ height: 100%; width: 100%; background-color: #3a3a3a; } /* .go-to-top { float: right; } */ /* From Expound css/reset.css */ .main-navigation .menu-toggle { display: none; cursor: pointer; border: none; } .main-navigation ul { display: none; } /* From Expound css/expound.css */ .site-header .menu-toggle { background: #3a3a3a; width: 100px; color: #fff; font: 16px/16px Verdana, Geneva, "DejaVu Sans", sans-serif; font-weight: 300; padding: 10px 20px; padding: 0.625rem 1.25rem; float: right; overflow: hidden; } .site-header .menu-toggle:hover, .site-header .menu-toggle:focus { background: #474747; } .site-header .menu-toggle:before { content: "\2261"; font-size: 20px; font-size: 1.25rem; margin-right: 7px; margin-right: 0.4375rem; vertical-align: baseline; } .main-navigation .menu-toggle, .main-navigation.toggled .nav-menu { display: block; clear: both; } .main-navigation > ul { display: none; } .main-navigation ul ul { display: block; } .main-navigation.toggled .menu-toggle { background: #474747; } .main-navigation.toggled ul { margin: 0; list-style: none; } .main-navigation.toggled li { float: none; } .main-navigation.toggled a { display: block; color: #fff; padding: 10px 40px; padding: 0.625rem 2.5rem; text-decoration: none; } .main-navigation.toggled a:after { border-style: none !important; } .main-navigation.toggled li a { display: block; float: none; background: #3a3a3a; } .main-navigation.toggled li a:hover, .main-navigation.toggled li a:focus { background: #474747; } .main-navigation.toggled ul ul, .main-navigation.toggled ul ul ul { position: static; left: 0; top: 0; margin: 0; padding: 0; float: none; } .main-navigation.toggled ul ul a { padding-left: 60px; padding-left: 4.285714286rem; width: auto; } .main-navigation.toggled ul ul ul a { padding-left: 80px; padding-left: 5.714285714rem; width: auto; } .main-navigation.toggled ul > .current_page_item > a, .main-navigation.toggled ul > .current-menu-item > a { background: #117bb8; } /* Tip10 - Add Twenty Thirteen search form to WordPress nav menu */ .menu-item.menu-item-search { float: right; margin: 4px 0 0 0; margin: 0.25rem 0 0 0; } .site-header input[type="search"], .site-header input[type="email"] { -webkit-appearance: textfield; padding-right: 2px; /* Don't cut off the webkit search cancel button */ padding-right: 0.125rem; width: 270px; width: 19.285714286rem; } .site-header input[type="search"]:-webkit-search-decoration, .site-header input[type="email"]:-webkit-search-decoration { -webkit-appearance: none; } .site-header .search-form [type="search"], .site-header .search-form [type="email"], .site-header .search-form [type="text"] { background-color: transparent; background-image: url(images/icon-search.png); background-position: 5px center; background-repeat: no-repeat; background-size: 24px 24px; border: none; cursor: pointer; height: 28px; margin: 3px 0; margin: 0.1875rem 0; padding: 0 34px 0 0; padding: 0 2.125rem 0 0; position: relative; -webkit-transition: width 400ms ease, background 400ms ease; transition: width 400ms ease, background 400ms ease; width: 0; } .site-header .search-form [type="search"]:focus, .site-header .search-form [type="email"]:focus, .site-header .search-form [type="text"]:focus { background-color: #f5f5f5; border: 1px solid #bbb; cursor: text; outline: 0; width: 230px; width: 16.428571429rem; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .site-header .search-form [type="submit"] { display: none; } /* Search form for mobile menu */ .site-header .search-container .search-form [type="search"], .site-header .search-container .search-form [type="email"], .site-header .search-container .search-form [type="text"] { float: left; background-image: url(images/icon-search.png); background-position: right center; margin: 7px 0 0 6px; margin: 0.4375rem 0 0 0.375rem; background-color: #d0d0d0; width: 130px; width: 9.285714286rem; } .site-header .search-container .search-form [type="search"]:focus, .site-header .search-container .search-form [type="email"]:focus, .site-header .search-container .search-form [type="text"]:focus { background-color: #f5f5f5; border: 0; width: 50%; } /* Tip85 - Add Social Media Menu. Read more: http://justintadlock.com/archives/2013/08/14/social-nav-menus-part-2 */ .social-navigation ul { list-style: none; text-align: center; text-align: right; } .social-navigation ul li { display: inline; margin: 0 0 0 16px; margin: 0 0 0 1rem; } .social-navigation ul li:first-child { margin: 0; } .social-navigation a { position: relative; text-decoration: none; } .social-navigation a:hover:before, .social-navigation a:focus:before { opacity: 0.75; } .social-navigation a:before { content: "\f1e0"; /* mark unsupported links with generic "share" icon */ color: #000; font-size: 36px; font-size: 2.25rem; line-height: 1.1; } .social-navigation a[href*="mailto:"]:before { content: "\f003"; color: #000; } .social-navigation a[href*="behance.net"]:before { content: "\f1b4"; color: #000; } .social-navigation a[href*="codepen.io"]:before { content: "\f1cb"; color: #000; } .social-navigation a[href*="digg.com"]:before { content: "\f1a6"; color: #000; } .social-navigation a[href*="dribbble.com"]:before { content: "\f17d"; color: #ea4c89; } .social-navigation a[href*="dropbox.com"]:before { content: "\f16b"; color: #007ee5; } .social-navigation a[href*="facebook.com"]:before { content: "\f082"; color: #3b5998; } .social-navigation a[href*="flickr.com"]:before { content: "\f16e"; color: #ff0084; } .social-navigation a[href*="foursquare.com"]:before { content: "\f180"; color: #f84777; } .social-navigation a[href*="plus.google.com"]:before { content: "\f0d4"; color: #dd4b39; } .social-navigation a[href*="github.com"]:before { content: "\f09b"; color: #4183c4; } .social-navigation a[href*="instagram.com"]:before { content: "\f16d"; color: #3f729b; } .social-navigation a[href*="last.fm"]:before { content: "\f202"; color: #d51007; } .social-navigation a[href*="linkedin.com"]:before { content: "\f08c"; color: #0e76a8; } .social-navigation a[href*="pinterest.com"]:before { content: "\f0d2"; color: #c8232c; } /* .social-navigation a[href*="polldaddy.com"]:before { content: "\f"; color: #bc0b0b; } */ /* .social-navigation a[href*="getpocket.com"]:before { content: "\f"; color: #ee4056; } */ .social-navigation a[href*="reddit.com"]:before { content: "\f1a1"; color: #336699; } .social-navigation a[href*="skype.com"]:before, .social-navigation a[href*="skype:"]:before { content: "\f17e"; color: #00aff0; } .social-navigation a[href*="soundcloud.com"]:before { content: "\f1be"; color: #ff4700; } .social-navigation a[href*="spotify.com"]:before { content: "\f1bc"; color: #a9d03f; } .social-navigation a[href*="stumbleupon.com"]:before { content: "\f1a4"; color: #ff2618; } .social-navigation a[href*="tumblr.com"]:before { content: "\f173"; color: #34526f; } .social-navigation a[href*="twitch.tv"]:before { content: "\f1e8"; color: #6542a6; } .social-navigation a[href*="twitter.com"]:before { content: "\f099"; color: #33ccff; } .social-navigation a[href*="vimeo.com"]:before { content: "\f194"; color: #1ab7ea; } .social-navigation a[href*="vk.com"]:before { content: "\f189"; color: #4c75a3; } .social-navigation a[href*="wordpress.org"]:before, .social-navigation a[href*="wordpress.com"]:before { content: "\f19a"; color: #21759b; } .social-navigation a[href*="xing.com"]:before { content: "\f168"; color: #015a60; } .social-navigation a[href*="youtube.com"]:before { content: "\f167"; color: #c4302b; } .social-navigation a[href$="/feed/"]:before { content: "\f143"; color: #fb9f3b; } /* Tip86 - Style social icons manualy added in the sidebar. Check also media queries for additional styles. */ .widget-area .widget .social-link { font-size: 30px; font-size: 1.875rem; /* Increasing spacing for tap targets */ line-height: 1.2; margin: 0 24px 24px 0; margin: 0 1.5rem 1.5rem 0; vertical-align: middle; } .widget-area .widget a.social-link, .widget-area .widget a .social-link, .widget-area .widget a:visited.social-link, .widget-area .widget a:visited .social-link { color: #777; } .widget-area .widget a:hover.social-link, .widget-area .widget a:hover .social-link, .widget-area .widget a:active.social-link, .widget-area .widget a:active .social-link, .widget-area .widget a:focus.social-link, .widget-area .widget a:focus .social-link { color: #ff6111; } /* 5.3 Post, archive navigation */ /* .post-navigation, .nav-previous and .nav-next - prev/next post navigation * .pagination and .page-numbers - prev/next posts page (archive) navigation * .nav-links is for post, archive and comment navigations. */ /* Tip27 - Uncomment next code line to disable "previous article - next article" navigation below the content of a post */ /* .post-navigation { display: none; } */ .pagination { margin-bottom: 44px; /* Equal bottom margin matching top margin would be 48px, but adjusting to make it visually appear equal */ margin-bottom: 2.75rem; position: relative; text-align: center; } /* Do not display archive navigation page numbers in mobile view */ .pagination .page-numbers { display: none; } .pagination .prev, .pagination .next { display: inline-block; width: auto; position: absolute; } .pagination .prev { left: 0; text-align: left; } .pagination .next { right: 0; text-align: right; } .nav-links { font-size: 18px; font-size: 1.125rem; line-height: 28px; line-height: 1.75rem; overflow: hidden; /* It can hide some focus outlines, but for now it's not too bad */ } .nav-previous { float: left; width: 48%; } .nav-next { float: right; text-align: right; width: 48%; } /* Tip88 - Customize color scheme: Navigation links for archive and single views (Previous, Next page of articles and article) */ .nav-links a, .nav-links a:visited { color: #FAA61C; -webkit-tap-highlight-color: rgba(255, 97, 17, 1); text-decoration: none; font-weight: bold; font-weight: 700; } .nav-links a:hover, .nav-links a:active { text-decoration: underline; } .nav-links a:focus { background-color: #FAA61C; color: #fff; text-decoration: none; } .nav-links a:before, .nav-links a:after, .pagination .prev:before, .pagination .next:after { font-size: inherit; font-weight: bold; font-weight: 700; text-decoration: none; } .nav-previous a:before, .pagination .prev:before { content: "\f100"; /* fa-angle-double-left */ padding-right: 5px; padding-right: 0.3125rem; } .nav-next a:after, .pagination .next:after { content: "\f101"; /* fa-angle-double-right */ padding-left: 5px; padding-left: 0.3125rem; } .post-navigation + .comments-area, #comment-nav-above { margin: 48px 0; margin: 3rem 0; } .entry-content .page-links { clear: both; margin-bottom: 24px; margin-bottom: 1.5rem; } .entry-content .page-links > .page-links-title { border: 0; font-size: 16px; font-size: 1rem; color: #222; height: auto; margin: 0; padding-right: 0.5rem; width: auto; } .single .entry-content .page-links > .page-links-title { /* font-size: ; */ } .entry-content .page-links a, .entry-content .page-links > span { border: 1px solid #eaeaea; border: 1px solid rgba(51, 51, 51, 0.1); display: inline-block; font-size: 13px; font-size: 0.8125rem; height: 1.75rem; width: 1.75rem; line-height: 2; margin: 0 14px 5px 0; margin: 0 0.875rem 0.3125rem 0; text-align: center; } .entry-content .page-links a, .entry-content .page-links a:visited { background-color: #333; border-color: #333; color: #fff; -webkit-tap-highlight-color: rgba(255, 255, 255, 0.3); text-decoration: none; } .entry-content .page-links a:hover, .entry-content .page-links a:focus { background-color: #707070; background-color: rgba(51, 51, 51, 0.7); border-color: transparent; color: #fff; } /* 6.0 Accessibility -------------------------------------------------------------- */ /* Text meant only for screen readers */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); height: 1px; width: 1px; overflow: hidden; position: absolute !important; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 13px; font-size: 0.8125rem; font-weight: bold; height: auto; line-height: normal; padding: 15px 23px 14px; padding: 0.9375rem 1.4375rem 0.875rem; position: absolute; left: 5px; top: 5px; text-decoration: none; width: auto; z-index: 100000; /* Above WP toolbar */ } .skiplink .screen-reader-text:focus { background: #fff; border: 2px solid #333; border-radius: 3px; clip: auto !important; color: #000; display: block; font-size: 13px; font-size: 0.8125rem; padding: 12px; position: absolute; top: 5px; left: 5px; z-index: 100000; /* Above WP toolbar */ } .skiplink .screen-reader-text:hover { text-decoration: underline; } /* 7.0 Alignments -------------------------------------------------------------- */ .alignleft { float: left; } .alignright { float: right; } .aligncenter { display: block; margin-left: auto; margin-right: auto; } img.alignleft, figure.wp-caption.alignleft, .wp-caption.alignleft { margin: 12px 24px 12px 0; margin: 0.75rem 1.5rem 0.75rem 0; } img.alignright, figure.wp-caption.alignright, .wp-caption.alignright { margin: 12px 0 12px 24px; margin: 0.75rem 0 0.75rem 1.5rem; } img.aligncenter, .wp-caption.aligncenter { clear: both; margin: 24px auto 24px auto; margin: 1.5rem auto 1.5rem auto; } /* Prevent very large image with a caption and without alignment overflowing the content */ img.alignnone, figure.wp-caption.alignnone { margin: 24px auto 24px auto; margin: 1.5rem auto 1.5rem auto; } /* Do not add top margin if image is at the top of the post */ .entry-content img.aligncenter:first-child, .entry-content figure.aligncenter:first-child, .entry-content img.alignnone:first-child, .entry-content figure.alignnone:first-child { margin-top: 0; } div.wp-caption.alignright img[class*="wp-image-"], figure.alignright img[class*="wp-image-"], div.wp-caption.alignright .wp-caption-text, figure.alignright .wp-caption-text { padding-left: 0; padding-right: 0; } /* 8.0 Clearings -------------------------------------------------------------- */ .clear { *zoom: 1; } .clear:after, .site:after, .site-header:after, .site-content:after, .site-footer:after, .main-navigation:after, .content-area nav:after, .entry-content:after, .entry-meta, .entry-meta:after, .comment-content:after, .comment-navigation:after, .gallery:after, .textwidget:after, .format-status .entry-header:after { clear: both; } .clear:before, .clear:after, .site:before, .site:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after, .entry-content:before, .entry-content:after, .content-area nav:before, .content-area nav:after, .comment-content:before, .comment-content:after, .comment-navigation:before, .comment-navigation:after, .gallery:before, .gallery:after, .textwidget:before, .textwidget:after, .format-status .entry-header:before, .format-status .entry-header:after { display: table; content: ""; line-height: 0; } /* 9.0 Widgets -------------------------------------------------------------- */ /* Sidebar and Front Page template widgets get top border in mobile view */ #secondary { border-top: 1px solid #ededed; margin: 72px auto 48px auto; margin: 4.5rem auto 3rem auto; padding: 24px 0 0 0; padding: 1.5rem 0 0 0; } #secondary { background: #fff; /* Old browsers */ /* IE10 Consumer Preview */ background-image: -ms-radial-gradient(center top, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Mozilla Firefox */ background-image: -moz-radial-gradient(center top, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Opera */ background-image: -o-radial-gradient(center top, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(radial, center top, 0, center top, 487, color-stop(0, #fbfbfb), color-stop(1, #ffffff)); /* Webkit (Chrome 11+) */ background-image: -webkit-radial-gradient(center top, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* W3C Markup, IE10 Release Preview */ background-image: radial-gradient(circle closest-corner at center top, #fbfbfb 0%, #ffffff 100%); } .site-footer .widget-area { margin: 12px 0 0; margin: 0.75rem 0 0; } /* 9.1 General widget styles */ .widget-title { font-size: 27px; font-size: 1.6875rem; font-weight: normal; line-height: 1.4; text-transform: uppercase; color: #ff6111; /* Experimenting with text outline for better accessibility in text of light color */ /* text-shadow: 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000; */ } .widget-area .widget { word-break: normal; word-break: break-word; /* Non standard for webkit */ word-wrap: break-word; -ms-word-wrap: break-word; /* For IE8 */ -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; margin-bottom: 24px; margin-bottom: 1.5rem; color: #555; } .widget-area .widget p:first-child { margin-top: 0; /* remove top margin of the first paragraph, when "Automatically add paragraphs" is selected for the Text widget */ } .widget-area .widget a, .widget-area .widget a:visited { color: #555; text-decoration: none; } .widget-area .widget a:hover, .widget-area .widget a:active, .widget-area .widget a:focus { color: #dd3811; text-decoration: underline; } /* Protecting select field from overflow */ .widget-area .widget select, .widget-area .widget option { width: auto; max-width: 100%; overflow: hidden; } .widget-area .widget h3 { margin-bottom: 24px; margin-bottom: 1.5rem; } .widget-area .widget p, .widget-area .widget li { font-size: 14px; font-size: 0.875rem; } .widget-area .widget li { list-style-type: none; color: #555; } .widget-area .widget p { margin-bottom: 24px; margin-bottom: 1.5rem; } .widget-area .widget ul li { text-indent: 0; /* Because of the default icon webfont ul formatting */ } .widget-area .widget ul ul { margin-left: 12px; margin-left: 0.75rem; } /* 9.2 Specific widget styles */ .widget_recent_entries .post-date, .widget_rss .rss-date { color: #6e6e6e; font-size: 11px; font-size: 0.6875rem; margin-left: 12px; margin-left: 0.75rem; } .widget_rss .widget-title a, .widget_rss .widget-title a:visited { color: #ff6111; } .widget_rss li { margin: 12px 0; margin: 0.75rem 0; } .widget_archive ul, .widget_categories ul, .widget_meta ul, .widget_pages ul, .widget_rss ul, .widget_recent_entries ul, .widget_recent_comments ul, .widget_nav_menu ul, #copyright-widget { margin-left: 0; } .widget_recent_entries li, .widget_recent_comments li { color: #555; list-style-type: none; } /* Tip53 - Change vertical spacing between lines in Recent Posts widget. If your post titles are rather short, 12px will be a good choice */ .widget_recent_entries li, .widget_recent_comments li, .widget_rss li { margin-bottom: 24px; margin-bottom: 1.5rem; /* margin-bottom: 12px; margin-bottom: 0.75rem; */ } .widget-area .textwidget ul { list-style: disc outside; margin: 0 0 24px; margin: 0 0 1.5rem; } .widget-area .textwidget li { margin-left: 36px; margin-left: 2.25rem; } .site-footer .widget-area .textwidget li { margin-left: 0; padding-bottom: 0; } .widget-area .widget .textwidget { font-size: 13px; font-size: 0.8125rem; } .widget-area .textwidget a, .widget-area .textwidget a:visited { color: #555; text-decoration: underline; } .widget-area .textwidget a:hover, .widget-area .textwidget a:active, .widget-area .textwidget a:focus { color: #dd3811; text-decoration: underline; } .widget_twitter li { list-style-type: none; } .widget_twitter .timesince { display: block; text-align: right; } .widget_search label, .widget_search .search-field { font-size: 14px; font-size: 0.875rem; } .widget-area #s { width: 53.66666666666%; /* define a width to avoid dropping a wider submit button */ } /* Styles for Categories and Pages widgets */ .widget-area .widget_categories ul, .widget-area .widget_nav_menu ul { margin-bottom: 12px; margin-bottom: 0.75rem; } .widget-area .widget_categories ul li, .widget-area .widget_nav_menu ul li { font-size: 18px; font-size: 1.125rem; text-transform: uppercase; } .widget-area .widget_categories ul ul li, .widget-area .widget_nav_menu ul ul li { list-style: square; font-size: 13px; font-size: 0.8125rem; font-weight: normal; margin-left: 12px; margin-left: 0.75rem; text-transform: none; } .widget-area .widget_categories a, .widget-area .widget_categories a:visited, .widget-area .widget_nav_menu a, .widget-area .widget_nav_menu a:visited { color: #555; text-decoration: none; } .widget-area .widget_categories a:hover, .widget-area .widget_categories a:focus, .widget-area .widget_nav_menu a:hover, .widget-area .widget_nav_menu a:focus, .widget-area .widget .children li.cat-item a:hover, .widget-area .widget .children li.cat-item a:focus, .widget-area .widget .children li.page_item a:hover, .widget-area .widget .children li.page_item a:focus, .widget-area .widget .current-cat-parent a, .widget-area .widget .current-cat-parent a:visited, .widget-area .widget .current_page_parent a, .widget-area .widget .current_page_parent a:visited { color: #dd3811; } .widget-area .widget .current-cat .cat-item a, .widget-area .widget .current-cat .cat-item a:visited, .widget-area .widget .current-cat-parent .cat-item a, .widget-area .widget .current-cat-parent .cat-item a:visited, .widget-area .widget .current_page_item .page_item a, .widget-area .widget .current_page_item .page_item a:visited, .widget-area .widget .current_page_parent .page_item a, .widget-area .widget .current_page_parent .page_item a:visited { color: #555; } .widget-area .widget .current-cat-parent .current-cat, .widget-area .widget .current-cat-parent .current-cat a, .widget-area .widget .current-cat-parent .current-cat a:visited, .widget-area .widget .current_page_parent .current_page_item, .widget-area .widget .current_page_parent .current_page_item a, .widget-area .widget .current_page_parent .current_page_item a:visited, .widget-area .widget .current-cat, .widget-area .widget .current-cat a, .widget-area .widget .current-cat a:visited, .widget-area .widget .current_page_item, .widget-area .widget .current_page_item a, .widget-area .widget .current_page_item a:visited { color: #dd3811; } /* Tip51 - Show children items of category/page menu for selected parent category/page only. Change to display: block; if you don't to hide menu children. */ .widget-area .widget li.cat-item ul.children { display: none; } .widget-area .widget li.current-cat ul.children, .widget-area .widget li.current-cat-parent ul.children { display: block; } /* Show children items of page menu for selected parent page only. Change to display: block; if you don't to hide menu children. */ .widget-area .widget li.page_item ul.children { display: none; } .widget-area .widget li.current_page_item ul.children, .widget-area .widget li.current_page_parent ul.children { display: block; } #wp-calendar { margin: 0; width: 100%; font-size: 13px; font-size: 0.8125rem; color: #686868; } #wp-calendar th, #wp-calendar td, #wp-calendar caption { text-align: center; } #wp-calendar caption { font-weight: bold; margin-bottom: 5px; margin-bottom: 0.3125rem; } #wp-calendar tfoot td.pad, #wp-calendar td#prev { border-width: 0 0 1px 0; } #wp-calendar td#next { border-width: 0 1px 1px 0; } #wp-calendar #next { padding-right: 24px; padding-right: 1.5rem; text-align: right; } #wp-calendar #prev { padding-left: 24px; padding-left: 1.5rem; text-align: left; } #wp-calendar a { font-weight: bold; } #wp-calendar #prev a, #wp-calendar #next a { font-weight: bold; } .widget_tag_cloud { line-height: 1.2; } /* 9.3 Footer widget styles */ /* Four footer widget areas. Additional styles at 15.0 Media queries */ #footer-widgets { width: 100%; border-top: none; margin-bottom: 10px; margin-bottom: 0.625rem; } #footer-widgets.three #footer-widget-left, #footer-widgets.three #footer-widget-middle, #footer-widgets.three #footer-widget-right { width: 100%; float: none; padding-left: 0; padding-right: 0; padding-top: 1em; } #footer-widgets a, #footer-widgets a:visited { color: #555; text-decoration: none; } #footer-widgets a:hover, #footer-widgets a:active, #footer-widgets a:focus { color: #dd3811; text-decoration: underline; } #copyright-widget, #copyright-widget .widget, #copyright-widget .widget div { display: inline; } #copyright-widget section { margin-left: 0; padding-bottom: 0; list-style-type: none; } #copyright-widget .textwidget:before , #copyright-widget .textwidget:after { content: none; } #copyright-widget a, #copyright-widget a:visited { text-decoration: underline; } /* 10.0 Header -------------------------------------------------------------- */ /* Tip04 - Reminder to enable JavaScript */ #no-javascript { font-weight: bold; color: #fff; text-align: center; padding: 5px 0; padding: 0.3125rem 0; background-color: #ed0000; } /* 10.1 Site Header */ .site-header { padding: 0; /* overflow: hidden; */ /* In case Site Logo is too wide - Had to disable it to make header shadows visible */ } #site-title-wrapper { float: none; padding-top: 12px; padding-top: 0.75rem; } .site-header .site-title, .site-header .site-description { text-align: center; } /* Tip88 - Customize color scheme: Site Title and Description - can also be changed via Admin > Appearance > Customizer */ .site-header .site-title a, .site-header .site-description a { color: #515151; display: inline-block; text-decoration: none; } .site-header .site-title a:hover, .site-header .site-title a:focus, .site-header .site-description a:hover, .site-header .site-description a:focus { color: #ff6111; text-decoration: underline; } .site-header .site-title { color: #515151; font-size: 24px; font-size: 1.5rem; font-weight: bold; line-height: 1.285714286; margin-bottom: 14px; margin-bottom: 0.875rem; margin-top: 0; } .site-header .site-description { font-weight: normal; font-size: 13px; font-size: 0.8125rem; color: #757575; margin: 0; } /* Tip14 - Site Logo plugin/feature support. Check: inc/plugin-compatibility.php for more details. */ .site-logo-link { display: none; } .site-logo { } /* Enable Site Logo in mobile view */ /* .site-branding { margin-top: 12px; margin-top: 0.75rem; } .site-logo-link { display: inline-block; float: left; margin: 5px 24px 0 0; margin: 0.3125rem 1.5rem 0 0; } #site-title-wrapper { padding: 12px 0 12px 12px; padding: 0.75rem 0 0.75rem 0.75rem; } .site-header .site-title, .site-header .site-title a { clear: none; display: inline; } .site-header .site-title, .site-header .site-description { text-align: left; } */ img.header-image, .site-header img.wp-post-image { margin-top: 24px; margin-top: 1.5rem; } /* 11.0 Content -------------------------------------------------------------- */ body { margin-top: 48px; margin-top: 3rem; } .site { padding: 0 24px; padding: 0 1.5rem; background-color: #fff; } .content-area { margin: 24px 0 0; margin: 1.5rem 0 0; } /* 11.1 Posts and pages */ .content-area article, .content-area section { /* section is for 404.php and content-none.php */ word-break: normal; word-break: break-word; /* Non standard for webkit */ word-wrap: break-word; -ms-word-wrap: break-word; /* For IE8 */ -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; margin-bottom: 48px; margin-bottom: 3rem; padding-bottom: 24px; padding-bottom: 1.5rem; } /* Remove content bottom border for a single page, attachement page and for the last post in archive view listing */ .content-area article:last-child, .page .content-area article, .content-area section, /* section is for 404.php and content-none.php */ .attachment .content-area article { border-bottom: 0px; margin-bottom: 24px; margin-bottom: 1.5rem; background-image: none!important; } .archive .content-area article, .category .content-area article, .singular .content-area article, .blog .content-area article, .search-results .content-area article { background: #fff; /* Old browsers */ /* IE10 Consumer Preview */ background-image: -ms-radial-gradient(center bottom, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Mozilla Firefox */ background-image: -moz-radial-gradient(center bottom, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Opera */ background-image: -o-radial-gradient(center bottom, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(radial, center bottom, 0, center bottom, 487, color-stop(0, #fbfbfb), color-stop(1, #ffffff)); /* Webkit (Chrome 11+) */ background-image: -webkit-radial-gradient(center bottom, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* W3C Markup, IE10 Release Preview */ background-image: radial-gradient(circle closest-corner at center bottom, #fbfbfb 0%, #ffffff 100%); } /* Tip36 - Display featured image thumbnail in archive views (index page, categories, etc.) * Image also gets the class "alignright", "aligncenter", etc. via content.php */ .entry-thumbnail .wp-post-image { box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); } /* You can try using these CSS rules if you place small size (thumbnail) image that is aligned to the left */ /* .entry-thumbnail img.wp-post-image { margin: 24px 24px 0 0; margin: 1.5rem 1.5rem 0 0; width: auto; } */ .entry-header { margin-bottom: 24px; margin-bottom: 1.5rem; } .entry-header img.wp-post-image { margin-bottom: 24px; margin-bottom: 1.5rem; } .entry-header .entry-title { font-size: 22px; font-size: 1.375rem; font-weight: bold; line-height: 1.45; color: #333; } .entry-header .entry-title a { text-decoration: none; color: #333; } .entry-header .entry-title a:hover, .entry-header .entry-title a:focus { color: #ff6111; text-decoration: underline; } .entry-header .entry-format { margin-top: 24px; margin-top: 1.5rem; font-weight: normal; } .entry-header .title-comment-meta { font-size: 15px; font-size: 0.9375rem; font-weight: normal; color: #555; vertical-align: super; white-space: nowrap; /* Do not separate icon from number */ } .entry-header .title-comment-meta a:before { content: "\f0e5"; font-size: 21px; font-size: 1.3125rem; margin-right: 3px; margin-right: 0.1875rem; position: relative; top: 2px; text-decoration: none; } /* Increasing line height for entry meta (header and footer) to get better spacing for the mobile tap targets */ .entry-meta { line-height: 2.8; } .entry-header .entry-meta { color: #555; font-size: 13px; font-size: 0.8125rem; margin-top: 12px; margin-top: 0.75rem; } .entry-meta .comments-link { display: inline-block; } .comments-link a, .entry-meta a { color: #555; text-decoration: none; } .comments-link a:hover, .entry-meta a:hover, .entry-header .title-comment-meta a:hover { color: #dd3811; text-decoration: underline; } .comments-link a:focus, .entry-meta a:focus, .entry-header .title-comment-meta a:focus { color: #dd3811; text-decoration: none; } /* Tip26b - Comment out next CSS rule to Print HTML bellow post title with meta information (date/time and author) * for the index/archive views in MOBILE view. */ .list-view .entry-header .entry-meta { display: none; } footer.entry-meta { color: #555; font-size: 13px; font-size: 0.8125rem; } .updated:not(.published) { display: none; } .posted-on:before, .byline:before, .cat-links:before, .tags-links:before, .comments-link:before, .edit-link:before, .entry-format:before, .full-size-link:before { font-size: 14px; font-size: 0.875rem; margin-right: 2px; margin-right: 0.125rem; position: relative; } .posted-on, .byline, .cat-links, .tags-links, .comments-link, .edit-link, .entry-format, .full-size-link { margin-right: 14px; margin-right: 0.875rem; color: #959595; } .posted-on:before, .byline:before, .cat-links:before, .tags-links:before, .comments-link:before, .edit-link:before, .entry-format:before, .full-size-link:before { padding-right: 3px; padding-right: 0.1875rem; } .byline:before { content: "\f007"; } .cat-links:before { content: "\f07c"; } .comments-link:before { content: "\f075"; } .edit-link:before { content: "\f040"; } .full-size-link:before { content: "\f00e"; } .posted-on:before { content: "\f073"; } .tags-links:before { content: "\f02b"; } .comments-link, .edit-link { white-space: nowrap; /* Do not separate icon from number */ display: inline-block; } /* Do not display icons for entry-meta-top */ .entry-header .entry-meta .byline:before { content: none; padding-right: 0; } .entry-header .entry-meta .byline, .entry-header .entry-meta .posted-on, .entry-header .entry-meta .comments-link, .entry-header .entry-meta .edit-link { margin-right: 0; } .entry-header .entry-meta .posted-on:before, .entry-header .entry-meta .comments-link:before, .entry-header .entry-meta .edit-link:before { content: "\f111"; font-size: 4px; font-size: 0.25rem; margin: 0 7px; margin: 0 0.4375rem; padding-right: 0; vertical-align: middle; } /* Entry-meta for specific post formats */ .format-aside .entry-format:before { content: "\f192"; /* fa-dot-circle-o */ } .format-aside footer.entry-meta { margin-top: 5px; margin-top: 0.3125rem; } .format-image .entry-format:before { content: "\f03e"; /* fa-picture-o */ } .format-link .entry-format:before { content: "\f0c1"; /* fa-link */ } .format-quote .entry-format:before { content: "\f10e"; /* fa-quote-right */ } .format-status .entry-format:before { content: "\f041"; /* fa-map-marker */ } .format-aside .cat-links, .format-aside .tags-links, .format-image.cat-links, .format-image .tags-links, .format-link .cat-links, .format-link .tags-links, .format-quote .cat-links, .format-quote .tags-links, .format-status .cat-links, .format-status .posted-on, .format-status .tags-links { display: none; } /* Tip30 - Uncomment next CSS block to hide entry meta section, located below the post (with author, categories, tags) * in the Index page and archive listings. */ /* .list-view footer.entry-meta { display: none; } .format-link footer.entry-meta, .format-status footer.entry-meta, .singular footer.entry-meta { display: block; } .content-area article { padding-bottom: 12px!important; padding-bottom: 0.75rem!important; } */ .entry-content, .entry-summary { text-align: justify; } .entry-content h1, .entry-summary h1, .page-content h1, .comment-content h1, .entry-content h2, .entry-summary h2, .page-content h2, .comment-content h2, .entry-content h3, .entry-summary h3, .page-content h3, .comment-content h3, .entry-content h4, .entry-summary h4, .page-content h4, .comment-content h4, .entry-content h5, .entry-summary h5, .page-content h5, .comment-content h5, .entry-content h6, .entry-summary h6, .page-content h6, .comment-content h6 { margin: 24px 0; margin: 1.5rem 0; color: #333; } .entry-content h1, .entry-summary h1, .page-content h1, .comment-content h1, .entry-content h2, .entry-summary h2, .page-content h2, .comment-content h2, .mu_register h2 { font-size: 26px; font-size: 1.625rem; line-height: 1.5; font-weight: normal; } .mu_register h2 { color: #757575; font-weight: normal; } .entry-content h3, .entry-summary h3, .page-content h3, .comment-content h3 { font-size: 20px; font-size: 1.25rem; line-height: 1.6; } .entry-meta h3 { color: #333; margin: 24px 0; margin: 1.5rem 0; font-size: 18px; font-size: 1.125rem; line-height: 1.6; } .entry-content h4, .entry-summary h4, .page-content h4, .comment-content h4 { font-size: 18px; font-size: 1.125rem; line-height: 1.846153846; } .entry-content h5, .entry-summary h5, .page-content h5, .comment-content h5 { font-size: 16px; font-size: 1rem; line-height: 1.846153846; } .entry-content h6, .entry-summary h6, .page-content h6, .comment-content h6 { font-size: 14px; font-size: 0.875rem; line-height: 1.846153846; } .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; } .entry-content { /* font-size: ; */ } .entry-content p, .entry-summary p, .comment-content p, .mu_register p { margin: 0 0 24px; margin: 0 0 1.5rem; } .single .entry-content p, .single .entry-summary p, .single .comment-content p, .single .mu_register p, .page .entry-content p, .page .comment-content p { margin: 0 0 24px; margin: 0 0 1.5rem; } /* Tip25 - Mark the links that will open in a new window with special icon (fa-external-link), usually these are the links to external resources * To disable it uncomment Tip25b here, or Tip25b in child theme's style.css. */ .entry-content .fa-external-link { font-size: inherit; margin: 0 0 0 2px; margin: 0 0 0 0.125rem; padding: 0 2px 0 2px; padding: 0 0.125rem 0 0.125rem; text-indent: 0px; vertical-align: baseline; white-space: nowrap; } /* Tip25b - Disable special icons, that marks the links that will open in a new window */ /* .entry-content .fa-external-link { display: none; } */ /* Tip25c - Disable special icon, that marks the links that will open in a new window for an individual link. * Use for the desired link: Link text */ .no-link-icon .fa-external-link { display: none; } .entry-content .more-link:after, .entry-summary .more-link:after { content: "\f101"; /* fa-angle-double-right */ font-size: inherit; } .entry-content ol, .comment-content ol, .entry-content ul, .comment-content ul, .mu_register ul { margin: 0 0 24px; margin: 0 0 1.5rem; } .entry-content ul ul, .comment-content ul ul, .entry-content ol ol, .comment-content ol ol, .entry-content ul ol, .comment-content ul ol, .entry-content ol ul, .comment-content ol ul { margin: 12px 0 12px 0; margin: 0.75rem 0 0.75rem 0; } .entry-content ul, .comment-content ul, .mu_register ul { list-style: disc outside; } .entry-content ol, .comment-content ol { list-style: decimal outside; } .entry-content li, .comment-content li, .mu_register li { margin: 0 0 0 36px; margin: 0 0 0 2.25rem; } /* This is mostly to style Recent Posts widget in 404 page */ .entry-content .widget li { margin: 0 0 12px 0; margin: 0 0 0.75rem 0; } ul.list-icon-ok, ul.list-icon-file, ul.list-icon-hand-right { list-style-type: none; } ul.list-icon-ok li, ul.list-icon-file li, ul.list-icon-hand-right li { padding-bottom: 10px; padding-bottom: 0.625rem; text-indent: -16px; } ul.list-icon-ok li:before { color: #191919; padding-right: 10px; padding-right: 0.625rem; content: "\f00c"; /* fa-check */ font-size: 20px; font-size: 1.25rem; vertical-align: text-bottom; } ul.list-icon-file li:before { color: #191919; padding-right: 10px; padding-right: 0.625rem; content: "\f15b"; /* fa-file */ font-size: 20px; font-size: 1.25rem; vertical-align: text-bottom; } ul.list-icon-hand-right li:before { color: #191919; padding: 0 10px 5px 0; padding: 0 0.625rem 0.3125rem 0; content: "\f087"; /* fa-thumbs-o-up */ font-size: 20px; font-size: 1.25rem; vertical-align: bottom; } /* Tip33 - Enable hyphenation of text for article. Please note that automatic hyphenation can reduce * accesibility of the theme - it can cause strange pronunciation with screen readers. */ /* .content-area article { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } */ .page-header { margin-bottom: 24px; margin-bottom: 1.5rem; padding-bottom: 22px; padding-bottom: 1.375rem; border-bottom: 1px solid #ededed; } .page-header a, .page-header a:visited { color: #0066cc; text-decoration: underline; } .page-header a:hover, .page-header a:active { color: #ff6111; text-decoration: underline; } .page-title { color: #191919; font-size: 27px; font-size: 1.6875rem; font-weight: normal; line-height: 1.4; text-transform: uppercase; } .taxonomy-description { color: #555; line-height: 2; margin-top: 22px; margin-top: 1.375rem; } /* Author profiles */ .author .page-header { margin-bottom: 24px; margin-bottom: 1.5rem; } .author-info { border-top: 1px solid #ededed; line-height: 1.8; margin: 24px 0; margin: 1.5rem 0; padding-top: 24px; padding-top: 1.5rem; overflow: hidden; } .author-avatar { float: left; margin: 8px 24px 0 0; margin: 0.5rem 1.5rem 0 0; } .author-description { margin: 0; } .author-description p { color: #757575; font-size: 13px; font-size: 0.8125rem; margin: 0; } .author.archive .author-info { border-top: 0; margin: 0 0 48px; margin: 0 0 3rem; } .author.archive .author-avatar { margin-top: 0; } h2.author-title { clear: none; display: inline; margin: 0 0 12px 0; margin: 0 0 0.75rem 0; } .archive h2.author-title { line-height: 1.4; } .author-link:after { content: "\f178"; /* fa-long-arrow-right */ padding-left: 1px; padding-left: 0.0625rem; } /* 11.2 Post Formats */ /* Shared Post Format styling */ article.format-quote footer.entry-meta, article.format-link footer.entry-meta, article.format-status footer.entry-meta { font-size: 13px; font-size: 0.8125rem; } /* Aside post format */ article.format-aside h1, article.format-aside h2 { font-size: 16px; font-size: 1rem; margin-bottom: 24px; margin-bottom: 1.5rem; } article.format-aside h2 a { color: #000; text-decoration: none; } article.format-aside h2 a:hover { color: #dd3811; text-decoration: underline; } article.format-aside .aside { padding: 24px; padding: 1.5rem; background: #e5eeff; border-left: 22px solid #a8bfe8; } article.format-aside p { color: #222; } article.format-aside blockquote:last-child, article.format-aside p:last-child { margin-bottom: 0; } /* Image posts */ article.format-image footer h1, article.format-image footer h2 { font-size: 13px; font-size: 0.8125rem; } /* Link posts */ article.format-link header { margin-top: 4px; margin-top: 0.25rem; padding: 0 10px; padding: 0 0.625rem; float: right; font-size: 11px; font-size: 0.6875rem; line-height: 2.181818182; font-weight: bold; font-style: italic; text-transform: uppercase; color: #6a6a6a; background-color: #ebebeb; border-radius: 3px; } article.format-link .entry-content { max-width: 80%; float: left; } article.format-link .entry-content a { font-size: 22px; font-size: 1.375rem; font-weight: bold; line-height: 1.45; text-decoration: none; } article.format-link .entry-content a:hover { text-decoration: underline; } /* Quote posts */ article.format-quote .entry-content p { margin: 0; padding-bottom: 24px; padding-bottom: 1.5rem; } article.format-quote .entry-content blockquote { border: solid #e5e5e5; border-width: 0 0 1px; font-size: 16px; font-size: 1rem; display: block; line-height: 1.8; margin-left: 24px; padding: 24px 24px 0; padding: 1.5rem 1.5rem 0; color: #6a6a6a; background-color: #f5f5f5; } /* Status posts */ .format-status .entry-header { margin: 10px 0 24px 0; margin: 0.625rem 0 1.5rem 0; } .format-status .entry-header header { display: inline-block; } .format-status .entry-header h2 { font-size: 16px; font-size: 1rem; font-weight: normal; margin: 0; } .format-status .entry-header div { font-size: 13px; font-size: 0.8125rem; font-weight: normal; margin: 0; } .format-status .entry-header header a, .format-status .entry-header header a:visited { color: #555; } .format-status .entry-header header a:active, .format-status .entry-header header a:hover, .format-status .entry-header header a:focus { color: #dd3811; } .format-status .entry-header img { float: left; margin-right: 21px; margin-right: 1.3125rem; } /* 11.3 Comments */ ol.comment-list { list-style: none; margin: 0; } ol.children { list-style: none; } .comments-title { margin-bottom: 48px; margin-bottom: 3rem; font-size: 16px; font-size: 1rem; line-height: 1.5; font-weight: bold; } .comments-area article { margin: 24px 0; margin: 1.5rem 0; } .comments-area article header { margin: 0 0 24px; margin: 0 0 1.5rem; overflow: hidden; position: relative; } .comments-area article header img { float: left; padding: 0; line-height: 0; } .comments-area article header cite, .comments-area article header time { display: block; margin-left: 85px; margin-left: 6.071428570.875rem; } /* Increasing top margin to get better spacing for the mobile tap targets */ .comments-area article header time { margin-top: 14px; margin-top: 0.875rem; } .comments-area article header cite { font-style: normal; font-size: 16px; font-size: 1rem; line-height: 1.42857143; } .comments-area cite b { font-weight: normal; } .comments-area article header time { text-decoration: none; font-size: 13px; font-size: 0.8125rem; color: #5e5e5e; } .comments-area article header a { text-decoration: none; color: #0066cc; } .comments-area article header a:hover { color: #dd3811; } .comments-area article header cite a { color: #444; } .comments-area article header cite a:hover { text-decoration: underline; } .comments-area .comment-author-name { font-size: 16px; font-size: 1rem; } .bypostauthor cite .post-author-label { background-color: #21759b; background-image: none; border: 1px solid #1f6f93; border-radius: 2px; box-shadow: none; color: #fff; padding: 0; position: absolute; margin: 0 0 0 10px; margin: 0 0 0 0.625rem; padding: 1px 5px; padding: 0.0625rem 0.3125rem; font-size: 13px; font-size: 0.8125rem; } .bypostauthor cite b { font-weight: bold; } .comments-area section { margin-bottom: 0; padding-bottom: 0; } .comments-area p.edit-link { margin-bottom: 0; } a.comment-reply-link, a.comment-edit-link { color: #0066cc; font-size: 13px; font-size: 0.8125rem; } a.comment-reply-link:hover, a.comment-edit-link:hover { color: #dd3811; } .comment-list .pingback { margin-bottom: 24px; margin-bottom: 1.5rem; } /* Comment form */ #respond { margin-top: 48px; margin-top: 3rem; } #respond h3#reply-title { font-size: 16px; font-size: 1rem; line-height: 1.5; } #respond h3#reply-title #cancel-comment-reply-link { margin-left: 10px; margin-left: 0.625rem; font-weight: normal; font-size: 13px; font-size: 0.8125rem; } #respond form { margin: 24px 0; margin: 1.5rem 0; } #respond form p { margin: 11px 0; margin: 0.6875rem 0; } #respond form p.logged-in-as { margin-bottom: 24px; margin-bottom: 1.5rem; } #respond form label { display: block; } #respond form input[type="text"], #respond form input[type="email"], #respond form input[type="url"], #respond form textarea { -moz-box-sizing: border-box; box-sizing: border-box; font-size: 16px; font-size: 1rem; width: 100%; } #respond form p.form-allowed-tags { display: none; margin: 0; font-size: 13px; font-size: 0.8125rem; line-height: 2; color: #5e5e5e; } .required { color: #ee0000; } /* Custom styles for Schema.org microdata format support implementation */ p.comment-author-name, .widget-area .widget p.comment-author-name { display: inline-block; margin-bottom: 0; } /* 11.4 Page templates */ /* Front page template */ /* Tip12 - Uncomment following CSS rules to have classic Twenty Twelve front page look - disable header image for the Front Page Templ.: */ /* .template-front-page img.header-image, .template-front-page .site-header img.wp-post-image { display: none; } */ .entry-page-image { margin-bottom: 14px; margin-bottom: 0.875rem; } .template-front-page .content-area article { border: 0; margin-bottom: 0; } /* Use regular (smaller) font size for pages that use Front Page Template */ .template-front-page .page .entry-content { font-size: 14px; font-size: 0.875rem; } .template-front-page .site-content .widget-area { clear: both; float: none; width: auto; padding-top: 24px; padding-top: 1.5rem; border-top: 1px solid #ededed; } .template-front-page .site-content .widget-area .widget li { margin: 8px 0 0; margin: 0.5rem 0 0; font-size: 13px; font-size: 0.8125rem; list-style-type: square; list-style-position: inside; } .template-front-page .site-content .widget-area .widget li a { color: #757575; } .template-front-page .site-content .widget-area .widget li a:hover { color: #dd3811; } .template-front-page .site-content .widget-area .widget_text img { float: left; margin: 8px 24px 8px 0; margin: 0.5rem 1.5rem 0.5rem 0; } .template-front-page #footer-widgets { padding-top: 0; } /* Tip63 - Uncomment following CSS rules to have classic Twenty Twelve front page look - disable footer widgets for the Front Page Templ.: */ /* .template-front-page #footer-widgets { display: none; } */ /* Links (blogroll) template */ #links-main { list-style: none; margin: 0 0 18px 0; margin: 0 0 1.125rem 0; } #links-main li.linkcat { margin: 25px 0 0 0; margin: 1.5625rem 0 0 0; } /* 12.0 Footer -------------------------------------------------------------- */ .site-footer { border-top: 1px solid #ededed; font-size: 13px; font-size: 0.8125rem; max-width: 960px; max-width: 60rem; margin: 5px auto 0 auto; margin: 0.3125rem auto 0 auto; padding: 0 0 29px 0; padding: 0 0 1.8125rem 0; } /* Give extra top padding when footer widgets are present */ .footer-widgets .site-footer { padding-top: 5px; padding-top: 0.3125rem; } .site-footer a { color: #222; } .site-footer a:hover, .site-footer a:focus { color: #dd3811; } .site-footer { background: #fff; /* Old browsers */ /* IE10 Consumer Preview */ background-image: -ms-radial-gradient(center top, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Mozilla Firefox */ background-image: -moz-radial-gradient(center top, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Opera */ background-image: -o-radial-gradient(center top, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(radial, center top, 0, center top, 487, color-stop(0, #fbfbfb), color-stop(1, #ffffff)); /* Webkit (Chrome 11+) */ background-image: -webkit-radial-gradient(center top, circle closest-corner, #fbfbfb 0%, #ffffff 100%); /* W3C Markup, IE10 Release Preview */ background-image: radial-gradient(circle closest-corner at center top, #fbfbfb 0%, #ffffff 100%); } .site-info, .site-info-2 { font-family: Verdana, Geneva, "DejaVu Sans", sans-serif; font-size: 14px; /* Make tap targets larger to provide a better user experience on mobile devices. */ font-size: 0.875rem; font-weight: normal; } .site-info ul, .site-info-2 ul { margin: 0; } .site-info { clear: both; /* Because footer widgets */ width: 100%; max-width: 700px; max-width: 43.75rem; float: left; } .site-info .fa-wordpress { font-size: 16px; font-size: 1rem; } /* Tip61 - Discreet link to WordPress Admin panel in the footer */ #site-admin-link a { margin-right: 10px; margin-right: 0.625rem; } #site-admin-link a, #site-admin-link a:visited { color: #747474; text-decoration: none; padding: 0 2px 1px 2px; padding: 0 0.125rem 0.0625rem 0.125rem; border: 1px solid #747474; } #site-admin-link a:hover, #site-admin-link a:active, #site-admin-link a:focus { color: #fff; background-color: #757575; } .site-info-2 { width: 100%; max-width: 250px; max-width: 15.625rem; float: right; text-align: right; margin-top: 24px; margin-top: 1.5rem; } .site-info-2 a, .site-info-2 a:visited { color: #222; text-decoration: none; } .site-info-2 a:hover { text-decoration: none; } /* 13.0 Media -------------------------------------------------------------- */ .page-content .wp-smiley, .page-content .emoji, .entry-content .wp-smiley, .entry-content .emoji, .comment-content .wp-smiley, .comment-content .emoji { border: none; border-radius: 0; box-shadow: none; margin-bottom: 0; margin-top: 0; padding: 0; /* Increase size for emoji and smiley icons, so they would look better. */ /* height: 1.2em!important; max-height: 1.2em!important; width: 1.2em!important; max-width: 1.2em!important; */ } audio, canvas { display: inline-block; } /* Make sure videos and embeds fit their containers */ embed, iframe, object, video { margin-bottom: 24px; margin-bottom: 1.5rem; max-width: 100%; vertical-align: middle; } p > embed, p > iframe, p > object, p > video { margin-bottom: 0; } .wp-audio-shortcode, .wp-video, .wp-playlist.wp-audio-playlist { font-size: 16px; font-size: 1rem; margin-top: 0; margin-bottom: 24px; margin-bottom: 1.5rem; } .wp-playlist.wp-playlist { padding-bottom: 0; } .wp-playlist .wp-playlist-tracks { margin-top: 0; } .wp-playlist-item .wp-playlist-caption { border-bottom: 0; padding: 10px 0; padding: 0.625rem 0; } .wp-playlist-item .wp-playlist-item-length { top: 10px; } /* 13.1 Images */ /* Responsive images */ .entry-content img, .entry-summary img, .comment-content img, .widget img, .wp-caption { max-width: 100%; /* Fluid images for posts, comments, and widgets */ } .comment-content img[height], .entry-content img, .entry-summary img, img[class*="align"], img[class*="wp-image-"], img[class*="attachment-"] { height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */ } img.size-full, img.size-large, img.header-image, img.wp-post-image, .post-thumbnail img { max-width: 100%; height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */ } .avatar, .entry-content img, .comment-content img, .widget img, img.header-image, img.wp-post-image { /* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */ border-radius: 3px; -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); } .avatar { /* to fix cutt-off border shadow */ margin: 0 0 4px 4px; margin: 0 0 0.25rem 0.25rem; } .comment .avatar { margin: 0px; border: 0; border-radius: 0; box-shadow: none; } /* Tip06 - Custom headers for posts and pages. Uncomment following CSS rules to disable border and shadow on main header: */ /* img.header-image, .site-header img.wp-post-image { border-radius: 0; box-shadow: none; } */ /* Tip24 - .no-border CSS class - use it in case you need to display an image without any borders or shadows, * include "no-border" class for the desired post image. */ img.no-border { border: none; border-radius: 0; box-shadow: none; } /* Single image attachment view */ .article.attachment { overflow: hidden; } .image-attachment .entry-attachment { text-align: center; } .image-attachment .entry-attachment p { text-align: center; } .image-attachment .entry-attachment img { display: block; height: auto; margin: 0 auto; max-width: 100%; } .image-attachment .entry-caption { margin-top: 8px; margin-top: 0.5rem; } .image-attachment .posted-on .screen-reader-text { /* Display text: 'Published on' */ clip: auto; color: #555; height: auto; width: auto; position: static!important; } .image-attachment .comments-link { display: none; } /* 13.2 Captions */ .wp-caption { padding: 0; } .wp-caption .wp-caption-text { padding: 7px 0 0 0; padding: 0.4375rem 0 0 0; } .wp-caption .wp-caption-text, .gallery-caption, .entry-caption { font-style: italic; font-size: 13px; font-size: 0.8125rem; line-height: 1.7; color: #505050; } /* 13.3 Galleries */ .gallery { margin-bottom: 24px; margin-bottom: 1.5rem; } .gallery-item { float: left; position: relative; width: 100%; display: inline-block; margin: 0 4px 7px 0; margin: 0 0.25rem 0.4375rem 0; overflow: hidden; text-align: center; vertical-align: top; } .gallery-columns-1 .gallery-item:nth-of-type(1n), .gallery-columns-2 .gallery-item:nth-of-type(2n), .gallery-columns-3 .gallery-item:nth-of-type(3n), .gallery-columns-4 .gallery-item:nth-of-type(4n), .gallery-columns-5 .gallery-item:nth-of-type(5n), .gallery-columns-6 .gallery-item:nth-of-type(6n), .gallery-columns-7 .gallery-item:nth-of-type(7n), .gallery-columns-8 .gallery-item:nth-of-type(8n), .gallery-columns-9 .gallery-item:nth-of-type(9n) { margin-right: 0; } .gallery-columns-1 .gallery-item { float: none; max-width: 100%; margin-bottom: 12px; margin-bottom: 0.75rem; } .gallery-columns-2 .gallery-item { max-width: 48%; /* fallback if needed */ max-width: -webkit-calc(50% - 4px); /* -4px for the margin-right of .gallery-item */ max-width: calc(50% - 4px); margin-bottom: 12px; margin-bottom: 0.75rem; } .gallery-columns-3 .gallery-item { max-width: 32%; /* fallback if needed */ max-width: -webkit-calc(33.3% - 4px); max-width: calc(33.3% - 4px); margin-bottom: 12px; margin-bottom: 0.75rem; } .gallery-columns-4 .gallery-item { max-width: 23%; /* fallback if needed */ max-width: -webkit-calc(25% - 4px); max-width: calc(25% - 4px); } .gallery-columns-5 .gallery-item { max-width: 19%; /* fallback if needed */ max-width: -webkit-calc(20% - 4px); max-width: calc(20% - 4px); } .gallery-columns-6 .gallery-item { max-width: 15%; /* fallback if needed */ max-width: -webkit-calc(16.7% - 4px); max-width: calc(16.7% - 4px); } .gallery-columns-7 .gallery-item { max-width: 13%; /* fallback if needed */ max-width: -webkit-calc(14.28% - 4px); max-width: calc(14.28% - 4px); } .gallery-columns-8 .gallery-item { max-width: 11%; /* fallback if needed */ max-width: -webkit-calc(12.5% - 4px); max-width: calc(12.5% - 4px); } .gallery-columns-9 .gallery-item { max-width: 9%; /* fallback if needed */ max-width: -webkit-calc(11.1% - 4px); max-width: calc(11.1% - 4px); } .gallery-columns-1.gallery-size-medium figure.gallery-item:nth-of-type(1n+1), .gallery-columns-1.gallery-size-thumbnail figure.gallery-item:nth-of-type(1n+1), .gallery-columns-2.gallery-size-thumbnail figure.gallery-item:nth-of-type(2n+1), .gallery-columns-3.gallery-size-thumbnail figure.gallery-item:nth-of-type(3n+1), .gallery-columns-4.gallery-size-thumbnail figure.gallery-item:nth-of-type(4n+1), .gallery-columns-5.gallery-size-thumbnail figure.gallery-item:nth-of-type(5n+1), .gallery-columns-6.gallery-size-thumbnail figure.gallery-item:nth-of-type(6n+1), .gallery-columns-7.gallery-size-thumbnail figure.gallery-item:nth-of-type(7n+1) { clear: left; } .gallery .gallery-icon { max-width: 100%; } .gallery .gallery-icon img { border: 1px solid #fff; margin: 5px 3px 7px 3px; margin: 0.3125rem 0.1875rem 0.4375rem 0.1875rem; vertical-align: middle; max-width: 100%; } .gallery .gallery-icon img:hover { -webkit-box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.45); -moz-box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.45); box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.45); } /* Gallery image size for mobile devices is optimized for a minimum screen width of 480px * Gallery image size for wider screens can be set in Media Queries - see style.css section 15.0 */ .gallery-columns-1 .gallery-icon img { max-width: 100%; } .gallery-columns-2 .gallery-icon img { max-width: 100%; } .gallery-columns-3 .gallery-icon img { max-width: 90%; } .gallery-columns-4 .gallery-icon img { max-width: 88%; } .gallery-columns-5 .gallery-icon img { max-width: 85%; } .gallery-columns-6 .gallery-icon img { max-width: 80%; } .gallery-columns-7 .gallery-icon img { max-width: 80%; } .gallery-columns-8 .gallery-icon img { max-width: 75%; } .gallery-columns-9 .gallery-icon img { max-width: 75%; } /* Do not display captions for very small gallery thumbnails */ .gallery-columns-8 .gallery-caption, .gallery-columns-9 .gallery-caption { display: none; } .gallery-caption { margin-bottom: 4px; margin-bottom: 0.25rem; } .gallery-caption a { display: inline; } /* 14.0 Other styles -------------------------------------------------------------- */ /* 14.1 Twitter Bootstrap style alerts. Usage: http://getbootstrap.com/components/#alerts */ .alert { padding: 15px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 4px; } .alert h4 { margin-top: 0; color: inherit; } .alert .alert-link { font-weight: bold; } .alert > p, .alert > ul { margin-bottom: 0; } .alert > p + p { margin-top: 5px; } /* For fully functioning, dismissible alerts, you must use the alerts JavaScript plugin: * @link http://getbootstrap.com/javascript/#alerts */ .alert-dismissable, .alert-dismissible { padding-right: 35px; } .alert-dismissable .close, .alert-dismissible .close { position: relative; top: -2px; right: -21px; color: inherit; } .alert-success { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; } .alert-success hr { border-top-color: #c9e2b3; } .alert-success .alert-link { color: #2b542c; } .alert-info { color: #31708f; background-color: #d9edf7; border-color: #bce8f1; } .alert-info hr { border-top-color: #a6e1ec; } .alert-info .alert-link { color: #245269; } .alert-warning { color: #8a6d3b; background-color: #fcf8e3; border-color: #faebcc; } .alert-warning hr { border-top-color: #f7e1b5; } .alert-warning .alert-link { color: #66512c; } .alert-danger { color: #a94442; background-color: #f2dede; border-color: #ebccd1; } .alert-danger hr { border-top-color: #e4b9c0; } .alert-danger .alert-link { color: #843534; } /* 14.2 Misc. styles */ /* Plugins */ /* Tip25c - Do not display special external link icon for certain plugins */ .sharedaddy .fa-external-link, /* Jetpack Sharing */ .fsb-social-bar .fa-external-link, /* Floating Social Bar */ .addtoany_share_save_container .fa-external-link /* Share Buttons by AddToAny */ { display: none; } /* Styling for Jetpack Sharing */ .sharedaddy { margin-bottom: 24px; } /* Tip24 - .no-border CSS class - use it in case you need to display an image without any borders or shadows... * removing border for certain plugins */ .addtoany_list img /* Add To Any */ { border: none; border-radius: 0; box-shadow: none; } /* Tip35 - Add support for Infinite Scroll. Check: inc/plugin-compatibility.php for more details. */ /* Hides navigation links and site footer when infinite scroll is active */ .infinite-scroll .pagination, .infinite-scroll.neverending footer { display: none; } /* Do not remove content bottom border for the last child of the content listing when Infinite Scroll is active */ .infinite-scroll.list-view .content-area article:last-child { border-bottom: 4px double #ededed; margin-bottom: 48px; margin-bottom: 3rem; padding-bottom: 24px; padding-bottom: 1.5rem; } /* Shows the footer again in case all posts have been loaded */ .infinity-end.neverending footer { display: block; } /* div#infinite-handle is the Load more posts button shown for type=click. You can ignore this if your theme will always use type=scroll and will never have any footer widgets. */ #infinite-handle, .infinite-loader { margin-bottom: 48px; margin-bottom: 3rem; } #infinite-handle span { color: #ff6111; -webkit-tap-highlight-color: rgba(255, 97, 17, 0.3); font-size: 18px; font-size: 1.125rem; font-weight: bold; text-decoration: none; line-height: 28px; line-height: 1.75rem; background-color: #fff; border: 1px solid #ff6111; width: 110px; } #infinite-handle span:before, #infinite-handle span:hover, #infinite-handle span:focus, #infinite-handle span:hover:before, #infinite-handle span:focus:before { color: #fff; background-color: #ff6111; } /* 14.1 FAH -------------------------------------------------------------- */ html, body { font-size: 14px; } ._10 { width: 8%; margin: 0 1%; display: block; float: left; } ._15 { width: 13%; margin: 0 1%; display: block; float: left; } ._20 { width: 18%; margin: 0 1%; display: block; float: left; } ._25 { width: 23%; margin: 0 1%; display: block; float: left; } ._30 { width: 28%; margin: 0 1%; display: block; float: left; } ._33 { width: 31%; margin: 0 1%; display: block; float: left; } ._40 { width: 38%; margin: 0 1%; display: block; float: left; } ._50 { width: 48%; margin: 0 1%; display: block; float: left; } ._60 { width: 58%; margin: 0 1%; display: block; float: left; } ._67 { width: 65%; margin: 0 1%; display: block; float: left; } ._70 { width: 68%; margin: 0 1%; display: block; float: left; } ._75 { width: 73%; margin: 0 1%; display: block; float: left; } ._100 { width: 98%; margin: 0 1%; display: block; float: left; } .__100 { width: 100%; margin: 0%; display: block; float: left; } .__75 { width: 75%; margin: 0%; display: block; float: left; } .__70 { width: 70%; margin: 0%; display: block; float: left; } .__65 { width: 65%; margin: 0%; display: block; float: left; } .__60 { width: 60%; margin: 0; display: block; float: left; } .__59 { width: 59%; margin: 0; display: block; float: left; } .__50 { width: 50%; margin: 0; display: block; float: left; } .__49 { width: 49%; margin: 0; display: block; float: left; } .__40 { width: 40%; margin: 0; display: block; float: left; } .__35 { width: 35%; margin: 0%; display: block; float: left; } .__33 { width: 33%; margin: 0%; display: block; float: left; } .__30 { width: 30%; margin: 0%; display: block; float: left; } .__25 { width: 25%; margin: 0%; display: block; float: left; } .__20 { width: 20%; margin: 0%; display: block; float: left; } .mobile_only { display: none; } .breaker { clear: both; display: block; height: 10px; padding: 0; margin: 0; } .breaker_clear, .breakerClear { clear: both; display: block; height: 0px; padding: 0; margin: 0; } .double_breaker { clear: both; display: block; height: 20px; padding: 0; margin: 0; } .strong { font-weight: bold; } .uppercase { text-transform: uppercase; } .alignRight { text-align: right; } .alignCenter { text-align: center; } .leftAlign, .alignLeft { text-align: left; } .defaultText { font-size: 14px; } .smallText { font-size: 12px; } .tinyText { font-size: 10px; } #site-navigation { margin: 0; padding: 0; background: #191919; } #masthead { display: block; position: relative; background: #191919; color: #ffffff; padding: 0; margin: 0; } ul#primary-menu { background: #191919; border: none; text-align: left; font-size: 14px; font-weight: bold; text-transform: none; margin: 0; padding: 0; margin-left: 0px; position: relative; } .main-navigation ul#primary-menu li { background: #191919; float: none; margin: 0; padding: 0; font-size: 14px; } .main-navigation ul#primary-menu li a, #primary-menu a { background: #191919; color: #ffffff; } .main-navigation ul#primary-menu li a:hover, #primary-menu a:hover { color: #faa518; } .main-navigation ul#primary-menu li:after { content: '/'; font-weight: normal; padding: 0 3px; } .main-navigation ul#primary-menu li:last-child:after { content: ''; content: none; } .main-navigation:not(.toggled) ul#primary-menu li:hover ul.sub-menu { display: block; position: absolute; z-index: 999999999; top: 35px; background: none; padding: 0; margin: 0; border-bottom: none; box-shadow: none; background: none; } .main-navigation:not(.toggled) ul#primary-menu li:hover ul.sub-menu li { display: block; border: none; padding: 0; margin: 0; border-bottom: none; box-shadow: none; line-height: 10px; background: none; padding-bottom: 0; } .main-navigation:not(.toggled) ul#primary-menu li:hover ul.sub-menu li:after { content: ''; } .main-navigation.toggled ul#primary-menu li ul.sub-menu li ul { clear: both; display: block; } .fah_wrapper { display: block; width: 100%; max-width: 1200px; margin: 0 auto; padding: 0; } .site-branding, .site-branding-search, .site-branding-user { display: block; float: left; padding: 0; margin: 10px 0 0 0; width: 100%; min-width: 320px; max-width: 360px; } .site-branding a, .site-branding-search a, .site-branding-user a { color: #ffffff; text-decoration: none; } .site-branding a:hover, .site-branding-search a:hover, .site-branding-user a:hover { color: #faa519; } .site-branding-search, .site-branding-user { float: right; } .site-branding-user { min-width: 80px; max-width: 100px; font-size: 14px; padding-top: 5px; } .site-branding-search .search-form { display: block; } .site-branding-search .search-container-desktop .search-form [type="search"], .site-branding-search .search-container-desktop .search-form [type="email"], .site-branding-search .search-container-desktop .search-form [type="text"] { float: right; background-image: url(images/icon-search.png); background-position: right center; margin: 7px 0 0 6px; margin: 0.4375rem 0.375rem 0 0; background-color: #ffffff; width: 130px; width: 9.285714286rem; padding-left: 5px; width: 75%; font-size: .8em; } .site-branding-search .search-container-desktop .search-form [type="email"] { background-image: url(images/icon-email.png); background-position: right 3px center; background-size: 26px 17px; } .site-branding-search .search-container-desktop .search-form [type="search"]:focus, .site-branding-search .search-container-desktop .search-form [type="email"]:focus, .site-branding-search .search-container-desktop .search-form [type="text"]:focus { background-color: #f5f5f5; border: 0; width: 90%; } .primary-menu-wrapper { display: block; float: left; width: 100%; min-width: 320px; max-width: 770px; } .primary-menu-wrapper-premium { display: block; float: left; width: 100%; } .primary-menu-premium-wrapper { display: block; float: right; width: 100%; min-width: 280px; max-width: 320px; padding: 0; margin: 0; margin-top: 10px; font-size: 14px; color: #faa519; text-align: left; } .primary-menu-premium-wrapper a { color: #faa519; text-decoration: none; text-align: left; } .primary-menu-premium-wrapper h4.fahPremiumContentIcon { float: left; clear: none; margin-right: 10px; } #page { background: none; border: none; box-shadow: none; max-width: 1200px; padding: 0; margin: 0 auto; } .content-area-padded { padding: 2%; } .content-area-bordered { border-top: #E6E6E6 1px solid; border-bottom: #E6E6E6 1px solid; } .content-area { float: left; width: 68.104166667%; background: #ffffff; } .content-area h1.entry-title, .content-area h2.entry-title, .entry-meta { display: block; padding: 0; margin: 0; } .content-area h1.entry-title { font-size: 30px; font-weight: bold; font-family: "Arial", Gadget, sans-serif; } .content-area .printfriendly { display: none; } .social_media_links a { color: #000000; text-decoration: none; font-size: 12px; } .entry-content-filed-under { color: #FAA61C; } .entry-content-filed-under a { color: #FAA61C; text-decoration: none; } .social-media-icons, .social-media-icons a { color: #575757; font-size: 36px; padding: 0; margin: 0; } .white_background { display: block; background: #ffffff; } .fah_cell_wrapper_featured { display: block; height: 410px; color: #ffffff; } .fah_cell_wrapper_featured .featured_content { padding: 5%; } .fah_cell_wrapper_featured .featured_content h2 { display: inline; margin: 20px 0; color: #ffffff; font-size: 16px; } .fah_cell_wrapper_featured .featured_content a { color: #ffffff; } .fah_cell_wrapper_featured .featured_content .excerpt, .serif-content-area { font-family: Georgia, "Times New Roman", Serif; font-size: 14px; } .fah_cell_wrapper_bordered { border-right: #E6E6E6 2px solid; } .fah_cell_wrapper { display: block; height: 410px; min-height: 410px; max-height: 410px; background: #ffffff; font-size: 12px; cursor: pointer; overflow: hidden; } .fah_cell_wrapper a { color: #000000; text-decoration: none; } .fah_cell_wrapper a.post_title { font-weight: bold; } .fah_cell_wrapper h2 { display: inline; font-size: 14px; padding: 0; margin: 0; } h4.fahPremiumContentIconRight { clear: none; float: right; display: block; } .fah_cell_wrapper .cooking, .fah_cell_wrapper .food-and-health, .fah_cell_wrapper .disease-prevention, .fah_cell_wrapper .kids, .fah_cell_wrapper .myplate { text-transform: uppercase; } .fah_cell_wrapper .cooking, .fah-cooking { color: #faa518; } .fah_cell_wrapper .food-and-health, .fah-food-and-health { color: #da343a; } .fah_cell_wrapper .disease-prevention, .fah-disease-prevention { color: #278f51; } .fah_cell_wrapper .kids, .fah-kids { color: #4b76a5; } .fah_cell_wrapper .myplate, .fah-myplate { color: #7F5277; } #colophon { clear: both; display: block; background: #ffffff; width: 100%; padding: 0; margin: 0; font-size: 12px; padding-top: 10px; } #colophon h3 { font-size: 14px; } #colophon a { color: #000000; text-decoration: none; } #colophon img.fahrssSubscribeButton { display: block; max-width: 100%; height: auto; margin: 0 auto; padding: 8px 5px; } #colophon ul.fah_sitemap { list-style: none; padding: 0; margin: 0; } h4 { color: #009edf; padding: 0; margin: 0 0 10px 0; font-size: 20px; } .retinaEnabled { border: 0; font: 0/0 a; text-shadow: none; color: transparent; } h4.fahHeaderLogo { background: url(images/logo-fah-orange-white.png) no-repeat; background-size: contain; width: 303px; height: 109px; } h4.fahPremiumContentIcon { background: url(images/icon-fah-premium.png) no-repeat; background-size: contain; width: 28px; height: 27px; } a.post-edit-link { font-weight: bold; text-decoration: none; color: #000000; } .widget { background: #ffffff; border: #cacaca 1px solid; padding: 3px 5px; font-size: 12px; } .widget h3.widget-title { padding: 2px 5px; margin: 0; margin-bottom: 5px; color: #91cb00; border-bottom: #93c001 1px solid; font-family: "Arial", Gadget, sans-serif; font-size: 14px; text-transform: none; } .widget h3.widget-title a, .widget h3.widget-title a:hover { color: #91cb00; } .widget_image img { display: block; margin: 0 auto; box-shadow: none; } .widget ul { display: block; padding: 0; margin: 0; } .widget ul li { padding: 0; margin: 0; padding-left: 10px; } .widget ul li a { font-size: 12px; } a.sidebar-join-banner { display: block; margin: 0 auto; text-align: center; } .nav-links { border-top: #e0e2dd 2px solid; padding-top: 5px; } .nav-links a.page-numbers { color: #c7c6c4; } .nav-links .page-numbers { padding: 10px; } .nav-links .current { border-top: #000000 1px solid; } .recipe_wrapper { width: 100%; max-width: 980px; } /* calendar */ table.calendar { border-left:1px solid #999; background: #ffffff; } tr.calendar-row { } td.calendar-day { height: 80px; min-height:80px; font-size:11px; position:relative; vertical-align: text-top; } * html div.calendar-day { height:80px; } td.calendar-day:hover { background:#eceff5; } td.calendar-day-np { background:#eee; min-height:80px; } * html div.calendar-day-np { height:80px; } td.calendar-day-head { background:#ccc; font-weight:bold; text-align:center; width:120px; padding:5px; border-bottom:1px solid #999; border-top:1px solid #999; border-right:1px solid #999; } div.day-number { background:#999; padding:5px; color:#fff; font-weight:bold; float:right; margin:0px 0px 0 0; width:20px; text-align:center; } td.calendar-day a { display: block; color: #ffffff; text-decoration: none; } /* shared */ td.calendar-day, td.calendar-day-np { width:120px; padding:0px; border-bottom:1px solid #999; border-right:1px solid #999; } ul.mobile_calendar { display: none; } ul#month_list { list-style: none; text-align: center; } ul#month_list li { display: inline; text-transform: uppercase; } ul#month_list li:after { content: " | "; } ul#month_list li:last-child:after { content: ""; } h2.calendar { text-align: center; padding: 10px 0px; } h3.h_links { text-align: center; clear: both; font-size: 14px; } h3.h_links a { color: #000000; } .calendar_content_wrapper { background: #ffffff; display: block; min-height: 280px; -moz-border-radius: 10px 10px 0px 0px; -webkit-border-radius: 10px 10px 0px 0px; -khtml-border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px; border: #b5b5b5 1px solid; position: relative; } .calendar_content_wrapper h4 { display: block; padding: 5px; position: relative; top: -15px; left: 6px; width: 80%; -moz-box-shadow: 3px 3px 4px 1px #000000; -webkit-box-shadow: 3px 3px 4px 1px #000000; box-shadow: 3px 3px 4px 1px #000000; color: #ffffff; background: #000000; font-size: 18px; } .calendar_content_wrapper h4.food_weeks { background: #3d3d3d; } .calendar_content_wrapper h4.food_months { background: #6b9e01; } .calendar_content_wrapper h4.month_recipes { background: #457db8; } .calendar_content_wrapper h4.month_bestsellers { background: #FBA51A; } .calendar_content_wrapper .more_button { display: block; text-align: right; font-size: 14px; position: absolute; bottom: 0; right: 0; padding: 10px; } .calendar_content_wrapper ul { list-style: none; margin: 0 10px; } .calendar_content_wrapper ul.national_food { max-height: 215px; overflow: scroll; } .yearWrapper { display: block; margin: 0 auto; width: 300px; } .yearWrapper select { width: 170px; } .in_season img { display: block; max-width: 100%; height: auto; } p.event_shell { background: #6a9d02; color: #ffffff; margin: 10px 0; padding: 3px 5px; } p.multipleDay a { color: #6a9d02; } .event_shell a { color: #ffffff; } #view_event_wrapper { min-width: 300px; width: 70%; margin: 0 auto; margin-top: 10px; padding: 10px; font-size: 14px; background: #ffffff; border: #FBA51A 2px solid; } #view_event_wrapper img { display: block; margin-left: auto; margin-right: auto; } #view_event_wrapper h1 { color: #6A9D02; } #view_event_wrapper ul { list-style: none; } #view_event_wrapper ul li { float: left; display: block; } #view_event_wrapper ul li.label { clear: both; width: 25%; font-weight: bold; } #view_event_wrapper ul li.description { width: 71%; margin-left: 4%; } #view_event_wrapper #buttons { border-top: #000000 1px solid; text-align: center; } #view_event_wrapper #buttons a.main { display: block; background: #FBA51A; color: #ffffff; margin: 0 auto; margin-top: 10px; margin-bottom: 5px; padding: 5px; text-align: center; font-weight: bold; } .calendarPosts .printfriendly { display: none; } .full_width { width: 100%; } #content h1.title { font-size: 3.2em; line-height: 1.4em; } #accordion {width:95%; margin:0 auto} #accordion dt a {color:#000000;} .accordion {font:12px Verdana,Arial; color:#033} .accordion dt {border:2px solid #FAA517; padding:8px; font-weight:bold; margin-top:5px; cursor:pointer; background:url(images/header.gif)} .accordion dt:hover {background:url(images/header_over.gif)} .accordion dd {overflow:hidden; background:#fff; text-align: center;} .accordion dd.show { display: block; } .accordion dd.hide { display: none; } .accordion span {display:block; border:2px solid #FAA517; border-top:none; padding:15px} #accordion ._33 { overflow: hidden; white-space: normal; word-wrap: break-word; } #accordion ._33 img { height: 205px; width: 100%; max-width: 100%; border: none; } #accordion ._33 img.icon {height: 15px; width: 15px; } .wpfp-span { display: none; } #page .wpfp-span { display: block; } .user-header-wrapper { display: block; width:100%; position:relative; background:#464646; border-bottom:1px solid #CCC; color: #ffffff; z-index: 999; } .user-header { margin:0px auto; padding: 5px 10px; height: 17px; } .user-header a { color: #ffffff; } .user-left { float: left; width: 50%; } .user-left img { max-height: 15px; width: auto; bottom: 1px; position: relative; padding-right: 5px; } .user-right { float: left; width: 50%; text-align: right; } /* courses */ .fah-ld-wrapper { text-align: left; } .fah-ld-wrapper h2 { display: block; min-height: 3em; font-size: 16px; line-height: 1.5em; } .fah-ld-wrapper h2 a, .fah-ld-wrapper h2 a:visited { text-decoration: none; color: #060606; } .fah-ld-wrapper h2 a:hover { text-decoration: none; color: #060606; } .fah-ld-wrapper .fah-ld-button { display: block; width: 100%; background: #fba51a; padding: 5px; text-align: center; } .fah-ld-wrapper a.fah-ld-button { text-decoration: none; color: #ffffff; font-family: Georgia, "Times New Roman", Serif; font-weight: bold; font-size: 16px; border-radius: 10px; } .fah-ld-header-form { width: 100%; text-align: center; font-weight: bold; font-size: 24px; } .fah-ld-header-form input { width: 200px; background: #E6E6E6; color: #a7a7a7; border: none; border-bottom: #060606 1px solid; text-align: center; font-size: 18px; } .fah-ld-header-form input.submit { width: 200px; background: #fba51a; color: #ffffff; border: none; border-radius: 10px; text-align: center; font-size: 18px; font-weight: bold; } @media ( -webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { h4.fahHeaderLogo { background: url(images/logo-fah-orange-white_x2.png) no-repeat; background-size: cover; } h4.fahPremiumContentIcon { background: url(images/icon-fah-premium_x2.png) no-repeat; background-size: cover; } } /* Hides navigation links and site footer when infinite scroll is active */ #infinite-footer, .infinite-scroll #navigation, .infinite-scroll.neverending #footer { display: none; } /* Shows the footer again in case all posts have been loaded */ .infinity-end.neverending #footer { display: block; } .hide_element { display: none; } /* #Responsive Mobile (Portrait) ================================================== */ @media only screen and (max-width: 783px) { #network_wrapper, #network_shell, #logo_wrapper, #logo_content, #logo_shell, #special_offer_shell, .menu_shell, .menu_wrapper, #sub_menu_shell, #content_shell, #sub_page_wrapper { width: 100%; min-width: 320px; } html, body, #page, #masthead { min-width: 320px; } #wpadminbar { display: none; } #masthead, .main-navigation { padding: 0; margin: 0; bottom: 7px; } body.admin-bar .main-navigation { margin: 0; } nav#site-navigation { margin-top: 0; } ul#primary-menu { text-align: left; } .search-container-desktop, .site-branding-user { display: none; } .site-branding { float: none; margin: 0 auto; padding: 0; } .mobile_hide, .menu_container ul .mobile_hide, .menu_container ul li:hover .mobile_hide, .content_container .mobile_hide, .footer_container .mobile_hide, #navigation ul li#nav_main_search { display: none; background: #ce0000; } .mobile_show, .mobile_only { display: block; } ._20, ._25, ._33, ._40, ._50, ._67, ._75, ._100, .__50, .full-width .__50, .__49, .__33, .__35, .__65, .mobile_clear, .mobile_only, #colophon ._60, #colophon .__40, #colophon .__30 { clear: both; width: 100%; } .primary-menu-premium-wrapper { float: left; width: 100%; } .main-navigation ul#primary-menu, .main-navigation ul#primary-menu li { background: #191919; } .main-navigation ul#primary-menu li:after { content: ''; padding: 0; } .fah_cell_wrapper { width: 100%; } .fah_cell_wrapper_featured .__33 { width: 45%; } .content-area { width: 100%; } .main-navigation ul#primary-menu li ul.sub-menu li { display: none; } .main-navigation ul#primary-menu li:hover ul.sub-menu li { display: block; } .main-navigation ul#primary-menu li:hover ul.sub-menu li ul { display: none; } .recipeLeft, .recipeRight { clear: left; width: 100%; } .recipeViewLeft, .recipeViewRight { clear: left; width: 98%; } ul.mobile_calendar { display: none; } table.calendar { width: 100%; } td.calendar-day-head, td.calendar-day, td.calendar-day-np { max-width:20px; overflow: hidden; } .fah-ld-wrapper { margin-bottom: 20px; } } /* 15.0 Media queries -------------------------------------------------------------- */ /* Please note, that all CSS rules, placed outside of media queries, affect all screen sizes - starting from small screens * (mobile phones) and going up to the very wide screens (widescreen monitors, high resolution tablets). Those rules can be * adjusted and overridden, targeting specific screen sizes in media queries bellow. * * Important: lower size media queries will also affect wider screen sizes, e.g. min-width: 770px media query will also affect * screen sizes starting with 960px and 1250px. * * Wondering what are the screen sizes of most popular devices? Check: http://screensiz.es */ /* Does the same thing as , * but in the future W3C standard way. -ms- prefix is required for IE10+ to * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor * the meta tag. See https://core.trac.wordpress.org/ticket/25888. */ @-ms-viewport { width: auto!important; } @viewport { width: device-width; } /* 15.1 Minimum width of 783 pixels - it is activated at the same time as mobile view of WordPress admin-bar 782px * (small screens - mobile phones, small tablets in portrait view mode) */ @media screen and (min-width: 783px) { body { margin-top: 0; } body .site { margin: 0 auto; max-width: 1040px; max-width: 65rem; /* overflow: hidden; */ /* Had to disable it to make visible top menu sub-items */ } /* Tip52 - Default site layout for normal view */ .widget-area { float: right; width: 30.5%; } /* Tip52b - Change site layout (position of sidebar) for normal view */ /* .content-area { float: right; width: 65.104166667%; } .widget-area { float: left; width: 30.5%; } */ body.template-front-page .content-area, body.attachment .content-area, body.full-width .content-area { width: 100%; } .site-header { text-align: center; } /* Tip14 - Site Logo plugin/feature support. Check: inc/plugin-compatibility.php for more details. */ .site-logo-link { display: inline-block; float: left; margin: 24px 24px 0 0; margin: 1.5rem 1.5rem 0 0; } .site-logo { } #site-title-wrapper { float: left; padding-top: 0; margin-bottom: 0; } .has-site-logo #site-title-wrapper { margin-bottom: 0; margin-top: 24px; margin-top: 1.5rem; } .site-header .site-title, .site-header .site-description { text-align: left; } .site-header .site-title { font-weight: normal; font-size: 26px; font-size: 1.625rem; line-height: 1.846153846; margin-bottom: 0; } /* Tip88 - Customize color scheme: Site Title and Description - can also be changed via Admin > Appearance > Customizer */ .site-header .site-title, .site-header .site-title a, .site-header .site-description a { color: #333; } .site-header .site-title a:hover, .site-header .site-title a:focus, .site-header .site-description a:hover, .site-header .site-description a:focus { color: #ff6111; } /* Top menu for the normal site */ .main-navigation { position: static; height: 100%; background: none repeat scroll 0% 0% rgb(255, 255, 255); /* background: rgba(255, 255, 255, 0.9); */ /* make background transparent */ border-bottom: none; box-shadow: none; } .main-navigation, body.admin-bar .main-navigation { /* Do not need extra top margin for admin-bar in normal view */ margin-top: 24px; margin-top: 1.5rem; } .main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul { border-top: 1px solid #bbb; border-bottom: 1px solid #bbb; display: inline-block !important; text-align: left; width: 100%; } .main-navigation ul.nav-menu { text-align: left; } .main-navigation ul.nav-menu ul.sub-menu { text-align: left; } /* Adding shadow for the drop down menu items */ .main-navigation ul.nav-menu ul.sub-menu li { -webkit-box-shadow: 3px 3px 5px rgba(100, 100, 100, 0.3); -moz-box-shadow: 3px 3px 5px rgba(100, 100, 100, 0.3); box-shadow: 3px 3px 5px rgba(100, 100, 100, 0.3); } .main-navigation ul { margin: 0; text-indent: 0; } .main-navigation li a, .main-navigation li { display: inline-block; text-decoration: none; } .main-navigation li a { border-bottom: 0; color: #6a6a6a; line-height: 3.692307692; white-space: nowrap; } .main-navigation li a:hover, .main-navigation li a:focus { color: #000; outline: none; text-decoration: underline; } .main-navigation li { position: relative; margin: 0 40px 0 0; margin: 0 2.5rem 0 0; font-size: 12px; font-size: 0.75rem; line-height: 1.42857143; } .main-navigation li ul { margin: 0; padding: 0; position: absolute; top: 100%; z-index: 100; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); } .main-navigation li ul ul { top: 0; left: 100%; } .main-navigation ul li:hover > ul, .main-navigation ul li:focus > ul, .main-navigation .focus > ul { border-left: 0; clip: inherit; overflow: inherit; height: inherit; width: inherit; } .main-navigation li ul li a { background: #efefef; border-bottom: 1px solid #ededed; display: block; font-size: 11px; font-size: 0.6875rem; line-height: 2.181818182; padding: 8px 10px; padding: 0.5rem 0.625rem; width: 200px; width: 14.285714286rem; white-space: normal; } .main-navigation li ul li a:hover, .main-navigation li ul li a:focus { background: #e3e3e3; color: #444; } .main-navigation ul li ul li, .main-navigation ul li ul li ul li { border-bottom: 1px solid #ccc; } .main-navigation ul li ul li:last-child, .main-navigation ul li ul li ul li:last-child { border-bottom: 0; } .main-navigation .current-menu-item > a, .main-navigation .current-menu-ancestor > a, .main-navigation .current_page_item > a, .main-navigation .current_page_ancestor > a { color: #636363; font-weight: bold; } .main-navigation .menu-toggle, .main-navigation.toggled .nav-menu { display: none; } /* Tip05 - Mark main navigation menu items, containing children with special css class * Main navigation menu items with drop-down children will be marked by a distinct icon (caret down) via style.css * @link https://stackoverflow.com/questions/8448978/wordpress-how-do-i-know-if-a-menu-item-has-children */ .nav-menu .menu-item-has-children > a:after, .nav-menu .page_item_has_children > a:after { content: "\f078"; /* fa-chevron-down */ padding: 0 0 2px 5px; padding: 0 0 0.125rem 0.3125rem; font-size: 10px; font-size: 0.625rem; text-decoration: none; vertical-align: middle; } .sub-menu .menu-item-has-children > a:after, .sub-menu .page_item_has_children > a:after { content: "\f054"; /* fa-chevron-right */ position: absolute; right: 8px; top: 16px; font-size: 10px; font-size: 0.625rem; text-decoration: none; } /* Search form for mobile menu */ .site-header .search-container-mobile { display: none; } .entry-header .entry-title { font-size: 26px; font-size: 1.625rem; font-weight: normal; line-height: 1.4; } .entry-header .entry-title, .entry-header .entry-title a { color: #000; /* Tip32 - Add shadow to post/page title. Usage: text-shadow: horizontal-offset vertical-offset blur color; last digit of rgba sets opacity */ /* text-shadow: 1px 1px 3px rgba(0,0,0,0.2); */ } article.format-link .entry-content a { font-weight: normal; } .list-view .entry-header .entry-meta { display: none; } /* Tip26b - uncomment next CSS rule to Print HTML bellow post title with meta information (date/time and author) * for the index/archive views in NORMAL view. */ /* .list-view .entry-header .entry-meta { display: block; } */ /* Display archive navigation page numbers in larger views */ .pagination .page-numbers { display: inline-block; } #respond form input[type="text"], #respond form input[type="email"], #respond form input[type="url"] { width: 55%; } #respond form textarea.blog-textarea { width: 79.666666667%; } .template-front-page .content-area, .template-front-page article { overflow: hidden; } .template-front-page.has-post-thumbnail article { float: left; width: 47.916666667%; } .entry-page-image { float: right; margin-bottom: 0; width: 47.916666667%; } .entry-meta { line-height: 1.8; } .template-front-page .site-content .widget-area .widget, .template-front-page.two-sidebars .site-content .widget-area .front-widgets { float: left; width: 51.875%; margin-bottom: 24px; margin-bottom: 1.5rem; } .template-front-page .site-content .widget-area .widget:nth-child(odd) { clear: right; } .template-front-page .site-content .widget-area .widget:nth-child(even), .template-front-page.two-sidebars .site-content .widget-area .front-widgets + .front-widgets { float: right; width: 39.0625%; margin: 0 0 24px; margin: 0 0 1.5rem; } .template-front-page.two-sidebars .site-content .widget, .template-front-page.two-sidebars .site-content .widget:nth-child(even) { float: none; width: auto; } .comments-area article header time { margin-top: 10px; margin-top: 0.625rem; } .comment-list .children { margin-left: 48px; margin-left: 3rem; } /* Sidebar and Front Page template widgets have no border in normal view */ #secondary { border-top: 0px solid #ededed; background: transparent; background-image: none; margin: 24px 0; margin: 1.5rem 0; padding: 0; } /* Tip85 - Add Social Media Menu. Read more: http://justintadlock.com/archives/2013/08/14/social-nav-menus-part-2 */ .social-navigation ul li { display: inline; margin: 0 0 0 5px; margin: 0 0 0 0.3125rem; } .social-navigation a:before { line-height: 1.1; } /* Tip86 - Style social icons manualy added in the sidebar */ .widget-area .widget .social-link { margin: 0 10px 10px 0; margin: 0 0.625rem 0.625rem 0; } /* Three footer widget areas */ #footer-widgets { width: 100%; border-top: none; } #footer-widgets.three #footer-widget-left { float: left; width: 33.3%; padding-right: 2.1%; } #footer-widgets.three #footer-widget-middle { float: left; width: 33.3%; padding-left: 1.1%; padding-right: 1.1%; } #footer-widgets.three #footer-widget-right { float: right; width: 33.3%; padding-left: 2.1%; } /* If Footer widgets are present */ .footer-widgets .site-footer #footer-widgets { margin: 12px 0 24px 0; margin: 0.75rem 0 1.5rem 0; } /* Tip62 - Add side borders for the middle footer widget - to better separate widgets visually. Uncomment next section: */ /* #footer-widgets.three #footer-widget-middle { border: 1px solid #ededed; border-width: 0 1px; } */ .site-info, .site-info-2 { font-size: 11px; font-size: 0.6875rem; } } /* 15.2 Minimum width of 1100 pixels (average size screens - monitors, small tablets in landscape view mode, larger tablets) */ @media screen and (min-width: 1100px) { body { background-color: #e6e6e6; } body .site { padding: 12px 40px 0 40px; padding: 0.75rem 2.5rem 0 2.5rem; margin-top: 24px; margin-top: 1.5rem; margin-bottom: 48px; margin-bottom: 3rem; -webkit-box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3); -moz-box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3); box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3); } body.custom-background-empty { background-color: #fff; } body.custom-background-empty .site, body.custom-background-white .site { padding-top: 0; margin-top: 12px; margin-top: 0.75rem; margin-bottom: 0; box-shadow: none; } .entry-content .page-links a, .entry-content .page-links > span { margin: 0 5px 5px 0; margin: 0 0.3125rem 0.3125rem 0; } #site-admin-link a { margin-right: 3px; margin-right: 0.1875rem; } .site-info-2 { margin-top: -10px; margin-top: -0.625rem; } } /* 15.3 Minimum width of 1240 pixels (big screens - widescreen monitors, high resolution tablets) */ @media screen and (min-width: 1240px) { /* Here you can add specific styles for this screen widh */ } /* 15.4 Retina-specific styles. This style cannot be processed by LESS */ @media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { /* Tip10 - Add Twenty Thirteen search form to WordPress nav menu - http://diythemes.com/thesis/rtfm/add-search-form-wp-wordpress-nav-menus/ */ .site-header .search-form [type="search"], .site-header .search-form [type="text"] { background-image: url(images/icon-search-2x.png); } } /* 16.0 Print ----------------------------------------------- */ @media print { body { background: none !important; color: #000; font-size: 10pt; } /* Show URLs for links */ .entry-content a:after, .entry-content a:visited:after, footer a[rel=bookmark]:after, footer a[rel=bookmark]:visited:after { content: " [" attr(href) "] "; } a { text-decoration: none; } .entry-content img, .comment-content img, .author-avatar img, img.wp-post-image { border-radius: 0; box-shadow: none; } .site { clear: both !important; display: block !important; float: none !important; max-width: 100%; position: relative !important; } .site-header { margin-bottom: 48px; margin-bottom: 3rem; text-align: left; } .site-header .site-title { font-size: 21pt; line-height: 1; text-align: left; } .site-header .site-description { color: #000; font-size: 10pt; text-align: left; } .site-header .site-title a, .site-header .site-description a { color: #000; } .author-avatar, #colophon, #respond, .comment-list .comment-edit-link, .comment-list .reply, .entry-header .comments-link, .entry-meta .edit-link a, .entry-content .page-links, .content-area nav, .widget-area, img.header-image, .main-navigation, .video-wrapper { display: none; } .site-content { border-top: none; box-shadow: none; } .content-area { margin: 0; width: auto; } .singular .entry-header .entry-meta { position: static; } .singular .content-area, .singular .entry-header, .singular .entry-content, .singular footer.entry-meta, .singular .comments-title { margin: 0; width: 100%; } .entry-header .entry-title, .entry-title, .singular .entry-title { font-size: 21pt; } .singular .entry-header { margin-bottom: 24px; margin-bottom: 1.5rem; } .entry-content blockquote, .entry-content blockquote p, .entry-content blockquote p:first-child:before, .comment-content blockquote p:first-child:before { color: #444; } footer.entry-meta, footer.entry-meta a { color: #444; font-size: 10pt; } .author-description { float: none; width: auto; } /* 16.1 Comments */ .comment-list > li.comment { background: none; position: relative; width: auto; } .comment-list .avatar { height: 39px; left: 2.2em; top: 2.2em; width: 39px; } .comments-area article header cite, .comments-area article header time { margin-left: 50px; margin-left: 3.57142857rem; } }