/* Theme Name: Unofficial Foggy Bottom Theme URI: Description: Based on the Tiny Framework theme, and updated with a custom color palette featuring in-brand, accessible GW colors. The Executive theme features elegant responsive mobile-first design, space for a header image, custom logo and three footer widgets. The unofficial version DOES NOT include the official GW global footer with the university logo, institutional links or GW's official accessibility notice. Author: GW Marketing & Creative Services Author URI: https://creativeservices.gwu.edu/gw-blogs Template: tiny-framework Version: 2.3.1 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: one-column, two-columns, right-sidebar, custom-background, custom-header, custom-logo, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, footer-widgets, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, accessibility-ready, blog, e-commerce, education Text Domain: tiny-frameworkchild This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. */ /* Notes -------------------------------------------------------------- This stylesheet uses rem values with a pixel fallback. The rem values (and line heights) are calculated using two variables: $rembase: 16; $line-height: 24; We use rem for: font-size, margin, padding, width, max-width when using in px. For easy calculation you may use this tool, set "Choose your font-size (px)" to 16: @link https://offroadcode.com/prototypes/rem-calculator/ ---------- Examples padding: 5px 0; padding: 0.3125rem 0; (5 / $rembase) * Set a font-size and then set a line-height based on the font-size: font-size: 16px font-size: 1rem; (16 / $rembase) line-height: 1.5; ($line-height / 16) ---------- Vertical spacing Vertical spacing between most elements should use 24px or 48px to maintain vertical rhythm: .my-new-div { margin: 24px 0; margin: 1.5rem 0; ( 24 / $rembase ) } ---------- Further reading http://snook.ca/archives/html_and_css/font-size-with-rem http://blog.typekit.com/2011/11/09/type-study-sizing-the-legible-letter/ To calculate golden ratio for font size and line height you will need these tools: http://www.pearsonified.com/typography/ Sizes in rem units for quick reference: 1px: 0.0625rem 2px: 0.125rem 3px: 0.1875rem 4px: 0.25rem 5px: 0.3125rem 6px: 0.375rem 7px: 0.4375rem 8px: 0.5rem 9px: 0.5625rem 10px: 0.625rem 11px: 0.6875rem 12px: 0.75rem 13px: 0.8125rem 14px: 0.875rem 15px: 0.9375rem 16px: 1rem 17px: 1.0625rem 18px: 1.125rem 19px: 1.1875rem 20px: 1.25rem 21px: 1.3125rem 22px: 1.375rem 23px: 1.4375rem 24px: 1.5rem 25px: 1.5625rem 26px: 1.625rem 27px: 1.6875rem 28px: 1.75rem 29px: 1.8125rem 30px: 1.875rem 31px: 1.9375rem 32px: 2rem 33px: 2.0625rem 34px: 2.125rem 35px: 2.1875rem 36px: 2.25rem 37px: 2.3125rem 38px: 2.375rem 39px: 2.4375rem 40px: 2.5rem 41px: 2.5625rem 42px: 2.625rem 43px: 2.6875rem 44px: 2.75rem 45px: 2.8125rem 46px: 2.875rem 47px: 2.9375rem 48px: 3rem */ /* Table of Contents: * * 1.0 - Normalize * 2.0 - Typography * 3.0 - Elements * 3.1 - FontAwesome webfont * 4.0 - Forms * 4.1 - General styles first * 4.2 - Buttons * 4.3 - Twitter Bootstrap style button * 5.0 - Navigation * 5.1 - Links * 5.2 - Menus * 5.3 - Post, archive navigation * 6.0 - Accessibility * 7.0 - Alignments * 8.0 - Clearings * 9.0 - Widgets * 9.1 - General widget styles * 9.2 - Specific widget styles * 9.3 - Footer widget styles * 10.0 - Header * 10.1 - Site Header * 11.0 - Content * 11.1 - Posts and pages * 11.2 - Post Formats * 11.3 - Comments * 11.4 - Page templates * 12.0 - Footer * 13.0 - Media * 13.1 - Images * 13.2 - Captions * 13.3 - Galleries * 14.0 - Other styles * 14.1 - Twitter Bootstrap style alerts * 14.2 - Misc. styles * 15.0 - Media queries * 15.0a - Maximum width of 800 pixels * 15.0b - Maximum width of 782 pixels - it only affects the mobile view * 15.0c - Maximum width of 320 pixels - it only affects the mobile view * 15.1 - Minimum width of 783 pixels (small screens - mobile phones, small tablets in portrait view mode) * 15.2 - Minimum width of 1100 pixels (average size screens - monitors, small tablets in landscape view mode, larger tablets) * 15.3 - Minimum width of 1240 pixels (big screens - widescreen monitors, high resolution tablets) * 15.4 - Retina-specific styles. This style cannot be processed by LESS * 16.0 - Print * 16.1 - Comments * * ---------------------------------------------------------------------------- */ /* 1.0 Normalize -------------------------------------------------------------- */ body { background-color: #033C5A; } mark { background-color: #FFD400; } /* 2.0 Typography -------------------------------------------------------------- */ body, button, input, select, textarea { font-family: 'Avenir', Arial, Helvetica, sans-serif; color: #4A4A4A; } h1, h2, h3, h4, h5, h6 { color: #033C5A; } blockquote { color: #008364; } blockquote p:first-child:before { color: #008364; } .comment-content blockquote { color: #9B9B9B; } .comment-content blockquote p:first-child:before { color: #E0E0E0; } code { color: #C9102F; } /* 3.0 Elements -------------------------------------------------------------- */ hr { background-color: #AA9868; } td, th { border: 1px solid #D9D0BB; } thead tr { background-color: #F3F3F3; } tbody tr:nth-child(even) { background-color: #F3F3F3; } /* 3.1 FontAwesome webfont */ .post-password-required .entry-title:before { color: #C9102F; } .status-private .entry-title:before { color: #C9102F; } /* 4.0 Forms -------------------------------------------------------------- */ /* 4.1 General styles first */ button, input, input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], select, textarea { border: 1px solid #688A9C; } /* 4.2 Buttons */ article.post-password-required input[type=submit], .btn, .menu-toggle, input[type="button"], input[type="reset"], input[type="submit"] { background-color: #0773AA; background-image: -moz-linear-gradient(top, #0773AA, #0773AA); background-image: -ms-linear-gradient(top, #0773AA, #e6e6e6); background-image: -webkit-linear-gradient(top, #0773AA, #0773AA); background-image: -o-linear-gradient(top, #0773AA, #0773AA); background-image: linear-gradient(top, #0773AA, #0773AA); background-repeat: repeat-x; border: 1px solid #0073AA; color: #f3f3f3; } article.post-password-required input[type=submit]:hover, article.post-password-required input[type=submit]:focus, .btn:focus, .btn.focus, .btn:hover, button:focus, button:hover, input[type="button"]:focus, input[type="button"]:hover, input[type="reset"]:focus, input[type="reset"]:hover, input[type="submit"]:focus, input[type="submit"]:hover, .menu-toggle:hover { background-color: transparent; /* Back compat. for IE8 */ background-color: rgba(167, 85, 35, 1); color: #f3f3f3; text-decoration: none; border: 1px solid #A75523; } .btn:active, .btn.active, button:active, input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active, .menu-toggle:active, .menu-toggle.toggled-on { background-color: transparent; /* Back compat. for IE8 */ background-color: rgba(167, 85, 35, 1); color: #f3f3f3; text-decoration: none; border: 1px solid #A75523; } /* 4.3 Twitter Bootstrap style buttons */ /* Find more custom Twitter BootStrap style button examples at http://charliepark.org/bootstrap_buttons/ */ .btn-custom-blue { background-color: hsl(200.2, 92.1%, 37.4%) !important; /* blue color */ background-image: -khtml-gradient(linear, left top, left bottom, from(#0073AA), to(#0073AA)); background-image: -moz-linear-gradient(top, #0073AA, #0073AA); background-image: -ms-linear-gradient(top, #0073AA, #0073AA); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0073AA), color-stop(100%, #0073AA)); background-image: -webkit-linear-gradient(top, #0073AA, #0073AA); background-image: -o-linear-gradient(top, #0073AA, #0073AA); background-image: linear-gradient(#0073AA, #0073AA); background-repeat: repeat-x; border-color: #0073AA #0073AA hsl(200, 100%, 25%); color: #fff !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00a9ff", endColorstr="#006599"); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .btn-custom-green { background-color: hsl(110, 100%, 24%) !important; background-image: -khtml-gradient(linear, left top, left bottom, from(#008364), to(#008364)); background-image: -moz-linear-gradient(top, #008364, #008364); background-image: -ms-linear-gradient(top, #008364, #008364); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008364), color-stop(100%, #008364)); background-image: -webkit-linear-gradient(top, #008364, #008364); background-image: -o-linear-gradient(top, #008364, #008364); background-image: linear-gradient(#008364, #008364); background-repeat: repeat-x; border-color: #008364 #008364 hsl(110, 100%, 19%); color: #fff !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#008364", endColorstr="#008364"); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .btn-custom-orange { background-color: hsl(25, 100%, 41%) !important; background-image: -khtml-gradient(linear, left top, left bottom, from(#ff7000), to(#ff7000)); background-image: -moz-linear-gradient(top, #ff7000, #ff7000); background-image: -ms-linear-gradient(top, #ff7000, #ff7000); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff7000), color-stop(100%, #ff7000)); background-image: -webkit-linear-gradient(top, #ff7000, #ff7000); background-image: -o-linear-gradient(top, #ff7000, #ff7000); background-image: linear-gradient(#ff7000, #ff7000); background-repeat: repeat-x; border-color: #ff7000 #ff7000 hsl(25, 100%, 36%); color: #033C5A !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7000", endColorstr="#ff7000"); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .btn-custom-red { background-color: hsl(0, 100%, 30%) !important; background-image: -khtml-gradient(linear, left top, left bottom, from(#c9102f), to(#c9102f)); background-image: -moz-linear-gradient(top, #c9102f, #c9102f); background-image: -ms-linear-gradient(top, #c9102f, #c9102f); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c9102f), color-stop(100%, #c9102f)); background-image: -webkit-linear-gradient(top, #c9102f, #c9102f); background-image: -o-linear-gradient(top, #c9102f, #c9102f); background-image: linear-gradient(#c9102f, #c9102f); background-repeat: repeat-x; border-color: #c9102f #c9102f hsl(0, 100%, 25%); color: #fff !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c9102f", endColorstr="#c9102f"); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* 5.0 Navigation -------------------------------------------------------------- */ /* 5.1 Links */ /* Default link colors, if used in alerts, would not comply with accessibility text contrast requirements, that's why * it's better to use "alert-link" class for the links inside alert boxes. */ a { color: #0073AA; text-decoration: underline; } a:visited { color: #0073AA; text-decoration: underline; } a:active, a:focus, a:hover { color: #A75523; text-decoration: underline; } /* Button-like links */ .btn a, a.btn, .widget-area .textwidget .btn a, .widget-area .textwidget a.btn { color: #0073AA; } .btn a:hover, a.btn:hover, .widget-area .textwidget .btn a:hover, .widget-area .textwidget a.btn:hover { color: #A75523; } /* 5.2 Menus */ /* Small (mobile) menu */ .site-header .menu-toggle, .site-header .menu-toggle:focus, .site-header .menu-toggle:hover { background: #033C5A; } .main-navigation li a { color: #033C5A; } .main-navigation li a:focus, .main-navigation li a:hover { color: #A75523; } .main-navigation li ul li a { background: #ffffff; border-bottom: 0; border-left: 0.125px solid #033C5A; border-right: 0.125px solid #033C5A; } .main-navigation ul li ul li, .main-navigation ul li ul li ul li { border-bottom: 0; } .main-navigation li ul li a:focus, .main-navigation li ul li a:hover { background: #ffffff; color: #A75523; } .main-navigation .current-menu-ancestor > a, .main-navigation .current-menu-item > a, .main-navigation .current_page_ancestor > a, .main-navigation .current_page_item > a { color: #A75523; } /* From Expound css/expound.css */ .site-header .menu-toggle { background: #033C5A; color: #f3f3f3; } .site-header .menu-toggle:focus, .site-header .menu-toggle:hover { background: #688A9C; } .social-navigation a:before { color: #0073AA; } .widget-area .widget a.social-link, .widget-area .widget a .social-link, .widget-area .widget a:visited.social-link, .widget-area .widget a:visited .social-link { color: #0073AA; } .widget-area .widget a:active.social-link, .widget-area .widget a:active .social-link, .widget-area .widget a:focus.social-link, .widget-area .widget a:focus .social-link, .widget-area .widget a:hover.social-link, .widget-area .widget a:hover .social-link { color: #A75523; } /* 5.3 Post, archive navigation */ /* .post-navigation, .nav-previous and .nav-next - prev/next post navigation * .pagination and .page-numbers - prev/next posts page (archive) navigation * .nav-links is for post, archive and comment navigations. */ /* Tip88 - Customize color scheme: Navigation links for archive and single views (Previous, Next page of articles and article) */ .nav-links a, .nav-links a:visited { -webkit-tap-highlight-color: rgba(7, 115, 170, 1); color: #0073AA; text-decoration: underline; } .nav-links a:hover, .nav-links a:focus { color: #A75523; text-decoration: underline; } .entry-content .page-links > .page-links-title { color: #033C5A; } .entry-content .page-links a, .entry-content .page-links a:visited { -webkit-tap-highlight-color: rgba(7, 115, 170, 1); background-color: #0073AA; border-color: #0073AA; text-decoration: underline; } .entry-content .page-links a:focus, .entry-content .page-links a:hover { background-color: #A75523; background-color: rgba(167, 85, 35, 1); } /* 6.0 Accessibility -------------------------------------------------------------- */ .screen-reader-text:focus { color: #0073AA; } /* 7.0 Alignments -------------------------------------------------------------- */ /* 8.0 Clearings -------------------------------------------------------------- */ /* 9.0 Widgets -------------------------------------------------------------- */ /* 9.1 General widget styles */ .widget-title { color: #033C5A; } .widget-area .widget { color: #4A4A4A; } .widget-area .widget a, .widget-area .widget a:visited { color: #0073AA; text-decoration: underline; } .widget-area .widget a:active, .widget-area .widget a:focus, .widget-area .widget a:hover { color: #A75523; } .widget-area .widget li { color: #4A4A4A; } /* 9.2 Specific widget styles */ .widget_recent_entries .post-date, .widget_rss .rss-date { color: #4A4A4A; } .widget_rss .widget-title a, .widget_rss .widget-title a:visited { color: #0073AA; } .widget_recent_comments li, .widget_recent_entries li { color: #4A4A4A; } .widget-area .widget .textwidget a, .widget-area .widget .textwidget a:visited { color: #0773AA; } .widget-area .widget .textwidget a:active, .widget-area .widget .textwidget a:focus, .widget-area .widget .textwidget a:hover{ color: #A75523; } /* Styles for Categories and Pages widgets */ .widget-area .widget_categories a, .widget-area .widget_categories a:visited, .widget-area .widget_nav_menu a, .widget-area .widget_nav_menu a:visited { color: #0073AA; } .widget-area .widget_categories a:hover, .widget-area .widget_categories a:focus, .widget-area .widget .children li.cat-item a:hover, .widget-area .widget .children li.cat-item a:focus, .widget-area .widget .children li.page_item a:hover, .widget-area .widget .children li.page_item a:focus, .widget-area .widget_nav_menu a:hover, .widget-area .widget_nav_menu a:focus { color: #A75523; } .widget-area .widget .current-cat-parent a, .widget-area .widget .current-cat-parent a:visited, .widget-area .widget .current_page_parent a, .widget-area .widget .current_page_parent a:visited { color: #0073AA; } .widget-area .widget .current-cat .cat-item a, .widget-area .widget .current-cat .cat-item a:visited, .widget-area .widget .current-cat-parent .cat-item a, .widget-area .widget .current-cat-parent .cat-item a:visited, .widget-area .widget .current_page_item .page_item a, .widget-area .widget .current_page_item .page_item a:visited, .widget-area .widget .current_page_parent .page_item a, .widget-area .widget .current_page_parent .page_item a:visited { color: #0073AA; } .widget-area .widget .current-cat, .widget-area .widget .current-cat a, .widget-area .widget .current-cat a:visited, .widget-area .widget .current-cat-parent .current-cat, .widget-area .widget .current-cat-parent .current-cat a, .widget-area .widget .current-cat-parent .current-cat a:visited, .widget-area .widget .current_page_item, .widget-area .widget .current_page_item a, .widget-area .widget .current_page_item a:visited, .widget-area .widget .current_page_parent .current_page_item, .widget-area .widget .current_page_parent .current_page_item a, .widget-area .widget .current_page_parent .current_page_item a:visited { color: #0073AA; } /* 9.3 Footer widget styles */ #footer-widgets a, #footer-widgets a:visited { color: #0773AA; text-decoration: underline; } #footer-widgets a:active, #footer-widgets a:focus, #footer-widgets a:hover { color: #A75523; text-decoration: underline; } #copyright-widget a, #copyright-widget a:visited { color: #0773AA; text-decoration: underline; } #copyright-widget a:active, #copyright-widget a:focus, #copyright-widget a:hover { color: #A75523; text-decoration: underline; } /* 10.0 Header -------------------------------------------------------------- */ /* Tip04 - Reminder to enable JavaScript */ #no-javascript { background-color: #c9102F; } /* 10.1 Site Header */ .site-header .site-description a, .site-header .site-title a { color: #033C5A; text-decoration: underline; } .site-header .site-description a:focus, .site-header .site-description a:hover, .site-header .site-title a:focus, .site-header .site-title a:hover { color: #A75523; } /* 11.0 Content -------------------------------------------------------------- */ /* 11.1 Posts and pages */ .entry-header .entry-title { color: #033C5A; } .entry-header .entry-title a { color: #0773AA; text-decoration: underline; } .entry-header .entry-title a:focus, .entry-header .entry-title a:hover { color: #A75523; } .comments-link a, .entry-meta a { color: #0073AA; text-decoration: underline; } .comments-link a:hover, .entry-header .title-comment-meta a:hover, .entry-meta a:hover { color: #A75523; } .comments-link a:focus, .entry-header .title-comment-meta a:focus, .entry-meta a:focus { color: #0073AA; text-decoration: underline; } footer.entry-meta { color: #033C5A; } .byline, .cat-links, .comments-link, .edit-link, .entry-format, .full-size-link , .posted-on, .tags-links { color: #033C5A; } .comment-content h1, .comment-content h2, .comment-content h3, .comment-content h4, .comment-content h5, .comment-content h6 .entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6, .entry-summary h1, .entry-summary h2, .entry-summary h3, .entry-summary h4, .entry-summary h5, .entry-summary h6, .page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6, .comment-content h1, .comment-content h2, .entry-content h1, .entry-content h2, .entry-summary h1, .entry-summary h2, .mu_register h2, .page-content h1, .page-content h2, .mu_register h2, .comment-content h3, .entry-content h3, .entry-summary h3, .page-content h3, .entry-meta h3, .comment-content h4, .entry-content h4, .entry-summary h4, .page-content h4, .comment-content h5, .entry-content h5, .entry-summary h5, .page-content h5, .comment-content h6, .entry-content h6, .entry-summary h6, .page-content h6 { color: #033C5A; } /* Tip25b - Disable special icons, that marks the links that will open in a new window */ .entry-content .fa-external-link { display: none; } .page-header a, .page-header a:visited { color: #0773AA; } .page-header a:active, .page-header a:hover { color: #A75523; } /* Tip88 - Customize color scheme: Styles for page titles for categories, tags, etc. */ .page-title { color: #688A9C; } /* 11.2 Post Formats */ /* Aside post format */ article.format-aside h1, article.format-aside h2 { font-size: 18px; color: #033C5A; } article.format-aside h2 a { color: #0073AA; text-decoration: underline; } article.format-aside h2 a:hover { color: #A75523; text-decoration: underline; } article.format-aside .aside { background: #D9D0BB; border-left: 22px solid #AA9868; } article.format-aside p { color: #4A4A4A; } /* Link posts */ article.format-link .entry-content a { text-decoration: underline; } article.format-link header { background-color: #0073AA; color: #f3f3f3; } /* Quote posts */ article.format-quote .entry-content blockquote { background-color: #FCFCFC; border: solid #688A9C; color: #033C5A; } article.format-quote .entry-content blockquote p:first-child:before { color: #033C5A; } /*Status Posts*/ .format-status .entry-header header a, .format-status .entry-header header a:visited { color: #0773AA; } .format-status .entry-header header a:active, .format-status .entry-header header a:focus, .format-status .entry-header header a:hover { color: #A75523; } /* 11.3 Comments */ .comments-area article header time { color: #0073AA; } .comments-area article header a { color: #0073AA; text-decoration: underline; } .comments-area article header a:hover { color: #A75523; } .comments-area article header cite a { color: #0073AA; } .bypostauthor cite .post-author-label { background-color: #FFD400; border: 1px solid #FFD400; color: #033C5A; font-weight: bold; background-image: -webkit-linear-gradient(top, #FFD400, #FFD400); } a.comment-edit-link, a.comment-reply-link { color: #0773AA; } a.comment-edit-link:hover, a.comment-reply-link:hover { color: #A75523; } /* Comment form */ .required { color: #C9102F; } /* 11.4 Page templates */ /* Front page template */ .template-front-page .site-content .widget-area .widget li a { color: #0073AA; text-decoration: underline; } .template-front-page .site-content .widget-area .widget li a:hover { color: #A75523; text-decoration: underline; } /* 12.0 Footer -------------------------------------------------------------- */ .site-footer a { color: #0073AA; } .site-footer a:focus, .site-footer a:hover { color: #A75523; } #site-admin-link { display: none; } .meta-separator { display: none; } /*-------------------------------------------------------------- # Global GW Footer --------------------------------------------------------------*/ .gwfooter_div { display: inline-block; width: 100%; padding: 0 4rem; background-color: #0073AA; } /* SECTIONS */ .gwfooter_section { margin: 20px auto 20px auto; max-width: 1040px; height: 100%; } .gwfooter_div .footer-logof .logo { height: auto; width: 113px; vertical-align: middle; margin-bottom: 3rem; } .gwfooter_section, .gwfooter_section ul li a, .gwfooter_section ul li a:visited, .gwfooter_section label { color: #fff; font-size: 12px; text-decoration: none; font-family: arial; } .gwfooter_section ul li a:active, .gwfooter_section ul li a:hover { text-decoration: underline; } .gwfooter_section ul { list-style: none; } .gwfooter_section .row-one, .gwfooter_section .row-two { position: relative; text-align: right; margin: 0px; float: right; clear: right; } .gwfooter_section .row-three p { float: right; width: 60%; text-align: right; line-height: 1.5em; font-size: 12px; font-family: Arial; margin-top:0; } .gwfooter_section .row-three p a { color: #FFFFFF; } .gwfooter_section .row-three p a:hover, .gwfooter_section .row-three p a:active { border-bottom: 1px dashed #ffffff; } @media (min-width: 1040px) { .gwfooter_section { display: block; } .gwfooter_div .footer-logof .logo { float: left; } .gwfooter_section ul { display: flex; flex-direction: row; white-space: nowrap; padding: 0; margin: 5px 0; text-align: center; float: right; } .gwfooter_section li { margin-left: 7px; } .gwfooter_section .row-three { float: right; width: 80%; text-align: right; margin-top: 5px; } } @media (max-width: 1040px) { .gwfooter_section { display: inline-flex; flex-direction: column; align-items: center; } .gwfooter_section ul { text-align: center; margin-bottom: 0; margin-left: 0; } .gwfooter_section .row-three p { width: 100%; line-height: 1.5; margin: auto; float: none; text-align: center; } .gwfooter_section ul { padding: 0; } .gwfooter_section li { margin: 6px 0; } .gwfooter_div .footer-logof .logo { margin-left: 0; margin-bottom:1rem; } }