/* Mustang Plumbing — combined stylesheet (style + menu). Original theme faithfully reproduced. */
/* ===== Self-hosted webfonts (replaces the Google Fonts <link>) =====
   Served from our own origin so the site renders identically on networks
   that block or slow fonts.googleapis.com. font-display:swap keeps text
   visible while loading. */

@font-face { font-family:'Jost'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/jost-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family:'Jost'; font-style:normal; font-weight:500; font-display:swap; src:url('fonts/jost-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family:'Jost'; font-style:normal; font-weight:700; font-display:swap; src:url('fonts/jost-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family:'Lato'; font-style:normal; font-weight:300; font-display:swap; src:url('fonts/lato-latin-300-normal.woff2') format('woff2'); }
@font-face { font-family:'Lato'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/lato-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family:'Lato'; font-style:italic; font-weight:400; font-display:swap; src:url('fonts/lato-latin-400-italic.woff2') format('woff2'); }
@font-face { font-family:'Lato'; font-style:normal; font-weight:700; font-display:swap; src:url('fonts/lato-latin-700-normal.woff2') format('woff2'); }


@charset "utf-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { font: inherit; padding: 0px; border: 0px; margin: 0px; vertical-align: baseline; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote::before, blockquote::after, q::before, q::after { content: none; }

table { border-collapse: collapse; border-spacing: 0px; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

.clear { clear: both; }

.sticky { }

.bypostauthor { }

.wp-caption { }

.wp-caption-text { }

.gallery-caption { }

.alignright { }

.alignleft { }

.aligncenter { }

*, ::after, ::before { box-sizing: border-box; }

body, html { font-size: 15px; padding: 0px; margin: 0px; overflow-x: hidden; }

.clearfix::before, .clearfix::after { content: " "; display: table; }

.clearfix::after { clear: both; }

body { font-family: Lato, Calibri, Arial, sans-serif; font-weight: 300; line-height: 21px; color: rgb(0, 68, 154); background: rgb(230, 230, 230); }

strong, b { font-weight: 700; }

i, cite, em, var, address, dfn { font-style: italic; }

blockquote, q { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; color: rgb(112, 175, 255); margin: 0px 0px 1em; padding: 1em; text-transform: uppercase; }

blockquote > p, q > p { margin: 0px; }

blockquote::before { content: "���"; font-size: 3.5em; font-family: inherit; color: rgb(112, 175, 255); speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; float: left; position: relative; top: -0.15em; margin-right: 0.3em; -webkit-font-smoothing: antialiased; }

a { color: rgb(208, 101, 3); text-decoration: none; }

a:hover { color: rgb(233, 147, 26); }

a:hover img { opacity: 0.8; }

img { max-width: 100%; height: auto; }

#container, footer { }

#container, #wrapper > header { width: 100%; margin: 0px auto; }

#container { max-width: 64em; min-height: 40em; }

#wrapper > header { text-align: center; font-size: 16px; padding: 0px; max-width: 60em; position: relative; }

#wrapper > header h1 { font-size: 2.625em; line-height: 1.3; margin: 0px; font-weight: 300; }

#wrapper > header p#site-description { margin: 0px; }

#menu { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; background: rgb(0, 95, 217); border-bottom: 5px solid rgb(0, 68, 154); color: rgb(255, 255, 255); padding: 0px; position: relative; z-index: 1; }

#branding { margin: 1.5em auto 1.5em 0px; float: left; position: relative; z-index: 1; }

#site-title a { width: 331px; height: 113px; text-indent: -9999px; display: block; background: url("images/mustang-logo.png") no-repeat; }

#site-title-gradient-container { position: relative; z-index: 0; }

#site-title-gradient { opacity: 0.99; position: absolute; left: -230px; top: -75px; width: 750px; height: 300px; background: radial-gradient(rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0) 100%); }

#phone-number { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-size: 3em; color: rgb(0, 95, 217); margin-top: 0.8em; float: right; width: 40%; height: 0.64em; text-align: right; }

#call-to-action { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; display: block; float: right; }

#call-to-action span { font-weight: 700; }

#call-to-action span.icon-arrow-right { font-weight: normal; margin-left: 0.25em; font-size: 1.25em; position: relative; top: 5px; }

#call-to-action a { position: relative; color: rgb(255, 255, 255); background-color: rgb(217, 117, 0); font-size: 2em; text-transform: uppercase; padding: 0.25em; border-radius: 8px; box-shadow: rgb(113, 61, 0) 0px 5px 0px; width: auto; text-align: center; transition: 0.1s; }

#call-to-action a:hover { box-shadow: rgb(113, 61, 0) 0px 1px 0px; position: relative; top: 6px; }

a.button, #container form input[type="submit"] { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-weight: normal; position: relative; color: rgb(255, 255, 255); background-color: rgb(217, 117, 0); font-size: 1.5em; text-transform: uppercase; padding: 0.25em; border-radius: 8px; box-shadow: rgb(113, 61, 0) 0px 5px 0px; width: auto; text-align: center; transition: 0.1s; }

a.button:hover, #container form input[type="submit"]:hover { box-shadow: rgb(113, 61, 0) 0px 1px 0px; position: relative; top: 6px; }

#banner-area { clear: both; max-width: 960px; background: rgb(0, 95, 217); color: rgb(255, 255, 255); margin: 0px auto; border-top: 3px solid rgb(0, 68, 154); position: relative; z-index: 1; }

.ribbon, .ribbon * { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; box-sizing: border-box; }

.ribbon { position: absolute; top: 1.5em; left: 1em; }

.ribbon h3 { display: block; margin: 0px; padding: 0.5em 1em 0.5em 1.5em; position: relative; left: -30px; float: left; color: white; background: rgb(0, 95, 217); }

.ribbon h3 span { font-weight: 700; }

.ribbon h3::before { content: ""; display: block; width: 0px; height: 0px; position: absolute; bottom: -11px; z-index: 10; left: 0px; }

.ribbon.round h3 { border-radius: 10px 0px 0px; }

.ribbon.round h3::before, .ribbon.round h3::after { width: 15px; height: 15px; bottom: -15px; border-width: 2px medium medium; border-style: solid none none; border-color: rgb(0, 68, 154) currentcolor currentcolor; border-image: none; background: rgb(0, 68, 154); border-radius: 10px 0px 0px 10px; }

.ribbon-corner { width: 15px; height: 15px; background: rgb(0, 95, 217); position: absolute; left: -15px; top: 65px; }

#home-banner img { display: block; }

#banner-cta { font-size: 1.15em; font-weight: 700; padding: 1.25em 1.5em; background: rgb(0, 95, 217); border-top: 3px solid rgb(0, 68, 154); border-bottom: 3px solid rgb(0, 68, 154); float: left; width: 100%; }

#banner-cta #banner-cta-text { float: left; width: 67%; }

#banner-cta #banner-cta-text span { font-family: "Times New Roman", Times, serif; font-style: italic; font-weight: normal; font-size: 1.2em; }

#banner-cta #banner-cta-button { float: right; position: relative; top: 5px; }

#home-three-box { clear: both; float: left; margin: 1.5em 0px 1.75em; }

#home-three-box .icon-office { position: relative; left: -0.5em; }

#home-three-box .icon-wrench::before { position: relative; left: -0.5em; }

#home-three-box .icon-hard-hat::before { position: relative; left: -0.5em; }

#home-three-box #box-one, #home-three-box #box-two, #home-three-box #box-three { width: 31.55%; background: rgb(0, 95, 217); float: left; }

#home-three-box a { color: rgb(255, 255, 255); transition: 0.5s; }

#home-three-box:hover a { opacity: 0.5; }

#home-three-box a:hover { opacity: 1; }

#home-three-box #box-one { margin-right: 1.5em; }

#home-three-box #box-two { }

#home-three-box #box-three { float: right; width: 31.8%; }

#home-three-box .three-box-header { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-size: 2em; text-transform: uppercase; padding: 0.75em; text-align: center; border-top: 3px solid rgb(0, 68, 154); border-bottom: 3px solid rgb(0, 68, 154); }

#home-three-box .three-box-content { padding: 1em 1.5em; background: rgb(63, 147, 255); }

h1 { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; clear: both; font-size: 2.5em; line-height: 0.85em; text-transform: uppercase; padding: 0px 0px 0.65em; }

h2 { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; clear: both; font-size: 2.5em; line-height: normal; text-transform: uppercase; padding: 0.5em 0px 0.8em; }

h3 { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; clear: both; font-size: 2em; line-height: normal; text-transform: uppercase; padding: 0.5em 0px; }

h2.entry-title { font-size: 20px; text-transform: uppercase; }

body.category-reviews h2.entry-title { font-size: 1.25em; padding: 0px; text-transform: uppercase; position: absolute; right: 1.5em; bottom: 1em; }

body.category-reviews .post:nth-child(2n+1) { background: rgb(248, 248, 248); padding: 2em; }

body.category-reviews .post:nth-child(2n) { background: rgb(252, 252, 252); padding: 2em; }

p { margin-bottom: 1em; }

#container #content { width: 100%; padding: 1.5em; }

#container #sidebar_content { width: 65%; padding: 2em 2em 1.5em 1.75em; float: left; clear: both; position: relative; background: rgb(255, 255, 255); border-top: 3px solid rgb(204, 204, 204); overflow: hidden; }

#container div.thumbnail-container { margin-bottom: 2em; }

#container div.thumbnail-container img { max-width: 100%; height: auto; display: block; }

#container .video { position: relative; background: rgb(255, 255, 255); display: block; }

#container .video:hover img.wp-post-image { opacity: 0.8; }

#container .video span { color: rgb(255, 255, 255); font-size: 7.5em; line-height: 0px; left: 43%; position: absolute; top: 49%; z-index: 2; }

#container .video:hover span { opacity: 0.8; }

#container .navigation a { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-weight: normal; position: relative; color: rgb(255, 255, 255); background-color: rgb(217, 117, 0); font-size: 1.5em; text-transform: uppercase; padding: 0.35em; margin-top: 1em; border-radius: 8px; box-shadow: rgb(113, 61, 0) 0px 5px 0px; width: auto; text-align: center; transition: 0.1s; }

#container .navigation a:hover { box-shadow: rgb(113, 61, 0) 0px 1px 0px; position: relative; top: 6px; }

#container .navigation .nav-previous a { float: left; margin: 1em 0px 0.25em; }

#container .navigation .nav-next a { float: right; margin: 1em 0px 0.25em; }

#container .entry-meta { font-size: 12px; font-style: italic; color: rgb(102, 102, 102); }

#container .entry-footer { font-size: 12px; margin-bottom: 2em; background: rgb(239, 239, 239); padding: 1em 2em; clear: both; }

#content ul, #sidebar_content ul { }

#content ul li, #sidebar_content ul li { font-size: 1.25em; line-height: 1.75em; font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; background: url("images/check.gif") 0px 3px no-repeat; list-style: none; margin: 0px 1.5em 0px 0px; padding-left: 2em; text-transform: uppercase; float: left; width: 45%; }

ol { list-style: none; font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; color: rgb(27, 181, 27); margin-top: 2em; }

ol li { counter-increment: item 1; }

ol li { font-size: 15px; clear: both; }

ol li::before { content: counter(item); font-size: 6em; line-height: 1em; float: left; margin-right: 0.2em; padding: 0px; position: relative; top: -0.15em; }

ol li em { display: block; text-transform: uppercase; font-size: 2em; font-style: normal; }

form div.wpcf7-response-output { margin: 2em 0px; padding: 0px; color: rgb(0, 95, 217); }

#sidebar form div.wpcf7-response-output { margin: 2em 0px 0px; padding: 0px; color: rgb(255, 255, 255); }

form div.wpcf7-mail-sent-ok { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }

form div.wpcf7-mail-sent-ng { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }

form div.wpcf7-spam-blocked { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }

form div.wpcf7-validation-errors { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }

.categories { margin-bottom: 2em; }

.categories li a::before { content: "��� "; }

.categories li a { width: 100%; display: block; font-size: 15px; text-decoration: none; text-transform: uppercase; color: rgb(249, 249, 249); padding: 10px 20px 5px; background: rgb(208, 101, 3); border-bottom: 5px solid rgb(174, 78, 1); }

.categories li a:hover { color: rgb(239, 239, 239); background: rgb(174, 78, 1); }

.categories li:nth-child(2) a { background: rgb(233, 147, 26); border-bottom: 5px solid rgb(191, 117, 20); }

.categories li:nth-child(2) a:hover { background: rgb(191, 117, 20); }

.categories li:nth-child(3) a { background: rgb(22, 145, 190); border-bottom: 5px solid rgb(10, 96, 130); }

.categories li:nth-child(3) a:hover { background: rgb(10, 96, 130); }

.categories li:nth-child(4) a { background: rgb(22, 107, 162); border-bottom: 5px solid rgb(10, 75, 117); }

.categories li:nth-child(4) a:hover { background: rgb(10, 75, 117); }

.categories li:nth-child(5) a { background: rgb(27, 54, 71); border-bottom: 5px solid rgb(16, 34, 44); }

.categories li:nth-child(5) a:hover { background: rgb(16, 34, 44); }

.post { clear: both; position: relative; overflow: hidden; }

.post .icon-quotes-left { font-size: 3.5em; position: absolute; color: rgb(112, 175, 255); top: 0.5em; left: 0.55em; }

.post .entry-summary { float: left; padding-left: 5.5em; color: rgb(112, 175, 255); }

.no-separator { padding: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }

a.more-link { float: right; clear: both; margin-bottom: 2em; display: block; font-size: 12px; text-decoration: none; text-transform: uppercase; color: rgb(249, 249, 249); padding: 5px 10px; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(233, 147, 26)), to(rgb(208, 101, 3))); }

