Community Forums › Forums › Search › Search Results for 'svg'
-
AuthorSearch Results
-
January 27, 2019 at 4:03 pm #489069YumeiParticipant
Tried to test site speed on gtmetrix today and discovered a few issues. While I probably have to live with a few, this one confuses me. Apparently there is an image file that has compression issues:
wp-content/themes/breakthrough-pro/images/hero-arrow-white.svg (expiration not specified)
Why is there an svg file in the images folder (I thought you need a plugin to use svg images)? Can I change it to a png file?
Any insight will be appreciated!
January 16, 2019 at 2:13 pm #318323In reply to: Critique Our Put-in-Bay Information & Travel Site
mtibesarParticipantWhat theme did you use?
I think the font size is a little small for my old eyes.
Very colorful (fun-loving) design which is appropriate for the area.
Logo is top-notch and appears to be a svg - nice!
Home page has a lot of text (reading). Perhaps I would relocate this further down the menu tree and simplify the home page a bit.
Photos of the area seem to be pretty good quality. Don't settle for anything less than outstanding.
The header with a jagged bottom is a nice touch - how did you do this?
All in all I like the site and you have obviously worked very hard on the content which is the main draw of the site. Good job!
December 10, 2018 at 5:14 am #224937In reply to: Mobile Responsive Images
Victor FontModeratorThemes only display content. Responsive images are served by WordPress, not the theme.
If you have an image that you've placed in a widget with custom HTML, you have to adjust for the responsiveness yourself.
I've never had a problem with responsive images. I switched to SVG images on the front page with my last site makeover. If I can avoid it, my goal is to not use bitmap images any longer (jpg, png)
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?November 22, 2018 at 12:14 pm #224526Victor FontModeratorAdding SVG support to WordPress is a little more complex than a snippet. It really has nothing to do with the Genesis Framework either.
I use SVGs on all the sites I support by adding the SVG Support plugin from the WordPress repository. https://wordpress.org/plugins/svg-support/
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?November 22, 2018 at 3:20 am #224518[Resolved]Topic: Reliable Snippet to Use Inline SVG for site logo – as seen on StudioPress.com
in forum Design Tips and TrickscbryantMemberThere's many good reasons to use an inline SVG for the site logo.
But I'm finding it harder than expected to make it work perfectly.StudioPress.com appears to have a nice implementation of an inline SVG with a fallback (for ie8) to a .png.
If StudioPress reads these posts: could you add share the SVG logo setup/implementation on the Code Snippets on the studiopress site, or here?
Thanks for any help on this.
November 12, 2018 at 3:13 pm #224320In reply to: Trying to Add Logo to Magazine Pro
Victor FontModeratorWhat size do you want the logo to be? You can change the dimensions by editing functions.php around line 102. You'll also have to adjust the CSS to accommodate the different size. Use your browser's built-in inspection tool to find the correct CSS to change.
As an FYI, SVG images produce the best results for enlarging and reducing the size of images. WordPress does not support SVG natively, so you have to use the SVG support plugin.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?October 30, 2018 at 7:43 am #224067In reply to: how to change Digital Pro's font
PhyllisOrzalliMemberThank you for your reply. Below is what I am referring to:
/* HTML5 Reset
---------------------------------------------------------------------------------------------------- *//* Baseline Normalize
--------------------------------------------- */
/* normalize.css v3.0.1 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,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:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:600}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#5b5e5e}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:600}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
October 21, 2018 at 5:05 am #223894In reply to: How to change background color for header on mobile
NomadGirlMemberIn case this helps, here is the code for my stylesheet found by going to Dashboard > Appearance > Editor ...
/* Theme Name: Author Pro Theme Theme URI: http://my.studiopress.com/themes/author/ Description: The industry standard for Premium WordPress Themes. Author: StudioPress Author URI: http://www.studiopress.com/ Version: 1.0.0 Tags: black, blue, white, one-column, two-columns, left-sidebar, right-sidebar, responsive-layout, custom-menu, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready Template: genesis Template Version: 2.1.2 License: GPL-2.0+ License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* # Table of Contents - HTML5 Reset - Baseline Normalize - Box Sizing - Float Clearing - Defaults - Typographical Elements - Headings - Objects - Gallery - Forms - Tables - Structure and Layout - Site Containers - Column Widths and Positions - Column Classes - Common Classes - Avatar - Genesis - Search Form - Titles - WordPress - Widgets - Featured Content - Plugins - Genesis Author Pro - Genesis eNews Extended - Jetpack - Site Header - Title Area - Widget Area - Shrink - Site Navigation - Primary Navigation - Secondary Navigation - Responsive Menu - Content Area - Home - Flexible Widgets - Entries - Entry Meta - After Entry - Pagination - Comments - Sidebars - Footer Widgets - Site Footer - Media Queries - Max-width: 1320px - Max-width: 1200px - Max-width: 980px - Max-width: 800px */ /* # HTML5 Reset ---------------------------------------------------------------------------------------------------- */ /* ## Baseline Normalize --------------------------------------------- */ /* normalize.css v3.0.1 | MIT License | git.io/normalize */ html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,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:0 0}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.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:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0} /* ## Box Sizing --------------------------------------------- */ html, input[type="search"]{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } /* ## Float Clearing --------------------------------------------- */ .author-box:before, .clearfix:before, .entry:before, .entry-content:before, .footer-widgets:before, .nav-primary:before, .nav-secondary:before, .pagination:before, .site-container:before, .site-footer:before, .site-header:before, .site-inner:before, .widget:before, .wrap:before { content: " "; display: table; } .author-box:after, .clearfix:after, .entry:after, .entry-content:after, .footer-widgets:after, .nav-primary:after, .nav-secondary:after, .pagination:after, .site-container:after, .site-footer:after, .site-header:after, .site-inner:after, .widget:after, .wrap:after { clear: both; content: " "; display: table; } /* # Defaults ---------------------------------------------------------------------------------------------------- */ /* ## Typographical Elements --------------------------------------------- */ body { background-color: #7a8690; color: #000; font-family: Lato, sans-serif; font-size: 18px; font-weight: 300; line-height: 1.625; margin: 0; } a, button, input:focus, input[type="button"], input[type="reset"], input[type="submit"], textarea:focus, .button, .gallery img { -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } ::-moz-selection { background-color: #000; color: #fff; } ::selection { background-color: #000; color: #fff; } a { color: #0085da; text-decoration: none; } a:hover { color: #000; } p { margin: 0 0 28px; padding: 0; } ol, ul { margin: 0; padding: 0; } li { list-style-type: none; } b, strong { font-weight: 700; } cite, em, i { font-style: italic; } blockquote { margin: 30px; } blockquote::before { color: #e1e9ee; content: "\201C"; display: block; font-size: 60px; font-weight: 400; height: 0; left: -30px; position: relative; top: -16px; } hr { border: 0; border-collapse: collapse; border-top: 1px solid #000; clear: both; margin: 40px 0; } /* ## Headings --------------------------------------------- */ h1, h2, h3, h4, h5, h6 { font-family: "Lato", sans-serif; font-weight: 900; line-height: 1.2; margin: 0 0 10px; } h1 { font-size: 48px; } h2 { font-size: 36px; } h3 { font-size: 30px; } h4 { font-size: 24px; } h5 { font-size: 20px; } h6 { font-size: 18px; } /* ## Objects --------------------------------------------- */ embed, iframe, img, object, video, .wp-caption { max-width: 100%; } img { height: auto; } .featured-content img, .gallery img { width: auto; } .featured-content img { margin-bottom: -8px; } /* ## Gallery --------------------------------------------- */ .gallery { overflow: hidden; } .gallery-item { float: left; margin: 0 0 28px; padding: 2px; text-align: center; } .gallery-columns-1 .gallery-item { width: 100%; } .gallery-columns-2 .gallery-item { width: 50%; } .gallery-columns-3 .gallery-item { width: 33%; } .gallery-columns-4 .gallery-item { width: 25%; } .gallery-columns-5 .gallery-item { width: 20%; } .gallery-columns-6 .gallery-item { width: 16.6666%; } .gallery-columns-7 .gallery-item { width: 14.2857%; } .gallery-columns-8 .gallery-item { width: 12.5%; } .gallery-columns-9 .gallery-item { width: 11.1111%; } .gallery img { border: 1px solid #ddd; height: auto; padding: 4px; } .gallery img:hover { border: 1px solid #999; } /* ## Forms --------------------------------------------- */ input, select, textarea { background-color: #fff; border: 1px solid #ddd; border-radius: 3px; box-shadow: none; color: #000; font-size: 18px; font-weight: 300; padding: 16px; width: 100%; } input:focus, textarea:focus { border: 1px solid #000; outline: none; } input[type="checkbox"], input[type="image"], input[type="radio"] { width: auto; } ::-moz-placeholder { color: #000; font-weight: 300; opacity: 1; } ::-webkit-input-placeholder { color: #000; font-weight: 300; } button, input[type="button"], input[type="reset"], input[type="submit"], .button, .featured-content .more-link { background-color: transparent; border: 1px solid #000; border-radius: 3px; color: #000; cursor: pointer; font-size: 14px; font-weight: 400; line-height: 1.625; padding: 16px 32px; text-align: center; white-space: normal; width: auto; } button:hover, input:hover[type="button"], input:hover[type="reset"], input:hover[type="submit"], .button:hover, .featured-content .more-link:hover { background-color: #000; color: #fff; } .entry-content .button:hover { color: #fff; } .content .widget-full .featuredpage .button, .content .widget-full .featuredpage .more-link, .footer-widgets button, .footer-widgets input[type="button"], .footer-widgets input[type="reset"], .footer-widgets input[type="submit"], .footer-widgets .button, .footer-widgets .featured-content .more-link { border-color: #fff; color: #fff; } .content .widget-full .featuredpage .button:hover, .content .widget-full .featuredpage .more-link:hover, .footer-widgets button:hover, .footer-widgets input:hover[type="button"], .footer-widgets input:hover[type="reset"], .footer-widgets input:hover[type="submit"], .footer-widgets .button:hover, .footer-widgets .featured-content .more-link:hover { background-color: #fff; color: #000; } button.small, input[type="button"].small, input[type="reset"].small, input[type="submit"].small, .button.small { padding: 8px 16px; } .button { display: inline-block; } .more-link { display: table; margin-top: 30px; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button { display: none; } button:disabled, button:disabled:hover, input:disabled, input:disabled:hover, input[type="button"]:disabled, input[type="button"]:disabled:hover, input[type="reset"]:disabled, input[type="reset"]:disabled:hover, input[type="submit"]:disabled, input[type="submit"]:disabled:hover { background-color: #f2f2f2; border-color: #ddd; color: #777; cursor: not-allowed; } /* ## Tables --------------------------------------------- */ table { border-collapse: collapse; border-spacing: 0; line-height: 2; margin-bottom: 40px; width: 100%; } tbody { border-bottom: 1px solid #fff; } td, th { text-align: left; } td { border-top: 1px solid #fff; padding: 6px 0; } th { font-weight: 400; } /* # Structure and Layout ---------------------------------------------------------------------------------------------------- */ /* ## Site Containers --------------------------------------------- */ .site-inner, .wrap { margin: 0 auto; max-width: 1280px; } .site-inner { background-color: #fff; clear: both; margin-top: 120px; position: relative; z-index: 99; } .featured-widget-area + .site-inner, .landing-page .site-inner { margin-top: 0; } /* ## Column Widths and Positions --------------------------------------------- */ /* ### Content */ .content { float: right; width: 900px; } .content-sidebar .content { float: left; } .full-width-content .content { width: 100%; } .archive.genesis-author-pro .content, .archive.genesis-pro-portfolio .content { padding: 80px 80px 0; } /* ### Primary Sidebar */ .sidebar-primary { float: right; width: 380px; } .sidebar-content .sidebar-primary { float: left; } /* ## Column Classes --------------------------------------------- */ /* Link: http://twitter.github.io/bootstrap/assets/css/bootstrap-responsive.css */ .five-sixths, .four-sixths, .one-fourth, .one-half, .one-sixth, .one-third, .three-fourths, .three-sixths, .two-fourths, .two-sixths, .two-thirds { float: left; margin-left: 2.564102564102564%; } .one-half, .three-sixths, .two-fourths { width: 48.717948717948715%; } .one-third, .two-sixths { width: 31.623931623931625%; } .four-sixths, .two-thirds { width: 65.81196581196582%; } .one-fourth { width: 23.076923076923077%; } .three-fourths { width: 74.35897435897436%; } .one-sixth { width: 14.52991452991453%; } .five-sixths { width: 82.90598290598291%; } .first { clear: both; margin-left: 0; } /* # Common Classes ---------------------------------------------------------------------------------------------------- */ /* ## Avatar --------------------------------------------- */ .avatar { border-radius: 50%; float: left; } .alignleft .avatar, .author-box .avatar { margin-right: 24px; } .alignright .avatar { margin-left: 24px; } .comment .avatar { margin: 0 16px 24px 0; } /* ## Genesis --------------------------------------------- */ .breadcrumb { background-color: #f3f3f3; padding: 20px 30px; } .archive-description, .author-box { background-color: #f9f9f9; font-size: 16px; padding: 80px; } .author-box { margin-bottom: 80px; } .author-box-title { font-size: 16px; margin-bottom: 4px; } .archive-description p:last-child, .author-box p:last-child { margin-bottom: 0; } /* ## Search Form --------------------------------------------- */ .search-form { overflow: hidden; } .site-header .search-form { float: right; margin-top: 12px; } .entry-content .search-form, .site-header .search-form { width: 50%; } .entry-content .search-form input { margin-bottom: 16px; } .genesis-nav-menu .search input[type="submit"], .widget_search input[type="submit"] { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; padding: 0; position: absolute; width: 1px; } /* ## Titles --------------------------------------------- */ .archive-title { font-size: 24px; } .entry-title { font-size: 36px; } .entry-title a, .sidebar .widget-title a { color: #000; } .entry-title a:hover { color: #0085da; } .widget-title { font-size: 18px; margin-bottom: 20px; text-transform: uppercase; } /* ## WordPress --------------------------------------------- */ a.aligncenter img { display: block; margin: 0 auto; } a.alignnone { display: inline-block; } .alignleft { float: left; text-align: left; } .alignright { float: right; text-align: right; } a.alignleft, a.alignnone, a.alignright { max-width: 100%; } img.centered, .aligncenter { display: block; margin: 0 auto 24px; } img.alignnone, .alignnone { margin: 0 0 12px; } a.alignleft, img.alignleft, .wp-caption.alignleft { margin: 0 24px 24px 0; } a.alignright, img.alignright, .wp-caption.alignright { margin: 0 0 24px 24px; } .wp-caption-text { font-size: 14px; font-weight: 700; text-align: center; } .entry-content p.wp-caption-text { margin-bottom: 0; } .gallery-caption, .entry-content .gallery-caption { margin: 0; } .wp-audio-shortcode, .wp-playlist, .wp-video { margin: 0 0 28px } /* # Widgets ---------------------------------------------------------------------------------------------------- */ .widget-area .widget { margin-bottom: 40px; word-wrap: break-word; } .widget-area p:last-child, .widget-area .widget:last-child { margin-bottom: 0; } .widget ol > li { list-style-position: inside; list-style-type: decimal; padding-left: 20px; text-indent: -20px; } .widget li li { border: 0; margin: 0 0 0 30px; padding: 0; } .widget_calendar table { width: 100%; } .widget_calendar td, .widget_calendar th { text-align: center; } /* ## Featured Content --------------------------------------------- */ .featured-content .entry { margin-bottom: 20px; padding: 0; } .widget-area .featured-content .entry-header p { margin-bottom: 20px; } .featured-content .entry:after { display: none; } .featured-content .entry:last-of-type { margin-bottom: 0; } .featured-content .entry-title { font-size: 22px; } .featured-content .entry:last-of-type + .widget-title { margin-top: 20px; } .featured-content .aligncenter ~ div, .featured-content .aligncenter ~ header { text-align: center; } .featured-content .aligncenter ~ div .more-link { margin: 20px auto 0; } .content .widget-full .featuredpage { background-color: #181c1e; color: #fff; } .content .widget-full .featuredpage .entry { background-color: rgba(255, 255, 255, 0.05); } .content .widget-full .featuredpage a:hover, .content .widget-full .featuredpage .entry-title a { color: #fff; } .content .widget-full .featuredpage .entry-title a:hover { color: #ccc; } /* # Plugins ---------------------------------------------------------------------------------------------------- */ /* ## Genesis Author Pro --------------------------------------------- */ .archive.genesis-author-pro .archive-description, .archive.genesis-author-pro .breadcrumb, .archive.genesis-pro-portfolio .archive-description, .archive.genesis-pro-portfolio .breadcrumb { margin: -80px -80px 80px; } .archive.genesis-author-pro .archive-pagination, .archive.genesis-pro-portfolio .archive-pagination { margin: 0 -80px; } .archive.genesis-author-pro .content .entry { margin-bottom: 20px; } .archive.genesis-author-pro .entry::after, .archive.genesis-pro-portfolio .entry::after { border-bottom-width: 0; padding-top: 0; } .archive.genesis-author-pro .author-pro-featured-image, .author-pro-featured-image a, .single-books .author-pro-featured-image { position: relative; overflow: hidden; } div .book-featured-text-banner { background-color: #0085da; } .featuredbook .image-aligncenter ~ div, .featuredbook .image-aligncenter ~ header { text-align: center; } .featuredbook .book-price { font-weight: 700; } .single-books .content .book-price { border-bottom: 1px solid #000; } /* ## Genesis eNews Extended --------------------------------------------- */ .enews-widget input { font-size: 16px; margin-bottom: 16px; } .enews-widget input[type="submit"] { margin: 0; width: 100%; } .enews form + p { margin-top: 24px; } /* ## Jetpack --------------------------------------------- */ #wpstats { display: none; } /* # Site Header ---------------------------------------------------------------------------------------------------- */ .site-header { background-color: #7a8690; color: #fff; min-height: 120px; position: fixed; width: 100%; z-index: 498; } /* ## Title Area --------------------------------------------- */ .title-area { float: left; padding: 42px 0; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .site-title { font-size: 30px; font-weight: 900; line-height: 1.2; } .site-title a, .site-title a:hover { color: #fff; } .site-description { display: block; height: 0; text-indent: -9999px; } .site-description, .site-title { margin-bottom: 0; } .header-image .title-area { padding: 25px 0; width: 320px; } .header-image .site-title { display: block; text-indent: -9999px; } .header-image .site-title > a { background-size: contain !important; display: block; float: left; min-height: 70px; width: 100%; } /* ## Shrink --------------------------------------------- */ .shrink { min-height: 0; } .shrink .title-area { padding: 17px 0; } .shrink .genesis-nav-menu li a { padding-bottom: 27px; padding-top: 27px; } .header-image .shrink .title-area { padding: 0; } /* # Site Navigation ---------------------------------------------------------------------------------------------------- */ .genesis-nav-menu { clear: both; font-size: 16px; font-weight: 400; line-height: 1; width: 100%; } .genesis-nav-menu .menu-item { display: inline-block; text-align: left; } .genesis-nav-menu a { color: #fff; display: block; padding: 52px 20px; text-transform: uppercase; } .genesis-nav-menu a:hover, .genesis-nav-menu .current-menu-item > a, .genesis-nav-menu .sub-menu .current-menu-item > a:hover { color: #fff; } .genesis-nav-menu .sub-menu { background-color: #181c1e; left: -9999px; opacity: 0; padding: 10px 0; position: absolute; -webkit-transition: opacity .3s ease-in-out; -moz-transition: opacity .3s ease-in-out; -ms-transition: opacity .3s ease-in-out; -o-transition: opacity .3s ease-in-out; transition: opacity .3s ease-in-out; width: 200px; z-index: 499; } .genesis-nav-menu .sub-menu li a { background-color: #181c1e; color: #fff; font-size: 12px; padding: 20px; position: relative; width: 200px; } .genesis-nav-menu .sub-menu .sub-menu { margin: -62px 0 0 199px; } .genesis-nav-menu .menu-item:hover { position: static; } .genesis-nav-menu .menu-item:hover > .sub-menu { left: auto; opacity: 1; } .genesis-nav-menu > .first > a { padding-left: 0; } .genesis-nav-menu > li.last > a { padding-right: 0; } .genesis-nav-menu .highlight { float: right; } /* ## Primary Navigation --------------------------------------------- */ .nav-primary { float: right; text-align: right; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .nav-primary:hover .genesis-nav-menu a { color: #e1e9ee; } .nav-primary:hover .genesis-nav-menu a:hover { color: #fff; } /* ## Secondary Navigation --------------------------------------------- */ .nav-secondary { background-color: #e1e9ee; display: block; max-width: 1280px; position: absolute; top: 0; width: 100%; z-index: 498; } .nav-secondary .wrap { background-color: rgba(255, 255, 255, 0.3); } .nav-secondary + .content-sidebar-wrap { margin-top: 100px; } .nav-secondary.shrink + .content-sidebar-wrap { margin-top: 70px; } .nav-secondary .genesis-nav-menu a { color: #000; padding: 42px 30px; } .nav-secondary .genesis-nav-menu .sub-menu a { color: #e1e9ee; padding: 20px 40px; } .nav-secondary .genesis-nav-menu a:hover, .nav-secondary .genesis-nav-menu .current-menu-item > a, .nav-secondary .genesis-nav-menu .sub-menu .current-menu-item > a:hover { background-color: #181c1e; color: #fff; } .nav-secondary .genesis-nav-menu .highlight > a { background-color: #0085da; color: #fff; } .nav-secondary .genesis-nav-menu li.highlight > a:hover { background-color: #f5f5f5; color: #000; } .nav-secondary.fixed { position: fixed; top: 70px; } .admin-bar .nav-secondary.fixed { top: 102px; } /* Responsive Menu --------------------------------------------- */ .responsive-menu-icon { cursor: pointer; display: none; margin: 15px auto 10px; text-align: center; } .responsive-menu-icon::before { content: "\f333"; font: normal 20px/1 "dashicons"; margin: 0 auto; } /* # Content Area ---------------------------------------------------------------------------------------------------- */ /* ## Home --------------------------------------------- */ .featured-widget-area { margin-top: 120px; } .featured-widget-area .wrap { background-color: #fff; } .front-page-1, .front-page-3, .front-page-5 { background-color: #f9f9f9; } /* ## Flexible Widgets --------------------------------------------- */ .flexible-widgets { overflow: hidden; padding: 80px 80px 40px; } .widget-area.flexible-widgets .widget { float: left; margin-bottom: 40px; margin-left: 2.564102564102564%; } .flexible-widgets.widget-full { padding: 0; } .flexible-widgets.widget-full .widget { margin-bottom: 0; padding: 80px; } .flexible-widgets.widget-full .widget, .flexible-widgets.widget-halves.uneven .widget:last-of-type { margin-left: 0; width: 100%; } .flexible-widgets.widget-halves .widget { width: 48.717948717948715%; } .flexible-widgets.widget-thirds .widget { width: 31.623931623931625%; } .flexible-widgets.widget-fourths .widget { width: 23.076923076923077%; } .flexible-widgets.widget-fourths .widget:nth-child(4n+1), .flexible-widgets.widget-halves .widget:nth-child(2n+1), .flexible-widgets.widget-thirds .widget:nth-child(3n+1) { clear: left; margin-left: 0; } .widget-full .featured-content .widget-title { background-color: #181c1e; color: #fff; margin: 0; padding: 40px; } .front-page .flexible-widgets.widget-full .widget.featured-content { padding: 0; position: relative; } .widget-full .featured-content .entry { margin: 0; } .widget-full .featured-content .entry-header { padding: 80px 80px 0; } .widget-full .featured-content .entry-content { padding: 0 80px; } .widget-full .featured-content .alignleft, .widget-full .featured-content .alignright { margin: 0 80px 0 0; max-width: 50%; } .widget-full .featured-content .alignright { margin: 0 0 0 80px; } .widget-full .featured-content .entry-title { font-size: 48px; text-transform: uppercase; } .widget-full .featured-content .entry-content p:last-of-type { margin-bottom: 80px; } .content .widget-full .featuredpost { background-color: #e1e9ee; padding: 0; } .widget-full .featuredpost .entry:nth-of-type(even) { background-color: rgba(255, 255, 255, 0.3); } .widget-full .featuredpost ul { padding: 40px; } .widget-full .featuredpost .more-from-category { padding: 0 40px 40px; } /* ## Entries --------------------------------------------- */ .entry { padding: 80px; position: relative; } .entry:after { content: ''; border-bottom: 1px solid #000; bottom: 0; position: absolute; width: 40px; } .content .entry:last-of-type:after { display: none; } .entry-content ol, .entry-content ul { margin-bottom: 28px; margin-left: 40px; } .entry-content ol > li { list-style-type: decimal; } .entry-content ul > li { list-style-type: disc; } .entry-content ol ol, .entry-content ul ul { margin-bottom: 0; } .entry-content code { background-color: #000; color: #f9f9f9; } /* ## Entry Meta --------------------------------------------- */ p.entry-meta { font-size: 16px; margin-bottom: 0; } .entry-header .entry-meta { margin-bottom: 24px; } .entry-categories, .entry-tags, .entry-terms { display: block; } .entry-comments-link::before { content: "\2014"; margin: 0 6px 0 2px; } /* ## After Entry --------------------------------------------- */ .after-entry { padding: 0 80px 80px; } /* ## Pagination --------------------------------------------- */ .pagination { clear: both; } .adjacent-entry-pagination { margin-bottom: 0; } .archive-pagination { background-color: #f5f5f5; padding: 20px 30px; } .archive-pagination li { display: inline; } .archive-pagination li a { color: #000; cursor: pointer; display: inline-block; font-size: 16px; padding: 8px 12px; } .archive-pagination li a:hover, .archive-pagination .active a { color: #0085da; } /* ## Comments --------------------------------------------- */ .comment-respond, .entry-pings { padding: 0 80px 56px; } .entry-comments { padding: 0 80px 80px; } .comment-header { font-size: 16px; } .comment-content { clear: both; word-wrap: break-word; } .comment-list li { margin-top: 24px; padding: 40px 0 0; } .comment-list li li { padding-left: 40px; } .comment-respond input[type="email"], .comment-respond input[type="text"], .comment-respond input[type="url"] { width: 50%; } .comment-respond label { display: block; margin-right: 12px; } .entry-comments .comment-author { margin-bottom: 0; } .entry-pings .reply { display: none; } .form-allowed-tags { background-color: #f5f5f5; font-size: 16px; padding: 24px; } /* # Sidebars ---------------------------------------------------------------------------------------------------- */ .sidebar { font-size: 16px; } .sidebar li { border-bottom: 1px solid #fff; margin-bottom: 10px; padding-bottom: 10px; } .sidebar p:last-child, .sidebar ul > li:last-child { margin-bottom: 0; } .sidebar .widget { background-color: #e1e9ee; padding: 40px; margin-bottom: 1px; } /* # Footer Widgets ---------------------------------------------------------------------------------------------------- */ .footer-widgets .wrap { background-color: #181c1e; clear: both; padding: 80px; } .footer-widgets { color: #ccc; } .footer-widgets .widget-title, .footer-widgets .wrap a { color: #fff; } .footer-widgets input { border: 1px solid #fff; } .footer-widgets a:hover { color: #0085da; } .footer-widgets-1, .footer-widgets-2, .footer-widgets-3 { width: 320px; } .footer-widgets-1 { margin-right: 80px; } .footer-widgets-1, .footer-widgets-2 { float: left; } .footer-widgets-3 { float: right; } /* # Site Footer ---------------------------------------------------------------------------------------------------- */ .site-footer { color: #ccc; font-size: 16px; line-height: 1; } .site-footer .wrap { background-color: #181c1e; padding: 80px; } .site-footer .wrap a { color: #fff; } .site-footer a:hover { color: #0085da; } .site-footer p { margin-bottom: 0; } /* # Media Queries ---------------------------------------------------------------------------------------------------- */ @media only screen and (max-width: 1320px) { .nav-secondary, .site-inner, .wrap { max-width: 1140px; } .content { width: 840px; } .footer-widgets-1, .footer-widgets-2, .footer-widgets-3, .sidebar-primary { width: 300px; } .footer-widgets-1 { margin-right: 40px; } } @media only screen and (max-width: 1200px) { .nav-secondary, .site-inner, .wrap { max-width: 960px; } .content { width: 660px; } .archive.genesis-author-pro .content, .archive.genesis-pro-portfolio .content { padding: 60px 60px 20px; } .flexible-widgets, .widget-full .featured-content .entry-header { padding: 60px 60px 0; } .archive-description, .author-box, .entry, .flexible-widgets.widget-full .widget, .footer-widgets .wrap, .site-footer .wrap { padding: 60px; } .comment-respond, .entry-pings { padding: 0 60px 32px; } .after-entry, .entry-comments { padding: 0 60px 60px; } .widget-full .featured-content .entry-content { padding: 0 60px; } .author-box, .widget-full .featured-content .entry-content p:last-of-type { margin-bottom: 60px; } .archive.genesis-author-pro .archive-description, .archive.genesis-author-pro .breadcrumb, .archive.genesis-pro-portfolio .archive-description, .archive.genesis-pro-portfolio .breadcrumb { margin: -60px -60px 60px; } .archive.genesis-author-pro .archive-pagination, .archive.genesis-pro-portfolio .archive-pagination { margin: 0 -60px; } .footer-widgets-1, .footer-widgets-2, .footer-widgets-3 { width: 260px; } .footer-widgets-1 { margin-right: 30px; } } @media only screen and (max-width: 980px) { .nav-secondary, .site-inner, .wrap { max-width: 800px; } .content, .nav-primary, .sidebar-primary, .site-header .title-area { width: 100%; } .nav-secondary + .content-sidebar-wrap, .site-inner, .featured-widget-area, .nav-secondary.shrink + .content-sidebar-wrap { margin-top: 0; } .site-header { background: none; min-height: 0; } .site-header > .wrap { background-color: #181c1e; } .title-area { padding: 17px 0; } .header-image .title-area { padding: 0; } .header-image .site-title > a { background-position: center !important; } .genesis-nav-menu li, .site-header ul.genesis-nav-menu, .site-header .search-form { float: none; } .genesis-nav-menu, .site-description, .site-header .title-area, .site-header .search-form, .site-title { text-align: center; } .wrap .genesis-nav-menu li a { padding-bottom: 27px; padding-top: 27px; } .admin-bar .nav-secondary.fixed { top: 0; } .front-page-featured, .nav-secondary, .nav-secondary.fixed, .site-header, .widget-full .featured-content .alignleft, .widget-full .featured-content .alignright { position: relative; } .archive-description, .author-box, .entry, .flexible-widgets.widget-full .widget, .footer-widgets .wrap, .site-footer .wrap { padding: 40px; } .archive.genesis-author-pro .content, .archive.genesis-pro-portfolio .content, .flexible-widgets, .widget-full .featured-content .entry-header { padding: 40px 40px 0; } .after-entry, .entry-comments, .widget-full .featured-content .entry-content { padding: 0 40px 40px; } .comment-respond, .entry-pings { padding: 0 40px 12px; } .author-box { margin-bottom: 40px; } .widget-full .featured-content .alignleft, .widget-full .featured-content .alignright { background-color: #fff; display: block; float: none; margin: 0 auto; max-width: 100%; text-align: center; width: 100%; } .widget-full .featuredbook .author-pro-featured-image, .widget-full .featured-content .entry-content p:last-of-type { margin-bottom: 0; } .archive.genesis-author-pro .archive-description, .archive.genesis-author-pro .breadcrumb, .archive.genesis-pro-portfolio .archive-description, .archive.genesis-pro-portfolio .breadcrumb { margin: -40px -40px 40px; } .archive.genesis-author-pro .archive-pagination, .archive.genesis-pro-portfolio .archive-pagination { margin: 0 -40px; } .footer-widgets-1, .footer-widgets-2, .footer-widgets-3 { width: 220px; } } @media only screen and (max-width: 800px) { body { font-size: 16px; } .wrap { padding-left: 5%; padding-right: 5%; } .featured-widget-area .wrap { padding: 0; } .archive-pagination li a { margin-bottom: 4px; } .archive.genesis-author-pro .content .archive.genesis-pro-portfolio .content, .entry, .five-sixths, .flexible-widgets.widget-fourths .widget, .flexible-widgets.widget-halves .widget, .flexible-widgets.widget-thirds .widget, .four-sixths, .one-fourth, .one-half, .one-sixth, .one-third, .three-fourths, .three-sixths, .two-fourths, .two-sixths, .two-thirds { margin-left: 0; width: 100%; } .nav-primary .wrap { padding: 0; } .genesis-nav-menu.responsive-menu { display: none; float: none; padding-bottom: 20px; } .genesis-nav-menu.responsive-menu .menu-item, .responsive-menu-icon { display: block; } .genesis-nav-menu.responsive-menu .menu-item:hover { position: static; } .menu.genesis-nav-menu.responsive-menu li.current-menu-item > a, .menu.genesis-nav-menu.responsive-menu li a, .menu.genesis-nav-menu.responsive-menu li a:hover, .menu.genesis-nav-menu.responsive-menu .sub-menu li.current-menu-item > a:hover, .nav-secondary .menu.genesis-nav-menu.responsive-menu .sub-menu a { background: none; display: block; padding: 10px 0; text-transform: none; } .nav-secondary .genesis-nav-menu.responsive-menu li a, .nav-secondary .genesis-nav-menu.responsive-menu li a:hover, .nav-secondary .genesis-nav-menu.responsive-menu .sub-menu a { color: #000; } .genesis-nav-menu.responsive-menu .menu-item-has-children { cursor: pointer; } .genesis-nav-menu.responsive-menu .menu-item-has-children > a { margin-right: 60px; } .genesis-nav-menu.responsive-menu > .menu-item-has-children:before { content: "\f347"; float: right; font: normal 20px/1 "dashicons"; height: 20px; padding: 7px 20px; right: 0; text-align: right; z-index: 499; } .genesis-nav-menu.responsive-menu .menu-open.menu-item-has-children:before { content: "\f343"; } .genesis-nav-menu.responsive-menu > .menu-item > .sub-menu { display: none; } .genesis-nav-menu.responsive-menu .sub-menu { background: none; left: auto; opacity: 1; position: relative; width: 100%; } .genesis-nav-menu.responsive-menu .sub-menu .sub-menu { margin: 0 auto; padding: 0 0 0 20px; } .genesis-nav-menu .highlight { float: none; } .nav-secondary .genesis-nav-menu li.highlight > a, .nav-secondary .genesis-nav-menu li.highlight > a:hover { background: none; color: #000; } .flexible-widgets { padding: 40px; } .widget-full .featured-content .entry-title { font-size: 36px; } .footer-widgets .wrap { padding: 40px 40px 0; } .footer-widgets .widget:last-child { margin-bottom: 40px; } .footer-widgets-1, .footer-widgets-2, .footer-widgets-3 { width: 100%; } }
October 10, 2018 at 2:34 pm #223650diParticipantI’m getting a coding error in my customized css, based off Infinity Pro. The error flag shows up for this coding. Any ideas?
>>>>
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}template,[hidden]{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold}button,input{overflow:visible}button,select{text-transform:none}button,html [type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:0.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
August 14, 2018 at 9:54 am #222476In reply to: making use of Gutenberg specific features
Victor FontModeratorThere's no reason to make any changes to the Genesis Framework or the child theme you are using. Gutenberg works out of the box with Genesis as is.
The CSS Gutenberg uses on the backend is only for the backend. Once displayed on the front end, the theme CSS displays.
The only issue I've encountered with images is with SVGs. You have to apply an explicit dimension to view them in the Gutenberg editor. SVGs will only work as featured images if you are not sharing the post or page to social media. For social media shares, you still have to use bitmap images as the featured image.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?July 30, 2018 at 7:41 am #222109In reply to: Why are banner Images looking blurry?
Victor FontModeratorIt would help if you posted a link to your site so we can see the problem.
There are many factors that impact image quality on a WordPress site. Depending on how your site is setup, WordPress creates many various sized copies of any image you upload. The default for jpg images is to create them at 80% quality. PNGs also have issues with different browsers. A bitmap image that is enlarged will always be blurry.
The best way to assure crisp, clear images across all sizes is to use SVG vector graphics.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?May 26, 2018 at 6:14 am #220239In reply to: Logo Sizing
Victor FontModeratorTo ensure clear images, use vector images (.svg). WordPress does not support .svg images natively, but there are quite a few plugins that provide .svg support.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?April 3, 2018 at 9:52 am #218594scaughtMember/* Theme Name: Outreach Pro Theme URI: http://my.studiopress.com/themes/outreach/ Description: A mobile responsive and HTML5 theme built for the Genesis Framework. Author: StudioPress Author URI: http://www.studiopress.com/ Version: 3.1 Tags: black, green, white, one-column, two-columns, three-columns, left-sidebar, right-sidebar, responsive-layout, custom-menu, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, premise-landing-page Template: genesis Template Version: 2.1 License: GPL-2.0+ License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* Table of Contents - HTML5 Reset - Baseline Normalize - Box Sizing - Float Clearing - Defaults - Typographical Elements - Headings - Objects - Gallery - Forms - Tables - Structure and Layout - Site Containers - Column Widths and Positions - Column Classes - Common Classes - Avatar - Genesis - Search Form - Titles - WordPress - Widgets - Featured Content - Plugins - Genesis eNews Extended - Genesis Responsive Slider - Gravity Forms - Jetpack - Site Header - Title Area - Widget Area - Site Navigation - Header Navigation - Primary Navigation - Secondary Navigation - Responsive Menu - Content Area - Home Page - Entries - Entry Meta - After Entry - Pagination - Comments - Sidebars - Sub Foooter - Footer Widgets - Site Footer - Theme Colors - Outreach Pro Blue - Outreach Pro Orange - Outreach Pro Purple - Outreach Pro Red - Media Queries - Retina Display - Retina - Max-width: 1139px - Max-width: 1023px - Max-width: 767px */ /* HTML5 Reset ---------------------------------------------------------------------------------------------------- */ /* Baseline Normalize normalize.css v2.1.3 | MIT License | git.io/normalize --------------------------------------------- */ article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a{background:transparent}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}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}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0} /* Box Sizing --------------------------------------------- */ *, input[type="search"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Float Clearing --------------------------------------------- */ .author-box:before, .clearfix:before, .entry-content:before, .entry:before, .footer-widgets:before, .home-top .widget:before, .nav-primary:before, .nav-secondary:before, .pagination:before, .site-container:before, .site-footer:before, .site-header:before, .site-inner:before, .wrap:before { content: " "; display: table; } .author-box:after, .clearfix:after, .entry-content:after, .entry:after, .footer-widgets:after, .home-top .widget:after, .nav-primary:after, .nav-secondary:after, .pagination:after, .site-container:after, .site-footer:after, .site-header:after, .site-inner:after, .wrap:after { clear: both; content: " "; display: table; } /* Defaults ---------------------------------------------------------------------------------------------------- */ /* Typographical Elements --------------------------------------------- */ body { background-color: #222; color: #333; font-family: 'Lato', sans-serif; font-size: 16px; font-weight: 400; line-height: 1.625; } a, button, input:focus, input[type="button"], input[type="reset"], input[type="submit"], textarea:focus, .button { -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; } ::-moz-selection { background-color: #333; color: #fff; } ::selection { background-color: #333; color: #fff; } a { color: #6ab446; text-decoration: none; } a:hover { color: #589b37; } p { margin: 0 0 24px; padding: 0; } strong { font-weight: 700; } ol, ul { margin: 0; padding: 0; } li { list-style-type: none; } blockquote, blockquote::before { color: #999; } blockquote { margin: 40px; } blockquote::before { content: "\201C"; display: block; font-size: 30px; height: 0; left: -20px; position: relative; top: -10px; } cite { font-style: normal; } /* Headings --------------------------------------------- */ h1, h2, h3, h4, h5, h6 { font-weight: 400; line-height: 1.2; margin: 0 0 10px; } h1 { font-size: 36px; } h2 { font-size: 28px; } h3 { font-size: 24px; } h4 { font-size: 20px; } h5 { font-size: 18px; } h6 { font-size: 16px; } /* Objects --------------------------------------------- */ embed, iframe, img, object, video, .wp-caption { max-width: 100%; } img { height: auto; } .featured-content img, .gallery img { width: auto; } /* Gallery --------------------------------------------- */ .gallery { overflow: hidden; margin-bottom: 28px; } .gallery-item { float: left; margin: 0; padding: 0 4px; text-align: center; width: 100%; } .gallery-columns-2 .gallery-item { width: 50%; } .gallery-columns-3 .gallery-item { width: 33%; } .gallery-columns-4 .gallery-item { width: 25%; } .gallery-columns-5 .gallery-item { width: 20%; } .gallery-columns-6 .gallery-item { width: 16.6666%; } .gallery-columns-7 .gallery-item { width: 14.2857%; } .gallery-columns-8 .gallery-item { width: 12.5%; } .gallery-columns-9 .gallery-item { width: 11.1111%; } .gallery-columns-2 .gallery-item:nth-child(2n+1), .gallery-columns-3 .gallery-item:nth-child(3n+1), .gallery-columns-4 .gallery-item:nth-child(4n+1), .gallery-columns-5 .gallery-item:nth-child(5n+1), .gallery-columns-6 .gallery-item:nth-child(6n+1), .gallery-columns-7 .gallery-item:nth-child(7n+1), .gallery-columns-8 .gallery-item:nth-child(8n+1), .gallery-columns-9 .gallery-item:nth-child(9n+1) { clear: left; } .gallery .gallery-item img { border: none; height: auto; margin: 0; } /* Forms --------------------------------------------- */ input, select, textarea { background-color: #fff; border: 1px solid #ddd; color: #999; font-size: 14px; font-weight: 400; padding: 16px; width: 100%; } input:focus, textarea:focus { border: 1px solid #999; outline: none; } input[type="checkbox"], input[type="image"], input[type="radio"] { width: auto; } ::-moz-placeholder { color: #666; opacity: 1; font-weight: 400; } ::-webkit-input-placeholder { color: #666; font-weight: 400; } button, input[type="button"], input[type="reset"], input[type="submit"], .button { background-color: #6ab446; border: none; border-radius: 3px; color: #fff; cursor: pointer; font-size: 16px; font-weight: 400; padding: 16px 24px; text-transform: uppercase; width: auto; } button:hover, input:hover[type="button"], input:hover[type="reset"], input:hover[type="submit"], .button:hover { background-color: #5b9b3c; color: #fff; } .button { display: inline-block; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button { display: none; } /* Tables --------------------------------------------- */ table { border-collapse: collapse; border-spacing: 0; line-height: 2; margin-bottom: 40px; } /* width: 100%; */ tbody { border-bottom: 1px solid #ddd; } td, th { text-align: left; } td { border-top: 1px solid #ddd; padding: 6px 0; } th { font-weight: 700; text-transform: uppercase; } /* Structure and Layout ---------------------------------------------------------------------------------------------------- */ /* Site Containers --------------------------------------------- */ .wrap { margin: 0 auto; max-width: 1140px; } .site-inner { clear: both; font-size: 16px; overflow: hidden; padding-top: 30px; } .outreach-pro-home .site-inner { padding: 4px 0; } .outreach-pro-landing .wrap { max-width: 900px; } /* Column Widths and Positions --------------------------------------------- */ /* Wrapping div for .content and .sidebar-primary */ .content-sidebar-sidebar .content-sidebar-wrap, .sidebar-content-sidebar .content-sidebar-wrap, .sidebar-sidebar-content .content-sidebar-wrap { width: 930px; } .content-sidebar-sidebar .content-sidebar-wrap { float: left; } .sidebar-content-sidebar .content-sidebar-wrap, .sidebar-sidebar-content .content-sidebar-wrap { float: right; } /* Content */ .content { background-color: #fff; border-radius: 3px; float: right; margin-bottom: 30px; padding: 40px; width: 760px; } .outreach-pro-home .content { margin: 0; } .content-sidebar .content, .content-sidebar-sidebar .content, .sidebar-content-sidebar .content { float: left; } .content-sidebar-sidebar .content, .sidebar-content-sidebar .content, .sidebar-sidebar-content .content { width: 550px; } .full-width-content .content { width: 100%; } /* Primary Sidebar */ .sidebar-primary { float: right; width: 350px; } .sidebar-content .sidebar-primary, .sidebar-sidebar-content .sidebar-primary { float: left; } /* Secondary Sidebar */ .sidebar-secondary { float: left; width: 180px; } .content-sidebar-sidebar .sidebar-secondary { float: right; } /* Column Classes Link: http://twitter.github.io/bootstrap/assets/css/bootstrap-responsive.css --------------------------------------------- */ .five-sixths, .four-sixths, .one-fourth, .one-half, .one-sixth, .one-third, .three-fourths, .three-sixths, .two-fourths, .two-sixths, .two-thirds { float: left; margin-left: 2.564102564102564%; } .one-half, .three-sixths, .two-fourths { width: 48.717948717948715%; } .one-third, .two-sixths { width: 31.623931623931625%; } .four-sixths, .two-thirds { width: 65.81196581196582%; } .one-fourth { width: 23.076923076923077%; } .three-fourths { width: 74.35897435897436%; } .one-sixth { width: 14.52991452991453%; } .five-sixths { width: 82.90598290598291%; } .first { clear: both; margin-left: 0; } /* Common Classes ---------------------------------------------------------------------------------------------------- */ /* Avatar --------------------------------------------- */ .avatar { float: left; } .alignleft .avatar, .author-box .avatar { margin-right: 24px; } .alignright .avatar { margin-left: 24px; } .comment .avatar { margin: 0 16px 24px 0; } /* Genesis --------------------------------------------- */ .breadcrumb { background-color: #f5f5f5; font-size: 12px; margin-bottom: 30px; padding: 10px 16px; } .archive-description { background-color: #f5f5f5; margin-bottom: 30px; padding: 30px; } .author-box { background-color: #111; color: #fff; margin: 0 -40px 40px; padding: 30px; } .author-box-title { font-size: 16px; font-weight: 700; margin-bottom: 4px; } .archive-description p:last-child, .author-box p:last-child { margin-bottom: 0; } /* Search Form --------------------------------------------- */ .search-form { overflow: hidden; } .site-header .search-form { float: right; margin-top: 12px; } .entry-content .search-form, .site-header .search-form { width: 50%; } .genesis-nav-menu .search input[type="submit"], .widget_search input[type="submit"] { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; padding: 0; position: absolute; width: 1px; } /* Titles --------------------------------------------- */ .archive-title { font-size: 20px; } .entry-title { font-size: 30px; font-weight: 700; } .content .entry-title a { color: #333; } .content .entry-title a:hover { color: #6ab446; } .widget-title { color: #6ab446; font-size: 16px; margin-bottom: 20px; text-transform: uppercase; } .footer-widgets .widget-title, .site-header .widget-title { color: #fff; } /* WordPress --------------------------------------------- */ .alignleft { float: left; text-align: left; } .alignright { float: right; text-align: right; } a.alignleft, a.alignnone, a.alignright { max-width: 100%; } a.alignnone { display: inline-block; } a.aligncenter img { display: block; margin: 0 auto; } img.centered, .aligncenter { display: block; margin: 0 auto 24px; } img.alignnone, .alignnone { display: block; margin-bottom: 16px; } a.alignleft, img.alignleft, .wp-caption.alignleft { margin: 0 24px 24px 0; } a.alignright, img.alignright, .wp-caption.alignright { margin: 0 0 24px 24px; } .gallery-caption { margin: 0 0 10px; } .wp-caption-text { font-weight: 700; text-align: center; } .entry-content p.wp-caption-text { margin-bottom: 0; } /* Widgets ---------------------------------------------------------------------------------------------------- */ .widget { word-wrap: break-word; margin-bottom: 30px; } .widget li { border-bottom: 1px dotted #494949; margin-bottom: 10px; padding-bottom: 10px; text-align: left; } .widget ol > li { list-style-position: inside; list-style-type: decimal; padding-left: 20px; text-indent: -20px; } .widget li li { border: none; margin: 0 0 0 30px; padding: 0; } .widget p:last-child, .widget ol > li:last-child, .widget ul > li:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; } .widget_calendar table { border-color: #494949; width: 100%; } .widget_calendar td, .widget_calendar th { text-align: center; } /* Featured Content --------------------------------------------- */ .featured-content .entry { margin-bottom: 20px; } .featured-content .entry-title { font-size: 20px; } .featured-content .entry-comments-link { float: none; } .more-from-category { border-top: 1px dotted #494949; margin-top: 10px; padding-top: 10px; } /* Plugins ---------------------------------------------------------------------------------------------------- */ /* Genesis eNews Extended --------------------------------------------- */ .sidebar .enews-widget .widget-title { color: #fff; } .enews-widget input { margin-bottom: 16px; } .enews-widget input[type="submit"] { border: none; color: #fff; margin: 0; width: 100%; } .enews-widget input:hover[type="submit"] { background-color: #eee; color: #333; } .enews form + p { margin-top: 24px; } /* Genesis Responsive Slider ------------------------------------------------------------ */ .content #genesis-responsive-slider { -webkit-box-shadow: 0 60px 100px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 60px 100px rgba(0, 0, 0, 0.5); box-shadow: 0 60px 100px rgba(0, 0, 0, 0.5); border: none; padding: 0; } .content #genesis-responsive-slider a:hover, .content #genesis-responsive-slider h2 a, .content #genesis-responsive-slider h2, .content #genesis-responsive-slider p { color: #fff; } .content #genesis-responsive-slider a, .content #genesis-responsive-slider h2 a:hover { color: #6ab446; } #genesis-responsive-slider li { border: none; margin: 0; padding: 0; } .content .slide-excerpt { background-color: rgba(0, 0, 0, 0.7); border: none; filter: alpha(opacity=10); margin: 0; opacity: 1; } html > body .content .slide-excerpt-border { border: none; margin: 0; padding: 30px; } .content #genesis-responsive-slider p { color: #fff; } .widget.genesis_responsive_slider, .content #genesis-responsive-slider .flex-control-nav { margin-bottom: 0; } .content #genesis-responsive-slider .flex-control-nav { margin-top: -40px; } .content .genesis_responsive_slider .flex-direction-nav li a { background: url(images/icon-direction-nav.png) no-repeat -50px 0; background-size: 100px 98px; height: 49px; right: -25px; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; width: 50px; } .content .genesis_responsive_slider .flex-direction-nav li a:hover { background-position: -50px -49px; } .content .genesis_responsive_slider .flex-direction-nav li a.prev { background-position: 0 0; bottom: 10px; left: auto; right: 62px !important; top: auto; } .content #genesis-responsive-slider .flex-direction-nav li a.next { bottom: 10px; left: auto; right: 10px !important; top: auto; } .content .genesis_responsive_slider .flex-direction-nav li a:hover.prev { background-position: 0 -49px; } /* Gravity Forms --------------------------------------------- */ div.gform_wrapper input[type="email"], div.gform_wrapper input[type="text"], div.gform_wrapper textarea, div.gform_wrapper .ginput_complex label { font-size: 16px; padding: 16px; } div.gform_wrapper .ginput_complex label { padding: 0; } div.gform_wrapper li, div.gform_wrapper form li { margin: 16px 0 0; } /* Jetpack --------------------------------------------- */ #wpstats { display: none; } /* Site Header ---------------------------------------------------------------------------------------------------- */ .site-header { background-color: #589b37; color: #fff; min-height: 110px; } .site-header .widget { margin-bottom: 0; } .site-header .wrap { padding: 20px 0; } /* Title Area --------------------------------------------- */ .title-area { float: left; padding: 14px 0; width: 340px; } .header-full-width .title-area { width: 100%; } .site-title { font-size: 43px; font-weight: 700; line-height: 1; text-transform: uppercase; } .site-title a, .site-title a:hover { color: #fff; } .header-image .title-area { padding: 0; } .header-image .site-title > a { float: left; min-height: 100px; width: 100%; } .site-description { color: #999; font-size: 16px; font-weight: 400; height: 0; line-height: 1.5; text-indent: -9999px; } .site-description, .site-title { margin-bottom: 0; } .header-image .site-description, .header-image .site-title { display: block; text-indent: -9999px; } /* Widget Area --------------------------------------------- */ .site-header .widget-area { float: right; padding-top: 14px; text-align: right; width: 740px; } .site-header .widget-area a { color: #fff; } .site-header .widget-area a:hover { color: #000; } .site-header .widget li { border-color: #fff; } .site-header .genesis-nav-menu li li { margin-left: 0; } .site-header .widget-area button:hover, .site-header .widget-area input:hover[type="button"], .site-header .widget-area input:hover[type="reset"], .site-header .widget-area input:hover[type="submit"], .site-header .widget-area .button:hover { background-color: #fff; color: #000; } /* Site Navigation ---------------------------------------------------------------------------------------------------- */ .genesis-nav-menu { clear: both; font-size: 14px; line-height: 1.5; width: 100%; } .genesis-nav-menu, .genesis-nav-menu a { color: #fff; } .genesis-nav-menu .menu-item { display: inline-block; text-align: left; } .genesis-nav-menu a { display: block; padding: 18px 20px; } .genesis-nav-menu .current-menu-item > a, .genesis-nav-menu .sub-menu .current-menu-item > a:hover, .genesis-nav-menu a:hover, .genesis-nav-menu li:hover > a { background-color: #fff; color: #000; } .genesis-nav-menu > .menu-item > a { text-transform: uppercase; } .genesis-nav-menu .sub-menu { border-top: 1px solid #fff; left: -9999px; opacity: 0; position: absolute; -webkit-transition: opacity .4s ease-in-out; -moz-transition: opacity .4s ease-in-out; -ms-transition: opacity .4s ease-in-out; -o-transition: opacity .4s ease-in-out; transition: opacity .4s ease-in-out; width: 200px; z-index: 999; } .genesis-nav-menu .sub-menu a { background-color: #eee; border: 1px solid #fff; border-top: none; color: #333; font-size: 12px; padding: 14px 20px; position: relative; width: 200px; } .genesis-nav-menu .sub-menu .sub-menu { margin: -48px 0 0 199px; } .genesis-nav-menu .menu-item:hover { position: static; } .genesis-nav-menu .menu-item:hover > .sub-menu { left: auto; opacity: 1; } .genesis-nav-menu > .first > a { padding-left: 0; } .genesis-nav-menu > .last > a { padding-right: 0; } .genesis-nav-menu > .right { display: inline-block; float: right; list-style-type: none; padding: 0; text-transform: uppercase; } .genesis-nav-menu > .date, .genesis-nav-menu > .right > a { display: inline-block; padding: 18px 20px; } .genesis-nav-menu .right:hover > a { background: none; color: #fff; } .genesis-nav-menu .right > a:hover { background: #fff; color: #000; } .genesis-nav-menu > .search { padding: 9px 0 0; } .genesis-nav-menu input[type="search"] { font-size: 14px; padding: 10px 16px; } /* Site Header Navigation --------------------------------------------- */ .site-header .genesis-nav-menu li, .site-header .genesis-nav-menu li ul { border-bottom: none; margin: 0; padding: 0; } /* Primary Navigation --------------------------------------------- */ .nav-primary { background-color: #6ab446; } /* Secondary Navigation --------------------------------------------- */ .nav-secondary .wrap { background-color: #111; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; margin-bottom: 16px; } .nav-secondary .genesis-nav-menu > li > a:hover, .nav-secondary .genesis-nav-menu > li:hover > a { background: none; } .nav-secondary .genesis-nav-menu .current-menu-item > a, .nav-secondary .genesis-nav-menu .sub-menu a:hover, .nav-secondary .genesis-nav-menu a:hover, .nav-secondary .genesis-nav-menu li:hover > a { color: #6ab446; } .nav-secondary .genesis-nav-menu .sub-menu a { background-color: #090909; border-color: #292929; color: #fff; } .nav-secondary .sub-menu { border-color: #292929; } /* Responsive Menu --------------------------------------------- */ .responsive-menu-icon { cursor: pointer; display: none; margin-bottom: -1px; text-align: center; } .responsive-menu-icon::before { color: #fff; content: "\f333"; display: inline-block; font: normal 20px/1 'dashicons'; margin: 0 auto; padding: 10px; } .site-header .responsive-menu-icon::before { padding: 0; } /* Content Area ---------------------------------------------------------------------------------------------------- */ /* Home Page --------------------------------------------- */ .home-top .widget { margin: 0; } /* padding: 0 40px 40px; */ .home-top .widget:first-child { } /* padding-top: 40px; */ .home-top .widget.genesis_responsive_slider { padding: 0; } .outreach-pro-home .content { padding: 0; } .home-bottom { background-color: #fff; padding-top: 60px; } .home-bottom .widget { float: left; margin-left: 2.564102564102564%; width: 23.076923076923077%; } .home-bottom .widget:nth-child(4n+1) { clear: both; margin-left: 0; } .home-bottom .featured-content img { -webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4); -moz-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4); box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4); } .home-bottom .widget-title { color: #333; font-weight: 700; } /* Entries --------------------------------------------- */ .entry { margin-bottom: 40px; } .entry-content ol, .entry-content p, .entry-content ul { margin-bottom: 26px; } .entry-content ol, .entry-content ul { margin-left: 40px; } .entry-content ol > li { list-style-type: decimal; } .entry-content ul > li { list-style-type: disc; } .entry-content ol ol, .entry-content ul ul { margin-bottom: 0; } .entry-content code { background-color: #333; color: #ddd; } /* Entry Meta --------------------------------------------- */ p.entry-meta { color: #999; font-size: 12px; margin-bottom: 0; text-transform: uppercase; } p.entry-meta a { color: #999; } p.entry-meta a:hover { color: #333; } .entry-footer .entry-meta { border-top: 1px dotted #ddd; padding-top: 12px; } .entry-header .entry-meta { margin-bottom: 24px; } .entry-categories { float: left; } .entry-comments-link, .entry-tags { float: right; } /* After Entry --------------------------------------------- */ .after-entry { background-color: #f5f5f5; margin-bottom: 40px; padding: 30px; text-align: center; } .after-entry p:last-child { margin: 0; } .after-entry li { list-style-type: none; } .after-entry .featured-content li { text-align: center; } /* Pagination --------------------------------------------- */ .pagination { margin: 40px 0 0; } .adjacent-entry-pagination { margin-bottom: 0; } .archive-pagination li { display: inline; } .archive-pagination li a { background-color: #333; color: #fff; cursor: pointer; display: inline-block; margin-bottom: 4px; padding: 8px 12px; } .archive-pagination li a:hover, .archive-pagination .active a { background-color: #6ab446; } /* Comments --------------------------------------------- */ .comment-respond, .entry-comments, .entry-pings { margin-bottom: 30px; } li.comment, li.pingback { background-color: #f5f5f5; border: 2px solid #fff; border-right: none; } .comment-content { clear: both; } .comment-list li, .entry-pings li { margin-top: 24px; padding: 32px; } .comment-list li li { margin-right: -32px; } .comment-respond input[type="email"], .comment-respond input[type="text"], .comment-respond input[type="url"] { width: 50%; } .comment-respond label { display: block; margin-right: 12px; } .entry-comments .comment-author { margin-bottom: 0; } .entry-pings .reply { display: none; } .bypostauthor { } .form-allowed-tags { background-color: #f5f5f5; padding: 24px; } /* Sidebars ---------------------------------------------------------------------------------------------------- */ .sidebar { color: #ccc; font-size: 14px; } .sidebar .widget { background-color: #111; border-radius: 3px; padding: 30px; } .sidebar li a { color: #ccc; } .sidebar li a:hover, .sidebar .entry-meta a:hover { color: #fff; } /* Sub Footer ---------------------------------------------------------------------------------------------------- */ .sub-footer { background-color: #f2f6e9; padding: 60px 0 30px; } .sub-footer-left { float: left; width: 785px; } .sub-footer-right { float: right; font-size: 14px; width: 235px; } .sub-footer-left .entry-title { font-size: 30px; } /* Footer Widgets ---------------------------------------------------------------------------------------------------- */ .footer-widgets { background-color: #222; color: #ccc; clear: both; font-size: 14px; padding: 60px 0 30px; } .footer-widgets input { border: 1px solid #333; } .footer-widgets .entry-meta a:hover, .footer-widgets a:hover { color: #fff; } .footer-widgets-1, .footer-widgets-2, .footer-widgets-3, .footer-widgets-4 { width: 255px; } .footer-widgets-1, .footer-widgets-2 { margin-right: 40px; } .footer-widgets-1, .footer-widgets-2, .footer-widgets-3 { float: left; } .footer-widgets-4 { float: right; } /* Site Footer ---------------------------------------------------------------------------------------------------- */ .site-footer { background-color: #222; border-top: 1px solid rgba(0, 0, 0, 0.2); box-shadow: inset 0 1px rgba(255, 255, 255, 0.07); color: #666; font-size: 14px; padding: 40px 0; text-align: center; } .site-footer a { color: #666; } .site-footer a:hover { color: #fff; } .site-footer p { margin-bottom: 0; } /* Theme Colors ---------------------------------------------------------------------------------------------------- */ /* Outreach Pro Blue --------------------------------------------- */ .outreach-pro-blue .content .entry-title a:hover, .outreach-pro-blue .content #genesis-responsive-slider a, .outreach-pro-blue .content #genesis-responsive-slider h2 a:hover, .outreach-pro-blue .nav-secondary .genesis-nav-menu .current-menu-item > a, .outreach-pro-blue .nav-secondary .genesis-nav-menu .sub-menu a:hover, .outreach-pro-blue .nav-secondary .genesis-nav-menu a:hover, .outreach-pro-blue .nav-secondary .genesis-nav-menu li:hover > a, .outreach-pro-blue .widget-title, .outreach-pro-blue a { color: #2483d0; } .outreach-pro-blue a:hover { color: #1e6dad; } .outreach-pro-blue .content #genesis-responsive-slider a:hover, .outreach-pro-blue .content #genesis-responsive-slider h2 a, .outreach-pro-blue .footer-widgets .widget-title, .outreach-pro-blue .genesis-nav-menu a, .outreach-pro-blue .site-footer a:hover, .outreach-pro-blue .site-header .widget-title, .outreach-pro-blue .site-title a, .outreach-pro-blue .site-title a:hover { color: #fff; } .outreach-pro-blue .site-footer a { color: #666; } .outreach-pro-blue .genesis-nav-menu .sub-menu a, .outreach-pro-blue .home-bottom .widget-title { color: #333; } .outreach-pro-blue .genesis-nav-menu a:hover, .outreach-pro-blue .genesis-nav-menu .current-menu-item > a, .outreach-pro-blue .genesis-nav-menu .sub-menu .current-menu-item > a:hover { color: #000; } .outreach-pro-blue .archive-pagination .active a, .outreach-pro-blue .archive-pagination li a:hover, .outreach-pro-blue .button, .outreach-pro-blue .nav-primary, .outreach-pro-blue button, .outreach-pro-blue input[type="button"], .outreach-pro-blue input[type="reset"], .outreach-pro-blue input[type="submit"] { background-color: #2483d0; color: #fff; } .outreach-pro-blue .button:hover, .outreach-pro-blue .site-header, .outreach-pro-blue button:hover, .outreach-pro-blue input:hover[type="button"], .outreach-pro-blue input:hover[type="reset"], .outreach-pro-blue input:hover[type="submit"] { background-color: #1e6dad; color: #fff; } .outreach-pro-blue .sub-footer { background-color: #edf3f4; } .outreach-pro-blue, .outreach-pro-blue .footer-widgets, .outreach-pro-blue .site-footer { background-color: #222e37; } .outreach-pro-blue .author-box, .outreach-pro-blue .nav-secondary .wrap, .outreach-pro-blue .sidebar .widget { background-color: #17222b; } .outreach-pro-blue .nav-secondary .genesis-nav-menu .sub-menu, .outreach-pro-blue .nav-secondary .genesis-nav-menu .sub-menu a { background-color: #17222b; border-color: #2d3b45; color: #fff; } .outreach-pro-blue .enews-widget input:hover[type="submit"] { background-color: #eee; color: #333; } /* Outreach Pro Orange --------------------------------------------- */ .outreach-pro-orange .content .entry-title a:hover, .outreach-pro-orange .content #genesis-responsive-slider a, .outreach-pro-orange .content #genesis-responsive-slider h2 a:hover, .outreach-pro-orange .nav-secondary .genesis-nav-menu .current-menu-item > a, .outreach-pro-orange .nav-secondary .genesis-nav-menu .sub-menu a:hover, .outreach-pro-orange .nav-secondary .genesis-nav-menu a:hover, .outreach-pro-orange .nav-secondary .genesis-nav-menu li:hover > a, .outreach-pro-orange .widget-title, .outreach-pro-orange a { color: #ff7b00; } .outreach-pro-orange a:hover { color: #cb6e23; } .outreach-pro-orange .content #genesis-responsive-slider a:hover, .outreach-pro-orange .content #genesis-responsive-slider h2 a, .outreach-pro-orange .footer-widgets .widget-title, .outreach-pro-orange .genesis-nav-menu a, .outreach-pro-orange .site-footer a:hover, .outreach-pro-orange .site-header .widget-title, .outreach-pro-orange .site-title a, .outreach-pro-orange .site-title a:hover { color: #fff; } .outreach-pro-orange .site-footer a { color: #666; } .outreach-pro-orange .genesis-nav-menu .sub-menu a, .outreach-pro-orange .home-bottom .widget-title { color: #333; } .outreach-pro-orange .genesis-nav-menu a:hover, .outreach-pro-orange .genesis-nav-menu .current-menu-item > a, .outreach-pro-orange .genesis-nav-menu .sub-menu .current-menu-item > a:hover { color: #000; } .outreach-pro-orange .archive-pagination .active a, .outreach-pro-orange .archive-pagination li a:hover, .outreach-pro-orange .button, .outreach-pro-orange .nav-primary, .outreach-pro-orange button, .outreach-pro-orange input[type="button"], .outreach-pro-orange input[type="reset"], .outreach-pro-orange input[type="submit"] { background-color: #ff7b00; color: #fff; } .outreach-pro-orange .button:hover, .outreach-pro-orange .site-header, .outreach-pro-orange button:hover, .outreach-pro-orange input:hover[type="button"], .outreach-pro-orange input:hover[type="reset"], .outreach-pro-orange input:hover[type="submit"] { background-color: #ef6c00; color: #fff; } .outreach-pro-orange .sub-footer { background-color: #f6f1e9; } .outreach-pro-orange, .outreach-pro-orange .footer-widgets, .outreach-pro-orange .site-footer { background-color: #3c3a36; } .outreach-pro-orange .author-box, .outreach-pro-orange .nav-secondary .wrap, .outreach-pro-orange .sidebar .widget { background-color: #302e29; } .outreach-pro-orange .nav-secondary .genesis-nav-menu .sub-menu, .outreach-pro-orange .nav-secondary .genesis-nav-menu .sub-menu a { background-color: #302e29; border-color: #45433f; color: #fff; } .outreach-pro-orange .enews-widget input:hover[type="submit"] { background-color: #eee; color: #333; } /* Outreach Pro Purple --------------------------------------------- */ .outreach-pro-purple .content .entry-title a:hover, .outreach-pro-purple .content #genesis-responsive-slider a, .outreach-pro-purple .content #genesis-responsive-slider h2 a:hover, .outreach-pro-purple .nav-secondary .genesis-nav-menu .current-menu-item > a, .outreach-pro-purple .nav-secondary .genesis-nav-menu .sub-menu a:hover, .outreach-pro-purple .nav-secondary .genesis-nav-menu a:hover, .outreach-pro-purple .nav-secondary .genesis-nav-menu li:hover > a, .outreach-pro-purple .widget-title, .outreach-pro-purple a { color: #7b53a1; } .outreach-pro-purple a:hover { color: #684687; } .outreach-pro-purple .content #genesis-responsive-slider a:hover, .outreach-pro-purple .content #genesis-responsive-slider h2 a, .outreach-pro-purple .footer-widgets .widget-title, .outreach-pro-purple .genesis-nav-menu a, .outreach-pro-purple .nav-secondary .genesis-nav-menu .sub-menu a, .outreach-pro-purple .nav-secondary .genesis-nav-menu .sub-menu, .outreach-pro-purple .site-footer a:hover, .outreach-pro-purple .site-header .widget-title, .outreach-pro-purple .site-title a, .outreach-pro-purple .site-title a:hover { color: #fff; } .outreach-pro-purple .site-footer a { color: #666; } .outreach-pro-purple .genesis-nav-menu .sub-menu a, .outreach-pro-purple .home-bottom .widget-title { color: #333; } .outreach-pro-purple .genesis-nav-menu a:hover, .outreach-pro-purple .genesis-nav-menu .current-menu-item > a, .outreach-pro-purple .genesis-nav-menu .sub-menu .current-menu-item > a:hover { color: #000; } .outreach-pro-purple .archive-pagination .active a, .outreach-pro-purple .archive-pagination li a:hover, .outreach-pro-purple .button, .outreach-pro-purple .nav-primary, .outreach-pro-purple button, .outreach-pro-purple input[type="button"], .outreach-pro-purple input[type="reset"], .outreach-pro-purple input[type="submit"] { background-color: #7b53a1; color: #fff; } .outreach-pro-purple .button:hover, .outreach-pro-purple .site-header, .outreach-pro-purple button:hover, .outreach-pro-purple input:hover[type="button"], .outreach-pro-purple input:hover[type="reset"], .outreach-pro-purple input:hover[type="submit"] { background-color: #684687; color: #fff; } .outreach-pro-purple .sub-footer { background-color: #ececec; } .outreach-pro-purple .enews-widget input:hover[type="submit"] { background-color: #eee; color: #333; } /* Outreach Pro Red --------------------------------------------- */ .outreach-pro-red .content .entry-title a:hover, .outreach-pro-red .content #genesis-responsive-slider a, .outreach-pro-red .content #genesis-responsive-slider h2 a:hover, .outreach-pro-red .nav-secondary .genesis-nav-menu .current-menu-item > a, .outreach-pro-red .nav-secondary .genesis-nav-menu .sub-menu a:hover, .outreach-pro-red .nav-secondary .genesis-nav-menu a:hover, .outreach-pro-red .nav-secondary .genesis-nav-menu li:hover > a, .outreach-pro-red .widget-title, .outreach-pro-red a { color: #df1431; } .outreach-pro-red a:hover { color: #bc112c; } .outreach-pro-red .content #genesis-responsive-slider a:hover, .outreach-pro-red .content #genesis-responsive-slider h2 a, .outreach-pro-red .footer-widgets .widget-title, .outreach-pro-red .genesis-nav-menu a, .outreach-pro-red .site-footer a:hover, .outreach-pro-red .site-header .widget-title, .outreach-pro-red .site-title a, .outreach-pro-red .site-title a:hover { color: #fff; } .outreach-pro-red .site-footer a { color: #666; } .outreach-pro-red .genesis-nav-menu .sub-menu a, .outreach-pro-red .home-bottom .widget-title { color: #333; } .outreach-pro-red .genesis-nav-menu a:hover, .outreach-pro-red .genesis-nav-menu .current-menu-item > a, .outreach-pro-red .genesis-nav-menu .sub-menu .current-menu-item > a:hover { color: #000; } .outreach-pro-red .archive-pagination .active a, .outreach-pro-red .archive-pagination li a:hover, .outreach-pro-red .button, .outreach-pro-red .nav-primary, .outreach-pro-red button, .outreach-pro-red input[type="button"], .outreach-pro-red input[type="reset"], .outreach-pro-red input[type="submit"] { background-color: #df1431; color: #fff; } .outreach-pro-red .button:hover, .outreach-pro-red .site-header, .outreach-pro-red button:hover, .outreach-pro-red input:hover[type="button"], .outreach-pro-red input:hover[type="reset"], .outreach-pro-red input:hover[type="submit"] { background-color: #bc112c; color: #fff; } .outreach-pro-red .sub-footer { background-color: #f6f1e9; } .outreach-pro-red, .outreach-pro-red .footer-widgets, .outreach-pro-red .site-footer { background-color: #3c3a36; } .outreach-pro-red .author-box, .outreach-pro-red .nav-secondary .wrap, .outreach-pro-red .sidebar .widget { background-color: #302e29; } .outreach-pro-red .nav-secondary .genesis-nav-menu .sub-menu, .outreach-pro-red .nav-secondary .genesis-nav-menu .sub-menu a { background-color: #302e29; border-color: #45433f; color: #fff; } .outreach-pro-red .enews-widget input:hover[type="submit"] { background-color: #eee; color: #333; } /* Media Queries ---------------------------------------------------------------------------------------------------- */ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5) { .content #genesis-responsive-slider .flex-direction-nav li a { background-image: url(images/[email protected]); } } @media only screen and (max-width: 1180px) { .wrap { max-width: 960px; } .content-sidebar-sidebar .content-sidebar-wrap, .sidebar-content-sidebar .content-sidebar-wrap, .sidebar-sidebar-content .content-sidebar-wrap { width: 750px; } .sub-footer-left { width: 710px; } .content { width: 630px; } .site-header .widget-area { width: 600px; } .sidebar-content-sidebar .content, .sidebar-sidebar-content .content, .content-sidebar-sidebar .content { width: 420px; } .sidebar-primary { width: 300px; } .footer-widgets-1, .footer-widgets-2, .footer-widgets-3, .footer-widgets-4, .sub-footer-right { width: 210px; } .outreach-pro-home .site-inner .wrap { max-width: none; } } @media only screen and (max-width: 1023px) { .wrap { max-width: 768px; } .content, .content-sidebar-sidebar .content, .content-sidebar-sidebar .content-sidebar-wrap, .footer-widgets-1, .footer-widgets-2, .footer-widgets-3, .footer-widgets-4, .sidebar-content-sidebar .content, .sidebar-content-sidebar .content-sidebar-wrap, .sidebar-primary, .sidebar-secondary, .sidebar-sidebar-content .content, .sidebar-sidebar-content .content-sidebar-wrap, .site-header .widget-area, .title-area { width: 100%; } .site-header .wrap { padding: 20px 5% 16px; } .header-image .site-title a { background-position: top !important; } .site-header .widget-area { padding: 0; } .genesis-nav-menu li, .site-header .search-form, .site-header ul.genesis-nav-menu { float: none; } .genesis-nav-menu, .nav-primary, .site-description, .site-header .search-form, .site-header .title-area, .site-header .widget-area, .site-title { text-align: center; } .site-header .simple-social-icons .alignleft, .site-header .simple-social-icons .alignright, .site-header .simple-social-icons ul li { display: inline-block; float: none; text-align: center; } .genesis-nav-menu a, .genesis-nav-menu > .first > a, .genesis-nav-menu > .last > a { padding: 18px 12px; } .site-header .search-form { margin: 16px auto; } .genesis-nav-menu li.right { display: none; } .sub-footer-left { width: 520px; } .footer-widgets-1, .footer-widgets-2 { margin-right: 0; } } @media only screen and (max-width: 860px) { .wrap { padding-left: 5%; padding-right: 5%; } .outreach-pro-home .site-inner .wrap { padding: 0; } .archive-description, .author-box, .comment-respond, .entry, .entry-comments, .entry-pings, .sidebar .widget { box-shadow: none; } .archive-pagination li a { margin-bottom: 4px; } .five-sixths, .four-sixths, .one-fourth, .one-half, .one-sixth, .one-third, .sub-footer-left, .sub-footer-right, .three-fourths, .three-sixths, .two-fourths, .two-sixths, .two-thirds { margin: 0; width: 100%; } .content #genesis-responsive-slider .flex-direction-nav li .next, .content #genesis-responsive-slider .flex-direction-nav li .prev, .content .slide-excerpt { display: none; } .home-bottom .widget { text-align: center; width: 48%; } .home-bottom .widget:nth-of-type(2n) { clear: none; margin-left: 2.564102564102564%; } .home-bottom .widget:nth-of-type(2n+1) { clear: both; margin-left: 0; } } @media only screen and (max-width: 600px) { .genesis-nav-menu.responsive-menu, .genesis-nav-menu.responsive-menu > .menu-item > .sub-menu { display: none; } .genesis-nav-menu.responsive-menu .menu-item, .responsive-menu-icon { display: block; } .genesis-nav-menu.responsive-menu .menu-item { margin: 0; } .genesis-nav-menu.responsive-menu .menu-item:hover { position: static; } .genesis-nav-menu.responsive-menu .current-menu-item > a, .genesis-nav-menu.responsive-menu .sub-menu .current-menu-item > a:hover, .genesis-nav-menu.responsive-menu > .first > a, .genesis-nav-menu.responsive-menu > .last > a, .genesis-nav-menu.responsive-menu a, .genesis-nav-menu.responsive-menu a:hover, .genesis-nav-menu.responsive-menu li:hover > a { background: none; color: #fff; line-height: 1; padding: 18px 20px; } .genesis-nav-menu.responsive-menu .menu-item-has-children { cursor: pointer; } .genesis-nav-menu.responsive-menu .menu-item-has-children > a { margin-right: 60px; } .genesis-nav-menu.responsive-menu > .menu-item-has-children:before { content: "\f347"; float: right; font: normal 16px/1 'dashicons'; height: 16px; padding: 16px 20px; right: 0; text-align: right; z-index: 9999; } .genesis-nav-menu.responsive-menu .menu-open.menu-item-has-children:before { content: "\f343"; } .nav-primary .genesis-nav-menu.responsive-menu > .menu-item-has-children:before { color: #fff; } .genesis-nav-menu.responsive-menu .sub-menu { background-color: rgba(0, 0, 0, 0.05); border: none; left: auto; opacity: 1; position: relative; -moz-transition: opacity .4s ease-in-out; -ms-transition: opacity .4s ease-in-out; -o-transition: opacity .4s ease-in-out; -webkit-transition: opacity .4s ease-in-out; transition: opacity .4s ease-in-out; width: 100%; z-index: 99; } .genesis-nav-menu.responsive-menu .sub-menu .sub-menu { background-color: transparent; margin: 0; padding-left: 25px; } .genesis-nav-menu.responsive-menu .sub-menu li a, .genesis-nav-menu.responsive-menu .sub-menu li a:hover { background: none; border: none; color: #fff; padding: 14px 20px; position: relative; width: 100%; } .entry-categories, .entry-comments-link, .entry-tags { display: block; float: none; } } @media only screen and (max-width: 480px) { .content { padding: 30px; } .content #genesis-responsive-slider .flex-control-nav { display: none; } .home-bottom .widget:nth-of-type(2n), .home-bottom .widget { margin: 0; width: 100%; } .header-image .site-title a { background-size: contain !important; } }
March 15, 2018 at 7:10 am #217921In reply to: Paragraph fonts delay appearing on page loads
Victor FontModeratorHow did you install the custom font? I know you said in a theme folder, but how are you loading them? Local fonts, which the custom font is because you have it in the theme folder, are loaded in style.css using the @font directive. Is that what you're doing?
Is the custom font designed for the web, meaning do you have versions for the various browsers, i.e. eot, woff woff2, ttf, svg?
Arial is a system font. System fonts are installed on eveyone's computers. Your not seeing a delay because you're not loading anything from the web.
Whenever you have a problem with your site, it helps tremendously to provide a link to the site. It's helps us to help you if we can observe the behavior and examine what we can of the source code from the front end.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?February 23, 2018 at 6:02 pm #216938In reply to: Font Awesome 5: search icon no longer shows?
hobbsyMemberThanks again for your time Victor.
So I would need to load Font Awesome 'SVG with JS' and 'webfonts' to make this work. Seems like a lot of extra MB for just one search/magnifying glass icon.
Are there any other solutions or code I can plug into the functions.php file to make it work with the 'SVG with JS'
I might have to compromise and just use a greater than > (>) or double arrows >> (» or ») on the button
February 22, 2018 at 1:57 pm #216906In reply to: Logo bigger in Kickstart Pro
skfieldsMemberI made my logo 232 x 120. That is the size that I would like. I have worked in logos for 20 years, so I understand size and SVG, but that isn't my problem here.
I think my site is caching my old logo which was smaller, because it is pixelating. I'm not sure - maybe it looks better on your computer and is just caching on mine, but it should be clear and nice at 232 x 120. On my phone it looks correct, but on my website it looks terrible.
But - what I was really wanting to know - was when I look at it on my phone, the menu goes over the logo, and I wondered what I need to do to move the menu down, so I can see the logo on the phone.
Thanks!
February 21, 2018 at 7:12 pm #216890In reply to: Logo bigger in Kickstart Pro
Victor FontModeratorYour logo is already set to 232 x 120. Because you are using a png image, you can't enlarge beyond that size because it will pixelate. Either use a bigger logo or use an SVG, which you can enlarge to any dimension without pixelation because it's a vector image, not a bitmap.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?February 20, 2018 at 5:21 am #216808In reply to: New StudioPress Website
Victor FontModeratorThat video is really cool! I learned something new from it. I use Affinity Designer for creating SVGs on the Mac, but it doesn't allow for the creation of animations. Here is an open source SVG animation tool that looks promising: http://macsvg.org/
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?February 20, 2018 at 12:39 am #216800Topic: New StudioPress Website
in forum General DiscussionRavenManiacParticipantOkay, so I'm really digging the new StudioPress website. Nice job Rafal. One thing that I really like is the animated svgs he's using. What's the best Mac app for creating animated svgs?
Here's a video that shows how an svg animation can be created and coded.
February 14, 2018 at 10:30 pm #216549In reply to: Font Awesome 5: search icon no longer shows?
Victor FontModeratorYou need to use the Fontawesome 5 webfonts if you want to use hex codes.
The reason why is because the SVG with JS is generated by the JS, which works in the clients browser. You are trying to make it work in PHP which is server side. You have to install the webfonts and CSS to make it work client-side.
Likewise, you can't use the 5.0.6 SVGs in CSS pseudo elements like :before or :after. You can oly use the websfonts for this.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet? -
AuthorSearch Results