/* Theme Name: RO MWF Theme URI: http://www.ronline.com/ Author: Resources Online Author URI: http://www.ronline.com/ Description: MWF-compliant theme. Requires Advanced Custom Fields PRO. Version: 7.2.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: romwf Tags: RO MWF requires use of Microsoft MWF, and Advanced Custom Fields PRO. NO SITE-SPECIFIC CUSTOM STYLES IN THIS FILE. Use a child theme. Microsoft MWF requires jQuery 1.9 or later (v3.3+ is supported). URLs (and versioning) for MWF's required CSS and JS assets are set inline within header.php. For Microsoft MWF documentation, including latest required markup for all modules, see http://approjects.co.za/?big=en-us/mwf/ For integrating Microsoft UHF, use the RO UHF plugin. */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # MWF Global Overrides # General Additions # Blog Styles --------------------------------------------------------------*/ html { scroll-behavior: smooth; } /* Clearfix (alias: .cf) */ .cf:before, .cf:after, .clearfix:before, .clearfix:after { content: " "; display: table; } .cf:after, .clearfix:after { clear: both; } body.error404 #headerUniversalHeader #meControl { display: none; } /*-------------------------------------------------------------- # MWF Global Overrides and fixes --------------------------------------------------------------*/ .c-list .c-list { margin-bottom: 0; } .page-template-mwf-article-with-banner-left-sidebar [data-grid~="container"] [data-grid~="container"] { padding-left: 0; padding-right: 0; } #content .c-menu { z-index: 701; } .theme-dark abbr, .theme-light abbr, .theme-light .theme-dark abbr, .theme-dark dfn, .theme-light .theme-dark dfn, abbr { border-bottom: 0; } .x-type-center img.c-image, .x-type-center picture.c-image img { display: inline-block; } img.c-image.aligncenter { margin-left: auto; margin-right: auto; } /* MWF links styles within a paragraph are different from other contexts (e.g. in list item). This made it consistent. */ [class^="c-paragraph"] a.c-hyperlink, [class^="c-caption"] a.c-hyperlink { text-decoration: none; } [class^="c-paragraph"] a.c-hyperlink:hover, [class^="c-caption"] a.c-hyperlink:hover { text-decoration: underline; } /* Fix Edge and Firefox Quantum fatal issues with sizing responsive child DIVs inside dialogs: */ .c-dialog [role="dialog"] [role="document"] { display: block; } /* Fix rendering bug in some older versions of Chrome (2017.11.28) */ strong, b { font-family: "Segoe UI", SegoeUI, "Helvetica Neue", Helvetica, Arial, sans-serif; } /* Fix bad UHF CSS for the MS Edge promo banner */ #headerUniversalHeader #epb, #epb.m-alert[role="alert"] { margin-top: 0; } /* Eliminate link-y cursor for content placement items that DON'T have any CTA */ .m-content-placement-item:not([data-js-href]) { cursor: text; } .c-content-placement:not([data-js-href]):hover picture img, .m-content-placement-item:not([data-js-href]):hover picture img { opacity: 1; } .m-video-trigger { margin-top: 48px; } .m-video-trigger.f-lean { margin-top: 0; } .m-hero-item .c-heading-1, .m-hero-item .c-heading-2, .m-hero-item .c-heading-3, .m-hero-item .c-heading-4 { padding-top: 0; } .m-rich-heading .c-paragraph-3 { padding: 6px 0 0; } blockquote.c-blockquote .c-paragraph-3:first-child, blockquote.c-blockquote + .c-paragraph-3, blockquote + .c-paragraph-3 { padding-top: 0; } .c-drawer .f-toggle, .c-drawer>button, .c-drawer>header .f-toggle, .c-drawer>header>button { font-size: 15px; line-height: 1.25em; font-weight: 600; } .c-drawer .c-drawer-panel { padding-bottom: 2em; } /* This may get fixed in v1.22.x */ [class*="m-persona-"] >div+div [class*="c-heading"] .c-hyperlink { padding: 0; } /* Fix broken theme styles in Highlight Feature */ .m-highlight-feature.theme-dark > div { background: #000; color: #fff; } .m-highlight-feature.theme-dark > div .c-call-to-action, .m-highlight-feature.theme-dark > div .c-call-to-action:focus:not(.x-hidden-focus), .m-highlight-feature.theme-dark > div .c-call-to-action:hover { color: #fff; } .m-highlight-feature.theme-dark > div .c-call-to-action:not(.f-primary):not(.f-secondary):focus:not(.x-hidden-focus), .m-highlight-feature.theme-dark > div .c-call-to-action:not(.f-primary):not(.f-secondary):hover { color: #e6e6e6; } nav.c-in-page-navigation .c-heading-4 { padding: 38px 0 12px; margin: 0 24px; } /* Fix text color values incorrectly missing from MWF CSS */ .m-typographic-intro.f-background-msft-green, .m-typographic-intro.f-background-purple, .m-typographic-intro.f-background-msft-orange, .m-typographic-intro.f-background-teal, .m-typographic-intro.f-background-msft-red { color: #fff; } /* Fix mobile display issues for wide tables */ .c-table { overflow-x: auto; } /** * Social Toolbar */ .page-social-toolbar { border-top: 2px solid #ddd; margin: 2em 0 0; padding: 0; } .page-social-toolbar .m-social { margin: 1.25em 0 0; } .page-social-toolbar div[data-grid~="col-6"]:nth-of-type(2) .m-social { float: right; } [dir="rtl"] .page-social-toolbar div[data-grid~="col-6"]:nth-of-type(2) .m-social { float: left; } /* customize social spacing when in sidebar */ .widget-area .m-social { margin-top: 1em; } .m-pagination .c-glyph.pagination-ellipsis:before { content: "\E712"; vertical-align: bottom; margin-right: 8px; } /* Fix MWF bug: missing required UI style for first pagination link */ .m-pagination li:nth-of-type(2) .c-glyph:before, .c-pagination li:nth-of-type(2) .c-glyph:before { content: "\E76B"; vertical-align: -2px; margin-right: 8px; } /* Fix weird margining w/ 1.57.7 a11y fix: */ .m-pagination li:nth-of-type(1) { margin: 0; padding: 0; } /*-------------------------------------------------------------- # General Additions --------------------------------------------------------------*/ .ro-flex-row { display: flex;} .ro-flex-justify-center { justify-content: center; } .ro-flex-col {} .m-area-heading.mwf-area-heading-ctas .mwf-area-heading-ctas-wrapper a { display: inline-block; } .m-area-heading.mwf-area-heading-ctas .mwf-area-heading-ctas-wrapper a + a { margin-left: 24px; } [dir="rtl"] .m-area-heading.mwf-area-heading-ctas .mwf-area-heading-ctas-wrapper a + a { margin-right: 24px; margin-left: 0; } .mwf-glyph-checkmark { overflow: hidden; font-size: 1px; text-indent: -999em; color: #fff; } .mwf-glyph-checkmark:before { margin: 0; font-family: "MWF-MDL2"; font-size: 26px; color: #000; content: "\E73E"; } .mwf-cta-standalone-centered { padding-top: 24px; } .page-mwf-article-text-banner aside, .page-mwf-article-text-banner .aside { padding-top: 35px !important; } .context-glyph-tile .c-glyph { font-size: 46px; font-family: "MWF-MDL2"; } img.rwd-img, .rwd-img img { margin: 0; width: 100%; max-width: 100%; height: auto; } .mwf-blog-preview-header h1, .mwf-blog-preview-header h2 { margin-bottom: 0.3em; } @media screen and (max-width: 540px) { .mwf-blog-latest-posts [data-grid~="col-8"] { width: 100%; } } @media screen and (min-width:541px) and (max-width:768px) { .mwf-blog-latest-posts [data-grid~="col-8"] { width: 490px; } } @media screen and (max-width:768px) { .mwf-blog-latest-posts { text-align: center; } .mwf-blog-latest-posts [data-grid~="col-8"] { float: none; margin: 0 auto; padding: 0 24px 24px; } } @media screen and (min-width:769px) { .mwf-blog-latest-posts [data-grid~="col-8"] { padding: 0 36px 36px; } } .c-feature>div .c-group .c-call-to-action + .c-call-to-action { margin-left: 24px; } .mwf-c-feature-yt {} .youtube-wrap, .ro-mwf-video-iframe-wrapper, .mwf-c-feature-yt-iframe-wrapper { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; } .youtube-wrap iframe, .ro-mwf-video-iframe-wrapper iframe, .ro-mwf-video-iframe, .mwf-c-feature-yt-iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; } .youtube-wrap { margin-top: 32px; } /* Download module */ .mwf-c-download-module-wrapper { margin-top: 48px; } .mwf-c-download-module [data-grid*=col-] { float: none; } .mwf-c-download-module .mwf-c-download-module-ctas, .mwf-c-download-module .c-table { margin-top: 24px; } .mwf-c-download-module .mwf-cta-standalone + .mwf-cta-standalone { margin-left: 16px; } [data-grid~=col-4] .mwf-c-download-module .mwf-cta-standalone + .mwf-cta-standalone { margin-left: 0; clear: both; } @media screen and (max-width: 767px) { .mwf-c-download-module-wrapper[data-grid~="stack-2"] [data-grid] + [data-grid] { padding-top: 2.5em; } } @media screen and (min-width: 768px) { .mwf-c-download-module-wrapper[data-grid~="stack-2"] .mwf-cta-standalone + .mwf-cta-standalone { clear: both; margin-top: 12px; margin-left: 0; } } /* RO-IFRAME */ .ro-iframe-heading + .romwf-iframe-row { margin-top: 1.5em; } .romwf-iframe-wrapper { position: relative; width: 100%; } .romwf-iframe-wrapper iframe { width: 100%; border: 0; } .romwf-iframe-16x9 { height: 0; padding-bottom: 60%; } .romwf-iframe-4x3 { height: 0; padding-bottom: 75%; } .romwf-iframe-16x9 iframe, .romwf-iframe-4x3 iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* see: mwf-video-trigger */ .romwf-video-iframe-wrapper { position: relative; width: 100%; height: 0; margin: 0; padding: 0 0 56.25%; overflow: hidden; } .romwf-video-iframe-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; } /*-------------------------------------------------------------- # Blog Styles --------------------------------------------------------------*/ .screen-reader-text { /* clone of MWF's .x-screen-reader */ border: 0!important; clip: rect(1px, 1px, 1px, 1px)!important; position: absolute!important; overflow: hidden!important; width: 1px!important; height: 1px!important; padding: 0!important; margin: 0!important } .page-mwf-blog, .page-mwf-article aside { padding-top: 65px; } /* Blog augmentations: */ .page-mwf-blog article .c-heading-1 { padding-top: 0; } #content .page-mwf-blog .entry-title a.c-hyperlink { color: inherit; } #content .page-mwf-blog .entry-title a.c-hyperlink:hover, #content .page-mwf-blog .entry-title a.c-hyperlink:focus { color: #006cc2; } .page-mwf-blog .alignleft { display: inline; float: left; margin-right: 1.5em; } .page-mwf-blog .alignright { display: inline; float: right; margin-left: 1.5em; } .page-mwf-blog .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } .page-mwf-blog .entry-meta, .page-mwf-blog .entry-meta time, .page-mwf-blog .entry-footer, body.search-results .entry-meta { font-style: italic; } body.search-results article .entry-content { padding-top: 24px; } .page-mwf-blog .entry-footer .edit-link, .page-mwf-blog .entry-footer .comments-link, .page-mwf-blog .comment-metadata .edit-link { margin-left: 1em; padding-left: 1em; border-left: 1px solid #ccc; } .page-mwf-blog .comments-area, .page-mwf-blog .comment-list, .page-mwf-blog .comment-respond { margin-top: 1.5em;} .page-mwf-blog .comment-body .reply { margin-top: 1em; } .page-mwf-blog .comment-content { padding-left: 1.5em; } .page-mwf-blog .comment-metadata { padding-left: 36px; } .page-mwf-blog .comment-form-comment label { display: block; margin: 1em 0 0.5em; } .page-mwf-blog .form-submit { margin-top: 0.5em; } .page-mwf-blog-single .post-navigation, .page-mwf-blog .entry-meta .updated:not(.published), body.search-results .entry-meta .updated:not(.published) { display: none; } .page-mwf-blog .posts-navigation, .page-mwf-blog .post-navigation { margin-top: 2.5em;} .page-mwf-blog-single .post-navigation { display: block; margin-top: 2.5em; } .page-mwf-blog-single .post-navigation .nav-links { display: flex; justify-content: space-between; } .page-mwf-blog-single .post-navigation .nav-previous + .nav-next { margin-left: 2em; } .page-mwf-blog-single .post-navigation .nav-previous { text-align: left; margin-right: 2em; } [dir="rtl"] .page-mwf-blog-single .post-navigation .nav-previous { text-align: right; margin-right: 0; margin-left: 2em; } .page-mwf-blog-single .post-navigation .nav-next { text-align: right; margin-right: 2em; margin-left: 0;} [dir="rtl"] .page-mwf-blog-single .post-navigation .nav-next { text-align: left; } .page-mwf-blog-single .post-navigation .nav-previous > a:before { display: inline-block; margin-right: 8px; vertical-align: -2px; font-family: "MWF-MDL2"; content: "\E76B"; } [dir="rtl"] .page-mwf-blog-single .post-navigation .nav-previous > a:before { margin-right: 0; margin-left: 8px; content: "\E76C"; } .page-mwf-blog-single .post-navigation .nav-next > a:after { display: inline-block; margin-left: 8px; vertical-align: -2px; font-family: "MWF-MDL2"; content: "\E76C"; } [dir="rtl"] .page-mwf-blog-single .post-navigation .nav-next > a:after { margin-left: 0; margin-right: 8px; content: "\E76B"; } .read-more-link, .c-paragraph-3.read-more-link { padding-top: 0.5em; } .page-mwf-blog figure { padding-bottom: 1.1em; } .page-mwf-blog figure img { display: block; margin: 0; max-width: 100%; height: auto; } section.m-feature.f-align-right.f-image-priority div {float: right !important; position: static !important; transform: unset !important; } /* Disabling Login Functionality*/ div#meControl { display: none !important; }