a.more-link:hover { color: rgb(239, 239, 239); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgb(208, 101, 3)), to(rgb(233, 147, 26))); }

a.more-link::before { content: "��� "; }

#sidebar { float: right; width: 31.8%; margin: 0px 0px 1.5em; padding: 1.5em; background: rgb(0, 95, 217); border-top: 3px solid rgb(0, 68, 154); color: rgb(255, 255, 255); }

h3.widget-title { font-size: 30px; text-transform: uppercase; padding: 0px 0px 1em; }

.widget-container { margin-bottom: 2em; clear: both; }

#sidebar ul li:last-child { margin-bottom: 0px; }

#sidebar form input[type="submit"] { margin-bottom: 7px; float: right; }

#sidebar form { overflow: hidden; }

#sidebar form { color: rgb(0, 95, 217); }

#sidebar form p { margin-bottom: 0.5em; }

#sidebar li input[type="image"], #sidebar input[type="checkbox"] { width: auto; }

#sidebar input { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-size: 0.8em; display: inline; width: 32em; max-width: 100%; height: auto; padding: 0.75em; background: rgb(230, 230, 230); text-transform: uppercase; color: rgb(0, 95, 217); border-radius: 5px; }

#sidebar textarea { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-size: 0.8em; display: inline; width: 40em; max-width: 100%; height: auto; padding: 0.75em; background: rgb(230, 230, 230); text-transform: uppercase; color: rgb(0, 95, 217); border-radius: 5px; }

