Community Forums › Forums › Search › Search Results for 'adjust page width'
-
AuthorSearch Results
-
October 21, 2018 at 5:05 am #223894
In 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%; } }
August 2, 2018 at 11:18 am #222175Topic: Magazine Pro Home Widget Adjustment
in forum Design Tips and TricksirishfanMemberHey everyone,
Was wondering if anyone knew how to make the Home Top widget stretch the width of the page just below the header but above the content including side bar?
Currently when i set it up the side bar widget is flush with the Home Top widget but I would like it to be flush with the Home Middle widget like you see on this website:
Notice how the sidebar is moved down to be flush with the Home Middle section.
Thanks in advance!
July 25, 2018 at 1:02 pm #221992DougParticipantThis is on my home page.
This looks fine when a browser on a wide screen is expanded wide horizontally, but for smaller screens or when the browser width collapses, this module breaks apart in odd ways.
I've used Inspect Element, and thought I'd found and adjusted the right parameters, but this still isn't breaking well.
I've been through the beginner's manual and haven't found anything clear.
If anyone has any info on where to start to begin sorting this out, I'd appreciate it.
thanks
May 16, 2018 at 6:41 am #219956PunkUKMemberI have made the images in my text widgets full width and height by reducing the padding. The only problem is the text is side to side, looking squashed See Here I have tried to adjust the padding for the text only but I am only managing to change it on the first widget, not the other two.
I hope someone can help.
Many thanks.
Steven.
April 29, 2018 at 3:21 am #219385Topic: Widgitize lnading page with a hook
in forum General DiscussionAndrasParticipantHi,
I am working on a Maker Pro theme. I just love the Front Page 2 full width widget area, and I would like to have it in two other pages with different content for each.
I registered the new widget areas and applied the hook. The new widget just does not look like the original. Featured pictures show in a column instead of in a row as in the original. What needs to be adjusted?
I will add the condition "if ( is_page('1') ) {" later on, that is not the issue. I am trying to get the format of the new widget right.
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 6, 2018 at 11:24 pm #217406tanhwMemberHi all
I'm trying to customize the Genesis Sample theme.
Please see the attached screenshots.
The default for the theme is as follows:
- "content" container is 880px.
- "sidebar-primary" container is 360px.I wanted to fit both the content and sidebar containers into a "site-inner" of 1020px, but with:
- "content" container reduced to 680px.
- "sidebar-primary" container widened to 300px.
- There's some padding I believe of 40px between the two so I thought 680 + 40 + 300 = 1020 px and it's ok.I applied the following "Additional CSS" to the theme's customization.
My laptop version looks fine (Screenshot1.jpg).
However, on my iPhone 7, I cannot (for the life of me) understand why the sidebar is skewed and aligned to the right. How do I center that sidebar and keep it at 300px in the phone? See Screenshot2.jpg.Thanks - any help is greatly appreciated as I've struggle with this for days on end. Even tried to use Page Builders like Beaver Builder but my preference is really to use the stock, default Genesis theme and edit the CSS.
P.S. The screenshots are here:
http://www.project-skills.com/wp-content/uploads/2018/03/Screenshot2.jpg
http://www.project-skills.com/wp-content/uploads/2018/03/Screenshot1.jpgFebruary 13, 2018 at 3:10 pm #216514Erin UlrichParticipantYou will need to edit the style.css file, line 761 (for Authority Pro). It looks like this:
.full-width-content.single .content, .full-width-content.page .content { float: none; margin: 45px auto 140px; max-width: 680px; }
The line you need to adjust is the max-width line.
Erin Ulrich | Genesis Recommended Developer | Design by Insight
January 15, 2018 at 11:27 am #215419Topic: Mobile is unresponsive/page titles not scaling
in forum General Discussionderleon20MemberHi,
I am working on Academy Pro theme and the post/page titles are not responsive on mobile. The words are cut off and the titles and images are not adjusted to the width of the screen. I would appreciate any suggestions.Thanks, HD
January 3, 2018 at 4:26 pm #215072SummitOverworkedMemberI'm tweaking the genesis sample child theme. My goal is to get a slider that extends the full width of the browser window and to have the homepage content sit over the top of the slider slightly for depth.
Using awesome code and help that was already floating around the internet I've gotten a slider widget area in but I cant figure out where to adjust other spacings or how to make the slider the width of the browser.
Here is the code I put into functions.php to get the slider widget area:
//Add in new Widget areas function themeprefix_extra_widgets() { genesis_register_sidebar( array( 'id' => 'slider', 'name' => __( 'Slider', 'genesischild' ), 'description' => __( 'This is the Slider area', 'genesischild' ), 'before_widget' => '<div class="wrap slider">', 'after_widget' => '</div>', ) ); } add_action( 'widgets_init', 'themeprefix_extra_widgets' ); //Position the slider Area function themeprefix_slider_widget() { if( is_front_page() ) { genesis_widget_area ( 'slider', array( 'before' => '<aside class="slider-container">', 'after' => '</aside>',)); } } add_action( 'genesis_after_header','themeprefix_slider_widget' );
Any help would is greatly appreciated, I'm the IT guy for this company and WAY outside my comfort zone trying to do this. Please dont judge the design its just a default template from the pagebuilder plugin to give me something to design off of.
October 30, 2017 at 6:50 pm #213102In reply to: Monochrome theme – menu trouble on mobile?
sangfroidwebParticipantHi there,
You are right!...the demo has this same issue. I've never noticed that before...I think we've only done 1 site using Monochrome Pro, but I'm going to go check it on that one...so thanks for pointing it out!The issue is that site-header has fixed position even on mobile, which is the reason the user cannot scroll when the menu exceeds the height of the screen (bad for usability). To address that issue, we need to change the position of the site-header to relative when the mobile menu shows up, and then remove some top margin from site-inner (that was there to accommodate the fixed header.)
The stylesheet on your site is minified, so I can't tell you exactly where to put this in the stylesheet, but essentially this is the CSS that needs to be added. I'm putting it all together here, but there might be existing places in the stylesheet where these adjustments can be made. Note that this first part is inside a media query for screens with a max-width of 782px.
@media only screen and (max-width: 782px) {
/*This makes the site header not fixed to the top of the screen*/
.site-header {
position: relative;
}/*This removes the top margin that was making room for the fixed header*/
.front-page .site-inner,
.site-inner {
margin-top:0px;
}
}Here is some CSS that will add an X to the menu icon when the mobile menu is open.
/* This will add an X to the activated mobile menu to signify to close the menu */
.menu-toggle.ion-navicon.activated:before {
content: "\f12a";
}Let me know if you don't have luck with any of this CSS and we take another look and see what's up.
Hope it helps! Thanks!
Liz
Liz or Eddy @SangFroid Web — Customizing StudioPress themes at http://www.wpstudioworks.com and building custom Genesis Child themes for businesses at http://www.sangfroidwebdesign.com 🙂
October 14, 2017 at 6:32 am #212516apetrikMemberHi all,
I have Disqus Comments taking the full width of the page on Digital Pro theme. I've had this issue before on other themes and I resolved it. This was a few years ago and I can't remember how I fixed it. I think there was a thread about it on the old SP forums. How do I contain the width just to the post entry width?October 10, 2017 at 11:53 pm #212402Cr4zyS4mMemberHello,
My apologies if this double posts as I was trying to correct a couple things in the original and now it no longer appears on my end (nor does it show a topic started on my profile).
I am currently creating a Child Theme using Child Theme Configurator and their other plugin for Responsive menu. The Responsive Menu works great and triggers on 767px width or smaller. Naturally I was looking for a Sticky Header for larger screens as well. But to be slightly compressed compared to the existing header (and not a hamburger like mobile).I came across the following code which worked great but would appear behind the responsive menu for mobile devices..
JS:
<script src="https://gist.github.com/anonymous/c5c8949eade6678c4227a6faceb7ef2b.js"></script>
CSS:
[css].agct_sticky {
background-position: left;
text-align: right;
background-image: url(images/cropped-logo.png);
background-repeat: no-repeat;
display: none;
position: fixed;
top: 0;
border-bottom: 1px solid #2489f5;
background-color: #000;
left: 0;
right: 0;
}[/css]
Functions:
[php]//Sticky Header Desktop
add_action('genesis_after_footer','agct_sticky_menu');function agct_sticky_menu(){
wp_nav_menu( array(
'container' => 'div',
'container_class' => 'agct_sticky nav-primary',
'menu_class' => 'genesis-nav-menu',
'theme_location' => 'primary'
) );
}//Call To js
add_action( 'wp_enqueue_scripts', 'agct_sticky_load_scripts' );function agct_sticky_load_scripts(){
wp_enqueue_script('sticky_menu', get_stylesheet_directory_uri() . '/js/sticky.js', array( 'jquery' ),'1.0.0',true);}[/php]
After some testing, I was able to add the following to the JS to have the Sticky Header only appear on 768px or larger:
if ( $(window).width() > 768) { //hide on size less than 768
Now the JS appears as:
<script src="https://gist.github.com/anonymous/b843775ed476adb43efd345be88918b9.js"></script>Finally works and appears properly.
- Except
, it won't disappear. Now when scrolling back to the top of the page the Sticky Header remains at the top and will overlap the existing header... I feel there is something I may be missing or not properly adjusted. Any help would be greatly appreciated, thanks in advance!
October 10, 2017 at 11:06 pm #212399Topic: Sticky Header Overlapping Existing Header
in forum Design Tips and TricksCr4zyS4mMemberHello,
I have been working on an issue with using a Sticky Header. I am using the base Genesis Framework (2.5.3) and building a Child Theme with Child Theme Configurator. I am also using their Responsive Menu plugin. The responsive menu works great on mobile devices and only appears at 767px width or smaller as it's supposed to. So naturally I wanted a Sticky Header to appear on larger screens as well but smaller than the existing header upon scroll. I came across the code below which worked great but would appear behind the responsive menu on mobile devices...
CSS: `.agct_sticky {
background-position: left;
text-align: right;
background-image: url(images/cropped-logo.png);
background-repeat: no-repeat;
display: none;
position: fixed;
top: 0;
border-bottom: 1px solid #2489f5;
background-color: #000;
left: 0;
right: 0;
}`
JS: `jQuery(function($){var $mainMenu = $('nav.nav-primary'),
$stickyMenu = $('.agct_sticky');$(window).on('scroll', function() {
var windowTop = $(this).scrollTop(); //get top of window
var mainMenuBottom = $mainMenu.offset().top + $mainMenu.height(); //bottom of main menu
if( windowTop >= mainMenuBottom ) { //main Menu is no longer showing
$stickyMenu.slideDown(); //show our sticky menu
} else {
$stickyMenu.slideUp(); //hide our sticky menu
}
});});`
Functions: `//Sticky Header Desktop
add_action('genesis_after_footer','agct_sticky_menu');function agct_sticky_menu(){
wp_nav_menu( array(
'container' => 'div',
'container_class' => 'agct_sticky nav-primary',
'menu_class' => 'genesis-nav-menu',
'theme_location' => 'primary'
) );
}//Call To js
add_action( 'wp_enqueue_scripts', 'agct_sticky_load_scripts' );function agct_sticky_load_scripts(){
wp_enqueue_script('sticky_menu', get_stylesheet_directory_uri() . '/js/sticky.js', array( 'jquery' ),'1.0.0',true);}`
Added the following line to JS:
if ( $(window).width() > 768) { //hide on size less than 768
Now the JS is:jQuery(function($){ var $mainMenu = $('nav.nav-primary'), $stickyMenu = $('.agct_sticky'); $(window).on('scroll', function() { var windowTop = $(this).scrollTop(); //get top of window var mainMenuBottom = $mainMenu.offset().top + $mainMenu.height(); //bottom of main menu if( windowTop >= mainMenuBottom ); //main Menu is no longer showing if ( $(window).width() > 768) { //hide on size less than 768 $stickyMenu.slideDown(); //show our sticky menu } else { $stickyMenu.slideUp(); //hide our sticky menu } }); });
Now it only appears on screens 768px width or larger. Fantastic!
-
But it won't disappear....
Upon scrolling to the top of the page, the compressed sticky header is still there and it overlaps the existing Header/Menu at the top of the page. I feel like I am missing something or there is a simple adjustment that needs to be made and I'm not seeing it. Any assistance would be greatly appreciated, thanks in advance!
October 1, 2017 at 7:50 pm #212069In reply to: Adjusting Home Page Widget Height
gigtimeParticipantFound a solution elsewhere. If anyone is looking this dealing with this same issue, here's what I used to fix it. Adjust as needed for yours. And if you're using that theme, you're very likely to need to adjust the height in multiple sections on the home page.
.front-page-2 > .wrap, .front-page-3 > .wrap, .front-page-4 > .wrap, .front-page-5 > .wrap, .front-page-7 > .wrap { padding-top: 20px; padding-bottom: 20px; display: table; width: 100%; min-height: 50vh; } .front-page-1 > .wrap { padding-top: 20px; padding-bottom: 20px; display: table; width: 100%; min-height: 100vh; } .flexible-widget-area > .wrap { padding-top: 5px; padding-bottom: 5px;
September 10, 2017 at 5:17 am #211262In reply to: Infinity Pro Space Theme
Victor FontModeratorFor the first question about the space between the header and title, search for the following CSS in style.css around line 760:
.site-inner { background-color: #fff; clear: both; margin: 90px auto 0; padding: 10% 40px; max-width: 1280px; }
Change the top/bottom padding from 10% to a fixed dimension.
For your second question, adjust the bottom margin in the following CSS around line 1583 from 5% to a fixed dimension:
.page .entry-header, .single .entry-header { margin: 0 auto 5%; max-width: 660px; }
It would help you to learn how to use your browser's inspection tool. You would be able to see what needs to be changed and experiment with different CSS before making the changes permanent. https://victorfont.com/how-to-use-your-browsers-inspect-tool/
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?August 31, 2017 at 12:56 pm #210985In reply to: Changing Header Height in Infinity Pro
ErikaParticipantOh wait, I can see how the menu is not centered to the page, although it is in line with the logo. If you want to center the menu to the page, find the code below and make the change that's in bold:
.genesis-nav-menu {
clear: both;
line-height: 1;
width: 111%;
}You can adjust the number to how you like it.
August 3, 2017 at 6:17 am #209935In reply to: Parallax Pro Home Section 1
[email protected]MemberThx Victor
I moved my custom changes to the start of my stylesheet in an attempt to solve the media query issue (I don't really get how they were placed inside a media query). However, none of the changes are working on my computer.
Are they still within a media query or is there another issue?
Custom CSS is below:
/*
Theme Name: Parallax Pro Theme
Theme URI: http://my.studiopress.com/themes/parallax/
Description: The new role of website design is to tell a story, which is what Parallax Pro was developed to do.
Author: StudioPress
Author URI: http://www.studiopress.com/Version: 1.2.2
Tags: black, white, blue, green, orange, pink, one-column, two-columns, responsive-layout, custom-header, custom-menu, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
Template: genesis
Template Version: 2.1License: GPL-2.0+
License URI: http://www.opensource.org/licenses/gpl-license.php
*//* Table of Contents
-My Changes
- Blue Arrow Bullet
- Add Circular Avatar
- Adding Circular Image
- Adjust Height of Home Section 1
- Content Boxes- HTML5 Reset
- Baseline Normalize
- Box Sizing
- Float Clearing
- Defaults
- Typographical Elements
- Headings
- Objects
- Gallery
- Forms
- Buttons
- Tables
- Structure and Layout
- Site Containers
- Column Widths and Positions
- Column Classes
- Common Classes
- Avatar
- Genesis
- Search Form
- Titles
- WordPress
- Widgets
- Simple Social Icons
- Plugins
- Genesis eNews Extended
- Jetpack
- Site Header
- Title Area
- Widget Area
- Site Navigation
- Header Navigation
- Primary Navigation
- Secondary Navigation
- Responsive Menu
- Content Area
- Homepage
- Pricing Table
- Content
- Entries
- Entry Meta
- After Entry
- Pagination
- Content Boxes
- Comments
- Sidebar
- Footer Widgets
- Site Footer
- Theme Colors
- Parallax Pro Blue
- Parallax Pro Green
- Parallax Pro Orange
- Parallax Pro Pink
- Media Queries
- Retina Display
- Max-width: 1139px
- Max-width: 1023px
- Max-width: 768px*/
/*My Changes
.....................................*//*Blue Arrow Bullet*/
ul.bluearrow li {
background-image: url("https://members.evidencebasedteaching.org.au/wp-content/uploads/2017/07/blue-arrow-e1501299526424.png");
background-position: 28px 14px;
background-repeat: no-repeat;
background-size: 28px 28px;
list-style: /one outside none;
margin: 0;
padding: 0.75rem 0 0.75rem 4rem;
text-align: left;
}/*Add Circular Avatar: Added the following code to .avater*/
.border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;*//*Adding Circular Image Class*/
.circle-image {
border-radius: 50%; !important;
-moz-border-radius: 50%; !important;
-webkit-border-radius: 50%; !important;
-o-border-radius: 50%; !important;
display: block; !important;
}/*Adjust Height of Home Section 1*/
.home-section-1 {
padding: 12px 0 13px !important;
}/* Content Boxes
------------------------------------------------------------ */.content-box-blueborder,
.content-box-blue,
.content-box-ltblue,
.content-box-dkblue,
.content-box-brightred,
.content-box-gray,
.content-box-green,
.content-box-purple,
.content-box-red,
.content-box-dkred,
.content-box-yellow {
margin: 0 0 25px;
overflow: hidden;
padding: 20px;
}.content-box-blueborder {
background-color: #ffffff;
border: 5px solid #00227e;
}.content-box-blue, {
background-color: #d8ecf7;
border: 1px solid #afcde3;
}.content-box-ltblue, {
background-color: #88a2cc;
border: 1px solid #88a2cc;}
.content-box-dkblue {
background-color: #01437e;
border: 1px solid #00227e;
color: #ffffff;
}.content-box-dkblue h1,
.content-box-dkblue h2,
.content-box-dkblue h3,
.content-box-dkblue h4 {
color: #ffffff;
}.content-box-brightred {
background-color: #FF0000;
border: 1px solid #FF0000;
color: #ffffff;
}.content-box-brightred h1,
.content-box-brightred h2,
.content-box-brightred h3,
.content-box-brightred h4 {
color: #ffffff;
}.content-box-gray {
background-color: #e2e2e2;
border: 1px solid #bdbdbd;
}.content-box-green {
background-color: #d9edc2;
border: 1px solid #b2ce96;
}.content-box-purple {
background-color: #e2e2f9;
border: 1px solid #bebde9;
}.content-box-red {
background-color: #f9dbdb;
border: 1px solid #e9b3b3;
}.content-box-dkred {
background-color: #930b0b;
border: 1px solid #760b0b;
color: #ffffff;
}.content-box-dkred h1,
.content-box-dkred h2,
.content-box-dkred h3,
.content-box-dkred h4 {
color: #ffffff;
}.content-box-yellow {
background-color: #fef5c4;
border: 1px solid #fadf98;
}July 24, 2017 at 6:28 am #209524In reply to: Maintaining Mobile Responsiveness
Victor FontModeratorMobile CSS is found in the media queries at the bottom of the style sheet. .content is a general class that applies to all Genesis pages. When you make change to a general class, it affects the site globally. If you want the change to apply to 2 pages only, you need to qualify the class so it applies only to those two pages.
The first thing I would do for your site is save WordPress permalinks. page_id=9 is not a clean permalink. If you save the permalinks using the post name, the page will be kevinaross.com/about/.
WordPress automatically adds a CSS class to the body tag of every page on your site based on the page id. For your About page, the CSS class is page-id-9. Your portfolio page is page-id-129. You use these classes to qualify the CSS change you made to limit the change to the two pages. The qualified CSS for both pages is:
.page-id-9 .content, .page-id-129 .content { margin: 0 auto; width: 1400px; }
Last, you have to adjust the width in the media query breakpoints, maybe change the width to width:auto. You'll have to experiment with this on your own to find the look you want.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?June 28, 2017 at 4:17 pm #208414In reply to: Infinity Pro page width
RoxGMemberI'm obviously missing something.
I went into the Style.css and changed the value for max-width, cleared my cache and nothing happened. My head is still cut off in the picture. I tried deleting the line that reads width: 100%; and it just shrunk the image.Is there a way to adjust the height instead of width? It's the height that I'm having trouble with. It keeps cutting off my head even went I make the below the themes recommended height of 1000px
/* Content */
.content {
float: right;
padding: 80px 60px;
width: 65%;
}.content-sidebar .content {
border-right: 1px solid #eee;
float: left;
}.sidebar-content .content {
border-left: 1px solid #eee;
}.full-width-content .content {
border-right: none;
float: none;
margin-left: auto;
margin-right: auto;
max-width:1100;
width: 100%;
}.full.full-width-content .content,
.full.landing-page .site-inner,
.full.lead-capture-page .site-inner {
max-width: 100%;
}/* Primary Sidebar */
.sidebar-primary {
float: right;
width: 35%;
}.sidebar-content .sidebar-primary {
float: left;
} -
AuthorSearch Results