#sidebar .shareaholic-share-buttons-container ul.shareaholic-share-buttons { margin: 0px !important; padding: 0px !important; }

input { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-size: 0.8em; display: inline; width: 20em; max-width: 100%; height: auto; padding: 0.75em; background: rgb(230, 230, 230); text-transform: uppercase; color: rgb(0, 95, 217); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 5px; appearance: none; }

textarea { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-size: 0.8em; width: 30em; max-width: 100%; display: block; padding: 0.75em; background: rgb(230, 230, 230); text-transform: uppercase; color: rgb(0, 95, 217); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 5px; }

input[type="checkbox"] { width: auto; margin-right: 0.75em; appearance: checkbox; }

.checkbox span { margin-right: 0.75em; }

#searchform input { display: inline; width: 40%; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }

input[type="image"] { width: auto; }

p.comment-form-author, p.comment-form-email, p.comment-form-url { margin-bottom: 0.5em; }

footer { background: rgb(73, 73, 73); font-weight: 300; color: rgb(255, 255, 255); width: 100%; text-transform: uppercase; border-top: 3px solid rgb(45, 44, 44); }

footer #footer-container { max-width: 960px; margin: 0px auto; padding: 2em 0px; }

footer #footer-left { float: left; }

footer #footer-right { float: right; }

footer nav { float: left; }

footer nav li { float: left; padding: 0px 0.5em; line-height: 0.9em; letter-spacing: -1px; border-right: 1px solid rgb(255, 255, 255); }

footer nav li:first-child { padding-left: 0px; }

footer nav li:last-child { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }

footer nav li a { font-size: 1em; font-weight: 300; position: relative; top: -1px; }

footer #copyright { font-size: 0.75em; float: left; clear: both; }

footer #footer-phone { font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; font-size: 2.5em; line-height: 1em; text-align: right; display: block; }

footer #footer-address { text-align: right; font-size: 0.75em; line-height: 1.4em; clear: both; display: block; }

footer a { font-weight: 700; color: rgb(255, 255, 255); }

fppter a:hover { color: rgb(204, 204, 204); }

@media (max-width: 55.5em) {
  #home-three-box .three-box-header { font-size: 1.45em; }
}

@media (max-width: 49.938em) {
  body { padding: 0px; }
  h1 { padding: 0px; margin: 0.25em 0px 1em; }
  #container #sidebar_content { width: 100%; float: none; }
  #sidebar { width: 100%; clear: both; padding: 2em; }
  #sidebar input { background: rgb(239, 239, 239); box-shadow: none; }
  #sidebar form input[type="submit"] { float: none; margin-top: 1em; }
  #sidebar h3.widget-title { padding: 0px; margin: 0.25em 0px 1em; }
  footer #footer-container { padding: 1.5em 0px; }
  footer #copyright { margin: 2em 0px; text-align: center; float: none; }
  footer #footer-left, footer #footer-right { float: none; }
  footer nav { float: none; }
  footer nav li { float: none; padding: 0px 0.5em; line-height: 1em; letter-spacing: -1px; border-right-width: medium; border-right-style: none; border-right-color: currentcolor; width: 100%; text-align: center; }
  footer #footer-phone { text-align: center; margin: 0px auto; }
  footer #footer-address { text-align: center; margin: 0px auto; }
}

@media (min-width: 32.5em) and (max-width: 49.938em) {
  #wrapper header { padding: 0px 1.25em; }
  #call-to-action a { font-size: 1.45em; }
  #phone-number { font-size: 2.25em; margin-top: 1.3em; height: 0.9em; }
}

@media (min-width: 32.5em) and (max-width: 40em) {
  #branding { float: none; margin: 2em auto; }
  #branding a { margin: 0px auto; }
  #phone-number { float: none; margin: 0px auto; text-align: center; height: 1em; }
  #call-to-action { float: none; margin: 0px auto 2.25em; }
  #site-title-gradient-container { display: none; }
  .ribbon, .round, .ribbon-corner { display: none; }
  #banner-cta #banner-cta-text { float: none; width: 100%; }
  #banner-cta #banner-cta-button { float: none; top: 0px; }
  #banner-cta #banner-cta-button a { width: 8em; display: block; margin: 1em auto 0.5em; }
  #home-three-box #box-one, #home-three-box #box-two, #home-three-box #box-three { width: 100%; background: rgb(0, 95, 217); }
  #home-three-box #box-one { margin: 0px 0px 1.5em; }
  #home-three-box #box-two { margin: 0px 0px 1.5em; }
  #home-three-box .three-box-header { font-size: 1.75em; }
}

@media (max-width: 32.438em) {
  #branding { float: none; margin: 2em auto; }
  #branding a { margin: 0px auto; }
  #phone-number { float: none; margin: 0px auto; text-align: center; height: 1em; font-size: 2.25em; width: 100%; }
  #call-to-action { float: none; margin: 0px auto 2.25em; }
  #call-to-action a { font-size: 1.5em; }
  #site-title-gradient-container { display: none; }
  .ribbon, .round, .ribbon-corner { display: none; }
  #banner-cta #banner-cta-text { float: none; width: 100%; }
  #banner-cta #banner-cta-button { float: none; top: 0px; }
  #banner-cta #banner-cta-button a { width: 8em; display: block; margin: 1em auto 0.5em; }
  #home-three-box #box-one, #home-three-box #box-two, #home-three-box #box-three { width: 100%; background: rgb(0, 95, 217); }
  #home-three-box #box-one { margin: 0px 0px 1.5em; }
  #home-three-box #box-two { margin: 0px 0px 1.5em; }
  #home-three-box .three-box-header { font-size: 1.75em; }
}

/* ===== menu.css ===== */
@charset "utf-8";

.nav ul { max-width: 960px; margin: 0px auto; padding: 0px; list-style: none; font-size: 2em; }

.nav li span { display: block; }

.nav a { display: block; color: rgba(249, 249, 249, 0.9); text-decoration: none; transition: color 0.5s, background 0.5s; }

.nav i { transform: translate3d(0px, 0px, 0px); }

a, button { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

.no-touch .nav ul:hover a { color: rgba(249, 249, 249, 0.5); }

.no-touch .nav ul:hover a:hover { color: rgba(249, 249, 249, 0.99); }

@media (min-width: 50em) {
  .nav li { float: left; text-align: center; padding: 0.5em 2.4%; text-transform: uppercase; }
  .nav ul li:first-child { text-align: left; padding-left: 0px; }
  .nav ul li:last-child { text-align: right; padding-right: 0px; }
  .nav a { display: block; width: auto; }
}

@media (min-width: 59em) and (max-width: 61.25em) {
  .nav ul { font-size: 1.9em; padding-left: 1em; }
}

@media (min-width: 55.5em) and (max-width: 59em) {
  .nav ul { font-size: 1.8em; padding-left: 1.25em; }
}

@media (min-width: 52.5em) and (max-width: 55.5em) {
  .nav ul { font-size: 1.65em; padding-left: 1.25em; }
}

@media (min-width: 50em) and (max-width: 52.5em) {
  .nav ul { font-size: 1.6em; padding-left: 1.25em; }
}

@media (max-width: 49.938em) {
  .no-touch .nav ul li a:hover, .no-touch .nav ul li a:active, .no-touch .nav ul li a:focus { background: rgb(227, 119, 20); }
  .nav ul li { text-transform: uppercase; transition: background 0.5s; }
}

@media (min-width: 32.5em) and (max-width: 49.938em) {
  .nav li { display: block; float: left; width: 50%; }
  .nav a { padding: 0.8em; text-align: center; }
}

.nav .navtoogle { display: none; width: 100%; padding: 0.5em 0.5em 0.8em 1em; font-family: 'Jost', 'Century Gothic', 'Futura-web', Calibri, Arial, sans-serif; text-transform: uppercase; text-align: left; color: rgb(7, 16, 15); font-size: 1.6em; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; }

.navtoogle i { z-index: -1; }

.icon-menu { position: relative; top: 8px; line-height: 0; font-size: 1.6em; }

@media (max-width: 49.938em) {
  .nav .navtoogle { margin: 0px; display: block; color: rgb(249, 249, 249); }
  .no-js .nav ul { max-height: 30em; overflow: hidden; }
  .js .nav ul { max-height: 0em; overflow: hidden; }
  .js .nav .active + ul { max-height: 30em; overflow: hidden; border-top: 5px solid rgb(0, 68, 154); padding: 0.5em; transition: max-height 0.4s; }
  .nav a { padding: 0.5em; }
  .touch .nav a { padding: 0.8em; }
}

/* ===== Icon (SVG) helpers — replaces original custom icon font ===== */
.svg-icon { display:inline-block; vertical-align:middle; width:1em; height:1em; fill:currentColor; }
#call-to-action .svg-icon, .button .svg-icon { width:0.9em; height:0.9em; margin-left:0.25em; position:relative; top:2px; }
.three-box-header .svg-icon { width:1em; height:1em; margin-right:0.35em; position:relative; top:-2px; }
.navtoogle .svg-icon { width:1.1em; height:1.1em; position:relative; top:6px; margin-right:0.25em; }

/* Map fields layout tweaks */
#container iframe.map-embed { width:100%; max-width:400px; height:300px; border:0; }

/* Datetime field on schedule page */
#container input[type="datetime-local"], #sidebar input[type="datetime-local"] { }

/* Ensure headings use Jost weight */
h1,h2,h3, .three-box-header, #phone-number, #call-to-action, .ribbon h3, #footer-phone { font-weight:500; }

/* Form validation + status messages */
.form-status { margin:1em 0 0; padding:0; font-weight:400; }
.form-status.success { color: rgb(27,181,27); }
.form-status.error { color: #d94141; }
#sidebar .form-status.success { color:#c9ffcf; }
#sidebar .form-status.error { color:#ffd7d7; }
.field-error { outline:2px solid #d94141 !important; }

/* ===== Simple Share buttons (replaces third-party Shareaholic widget) ===== */
.mp-share { list-style:none; margin:0; padding:0; overflow:hidden; }
.mp-share li { float:left; margin:0 8px 8px 0; }
.mp-share a { display:flex; align-items:center; gap:6px; padding:7px 12px; border-radius:4px; color:#fff !important; font-size:13px; font-weight:400; text-transform:none; }
.mp-share a:hover { opacity:0.88; }
.mp-share .svg-icon { width:16px; height:16px; }
.mp-share .s-facebook { background:#1877f2; }
.mp-share .s-twitter  { background:#000; }
.mp-share .s-linkedin { background:#0a66c2; }
.mp-share .s-email    { background:#7d7d7d; }

/* =====================================================================
   LAYOUT CORRECTIONS
   Fixes for button/heading formatting drift vs. the original WordPress
   site. Kept in one block at the end of the file so they are easy to
   review or revert. Everything here is an override — nothing above was
   deleted.
   ===================================================================== */

/* --- 1. Header: stop the CTA button colliding with the phone number ---
   The original used `height:.64em` on #phone-number as a hack to pull the
   button up underneath it. That collapses the moment the heading font
   renders even slightly taller, which is what caused the overlap. Give
   the phone its real height and let the button clear it instead. */
#phone-number { height: auto; line-height: 1; margin-bottom: 0.15em; }
#call-to-action { clear: right; }

/* --- 2. Buttons size to their text ---
   `#sidebar input` sets width:32em, which also hit the submit buttons and
   clipped their labels. Buttons should hug their content. */
#call-to-action a,
a.button,
#container form input[type="submit"],
#sidebar form input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: 100%;
  padding: 0.3em 0.55em;
  white-space: nowrap;
  line-height: 1.1;
  border: 0;
  cursor: pointer;
}
/* Submit inputs can't be flex containers in every browser — keep them inline-block. */
#container form input[type="submit"],
#sidebar form input[type="submit"] { display: inline-block; }

/* Sidebar submit: don't inherit the 32em text-input width. */
#sidebar form input[type="submit"] {
  font-size: 1.25em;
  width: auto;
  background: rgb(217, 117, 0);
  color: #fff;
}

/* --- 3. Arrow glyphs: match the weight of the original icon font ---
   The replacement SVGs were thin 2.4px strokes at 0.9em, which read as
   faint next to the original's solid arrow. CSS beats the inline
   presentation attribute, so this thickens them without touching markup. */
#call-to-action .svg-icon,
.button .svg-icon,
#banner-cta-button .svg-icon { width: 1em; height: 1em; top: 0; margin-left: 0.35em; }
#call-to-action .svg-icon path,
.button .svg-icon path,
#banner-cta-button .svg-icon path { stroke-width: 3.2; }

/* --- 4. Headings: keep them inside their boxes ---
   Sized so the longest label ("SERVICE & REPAIRS") fits on one line within
   the ~283px of usable box width in BOTH Jost and the Century Gothic
   fallback, since the two differ in width by roughly 20%. Wrapping is
   allowed rather than forced off — an overflowing nowrap spills outside
   the coloured box, which is worse than a second line. min-height keeps
   the three boxes level if one does wrap. */
#home-three-box .three-box-header {
  font-size: 1.5em;
  white-space: normal;
  overflow-wrap: break-word;
  min-height: 2.9em;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.15em;
  padding: 0.5em 0.4em;
  line-height: 1.1;
}
#home-three-box .three-box-header .svg-icon { flex: 0 0 auto; margin-right: 0.2em; }
@media (max-width: 61em)   { #home-three-box .three-box-header { font-size: 1.35em; } }
@media (max-width: 55.5em) { #home-three-box .three-box-header { font-size: 1.15em; } }
/* Below the 3-across breakpoint the boxes are full width — plenty of room. */
@media (max-width: 40em)   { #home-three-box .three-box-header { font-size: 1.75em; min-height: 0; } }

/* Sidebar widget titles sit in a ~278px column; 30px overflowed. */
h3.widget-title { font-size: 26px; }
@media (max-width: 49.938em) { h3.widget-title { font-size: 30px; } }

/* --- 5. Share buttons: compact icon tiles, one row (as the original) ---
   These were rendering as wide labelled pills that wrapped onto two rows.
   font-size:0 hides the label text while keeping it available to
   screen readers via the existing aria-label. */
.mp-share a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  gap: 0;
  font-size: 0;
  border-radius: 3px;
}
.mp-share .svg-icon { width: 22px; height: 22px; }
.mp-share li { margin: 0 6px 6px 0; }

/* --- 6. Header nav: a single row at desktop widths ---
   Five items now that SMS Privacy Policy has moved to the footer only.
   Laid out as a flex row so the items distribute across the 960px bar
   instead of floating and wrapping. The font size is set so the full set
   — "RESIDENTIAL NEW CONTRUCTION" being by far the longest — fits on one
   line in BOTH Jost and the wider Century Gothic fallback. Padding is a
   fixed em value rather than a percentage so it scales with the text. */
@media (min-width: 50em) {
  .nav ul {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    font-size: 1.5em;
    padding: 0;
  }
  .nav li {
    float: none;
    flex: 0 1 auto;
    padding: 0.5em 0.5em;
    white-space: nowrap;
    min-width: 0;
  }
  .nav ul li:first-child { padding-left: 0; }
  .nav ul li:last-child  { padding-right: 0; }
}
/* The original per-width font steps are superseded by the above. */
@media (min-width: 50em) and (max-width: 61.25em) {
  .nav ul { font-size: 1.32em; padding: 0 0.75em; }
}