/*
Theme Name: Betheme Child
Theme URI: https://themes.muffingroup.com/betheme
Author: Muffin group
Author URI: https://muffingroup.com
Description: Child Theme for Betheme
Template: betheme
Version: 1.6.2
*/

/* =====================================================================
   ABC Landscape Construction: the STRYV (YOOtheme Warp + WidgetKit) design, ported to Betheme.
   Layout, spacing, backgrounds and card borders live in BeBuilder (section/wrap
   settings and each element's Advanced > Margin). Fonts, colours and buttons live in
   Theme Options. This file holds type and component looks only, through these classes:

   Set in a section's or wrap's "Classes" field
     abc-hero             banner sections (home, inner pages, blue rule under them)
     abc-hero-inner       inner page banner (image only)
     abc-parallax         home "Get in Touch" parallax strip
     abc-clients          home "What We Do For Our Clients" band
     abc-callout          home icon + label columns
     abc-service          services page tile column
     abc-video            videos page column
     abc-form             contact page column holding the Gravity Form
     abc-card             bordered panel wrap (contact page)
     abc-footer           footer template: main band
     abc-copyright-band   footer template: copyright strip

   Set in an element's "Custom CSS class" field
     abc-page-title       page title with the leaf ornament and rule (any heading)
     abc-hero-title       big white uppercase banner title
     abc-lead / abc-lead-small   large intro paragraph (22px / 20px)
     abc-panel-title      blue serif sub-title (h2)
     abc-callout-icon / abc-callout-title   home icon columns
     abc-checks           list with the green check (image set in the List element)
     abc-checks-tight     the denser services list
     abc-service-img / abc-service-title    services tiles
     abc-gallery          projects galleries
     abc-video-player / abc-video-title     videos page
     abc-card-title / abc-card-text / abc-social   contact panels
     abc-footer-title / abc-footer-text / abc-social-footer / abc-footer-menu / abc-hours / abc-copyright / abc-stryv
   ===================================================================== */

:root {
	--abc-green: #9DC53B;
	--abc-blue: #199AD7;
	--abc-brown: #3F3A34;
	--abc-ink: #363636;
	--abc-taupe: #847A6D;
	--abc-rule: #E6E6E6;
	--abc-black: "Nunito Sans", Helvetica, Arial, sans-serif;
}

/* ---------- header ---------- */
#Action_bar { font-size: 14px; }
#Action_bar .contact_details li { padding-right: 6px; }
#Action_bar .contact_details .slogan { order: 2; }
#Action_bar .social-menu a, #Action_bar .social li a { font-size: 14px; color: #fff; }
@media (max-width: 767px) { #Action_bar { display: none !important; } }
#Top_bar .menu > li > a span:not(.description) { text-transform: uppercase; padding: 0 20px; }
#Top_bar .menu > li:last-child > a span:not(.description) { padding-right: 0; }
#Top_bar .menu > li:hover > a span:not(.description) { color: #1999D6; }
#Top_bar .menu > li > a span:not(.description)::after { display: none; }

/* ---------- buttons: lowercase serif, as the old UIkit buttons ---------- */
.button, a.button, input[type="submit"], .gform_wrapper .gform_button { text-transform: lowercase; }

/* ---------- banners ---------- */
.mcb-section.abc-hero { border-bottom: 4px solid var(--abc-blue); }
.abc-hero-title .title {
	font-family: var(--abc-black); font-weight: 900; color: #fff; text-transform: uppercase;
	font-size: 60px; line-height: 72px; letter-spacing: 2px; text-shadow: 0 2px 5px rgba(0, 0, 0, .5);
}
@media (max-width: 767px) { .abc-hero-title .title { font-size: 26px; line-height: 32px; } }

/* ---------- page titles: leaf between two soft rules ---------- */
.abc-page-title .title { position: relative; padding-top: 56px; color: var(--abc-brown); }
.abc-page-title h2.title { color: var(--abc-blue); }
.abc-page-title .title::before {
	content: ""; position: absolute; left: 50%; top: 0; transform: translateX(-50%); z-index: 2;
	width: 60px; height: 31px; background: #fff url("images/title_bg.png") no-repeat 50% 0;
}
.abc-page-title .title::after {
	content: ""; position: absolute; left: 50%; top: 15px; transform: translateX(-50%);
	width: 300px; max-width: 80%; height: 2px; background: var(--abc-rule);
}

/* ---------- body copy ---------- */
.abc-lead p, .abc-lead .column_attr { font-size: 22px; line-height: 30px; }
.abc-lead-small p, .abc-lead-small .column_attr { font-size: 20px; line-height: 28px; }
.abc-panel-title .title { color: var(--abc-blue); }
@media (max-width: 767px) { .abc-lead p { font-size: 20px; line-height: 28px; } }

/* ---------- lists with the green check ---------- */
.column.abc-checks .mfn-list .mfn-list-item { margin: 0; padding: 10px 0; font-size: 22px; line-height: 30px; align-items: flex-start; }
.abc-checks .mfn-list-icon { width: 20px; min-width: 20px; margin: 5px 15px 0 0; }
.abc-checks .mfn-list-icon img { width: 20px; height: 20px; }
.column.abc-checks-tight .mfn-list .mfn-list-item { padding: 6px 0; font-size: 20px; line-height: 20px; }
.column.abc-checks-tight .mfn-list-icon { margin-top: 0; }


/* ---------- home ---------- */
.abc-callout-title .title { font-family: var(--abc-black); font-weight: 900; text-transform: uppercase; font-size: 20px; line-height: 24px; letter-spacing: 1px; }
.abc-callout-title .title a, .abc-callout-title a { color: #222; }
.abc-callout-title .title a:hover { color: var(--abc-blue); }

/* ---------- services ---------- */
.abc-service-img .image_frame { border: 5px solid #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .5); overflow: visible; }
.abc-service-img .image_frame .image_wrapper { overflow: hidden; }
.abc-service-title .title { font-size: 20px; line-height: 26px; color: #222; }
.mcb-wrap.abc-service > .mcb-wrap-inner { padding-left: 8px; padding-right: 8px; }
.mcb-wrap.abc-service .column_attr p { margin: 0; }

/* ---------- projects ---------- */
.abc-gallery .gallery-item { padding: 0 5px 10px; box-sizing: border-box; }
.abc-gallery .gallery-item .gallery-icon { padding: 0; border: 0; background: none; }

/* ---------- videos ---------- */
.abc-video-player { max-width: 480px; margin-left: auto !important; margin-right: auto !important; }
.abc-video-title .title { font-size: 24px; line-height: 29px; color: #222; }
@media (max-width: 767px) { .abc-video-title .title { font-size: 20px; line-height: 26px; } }

/* ---------- contact ---------- */
.abc-card-title .title { font-size: 24px; line-height: 29px; color: #222; }
.abc-card-text p, .abc-card-text .column_attr { color: #666; }
.abc-card-text strong { color: var(--abc-ink); font-weight: 700; }
.abc-social .mfn-icon-2, .abc-social a { font-size: 24px; width: auto; height: auto; line-height: 1; border: 0; background: none; }
.abc-social .mfn-icon-2 i, .abc-social a i { color: var(--abc-green); transition: color .2s ease; }
.abc-social a:hover i { color: var(--abc-blue); }
.abc-form .gform_wrapper .gfield_label { font-weight: 700; font-size: 20px; color: var(--abc-ink); }
.abc-form .gform_wrapper .gfield_required { color: #790000; }
.abc-form .gform_wrapper.gravity-theme .gform_fields { grid-row-gap: 16px; }
.abc-card-text a { word-break: normal; overflow-wrap: normal; }
@media (max-width: 767px) { .abc-card-text a { overflow-wrap: anywhere; } }
.abc-form .gform_wrapper .gform_button, .abc-form .gform_wrapper input[type="submit"] {
	background: var(--abc-green); color: #fff; border: 0; border-radius: 0; padding: 17px 42px; line-height: 16px;
	font: 400 15px/16px "Libre Baskerville", serif; letter-spacing: 1px; cursor: pointer; transition: background-color .2s ease;
}
.abc-form .gform_wrapper .gform_button:hover, .abc-form .gform_wrapper input[type="submit"]:hover { background: var(--abc-brown); }

/* ---------- footer template ---------- */
.abc-footer .abc-footer-title .title { color: #fff; font-size: 24px; line-height: 29px; position: relative; padding-bottom: 20px; }
.abc-footer .abc-footer-title .title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 80px; height: 2px; background: var(--abc-green); }
.abc-footer-text p, .abc-footer-text .column_attr { color: var(--abc-taupe); margin: 0; }
.abc-social-footer .mfn-icon-2 i, .abc-social-footer a i { color: var(--abc-taupe); font-size: 18px; }
.abc-social-footer a:hover i { color: var(--abc-green); }
.abc-footer-menu .mfn-footer-menu { margin: 0; }
.abc-footer-menu .mfn-footer-menu > li { display: block; margin: 0; }
.mfn-footer .abc-footer-menu .mfn-footer-menu > li > a { display: block; padding: 5px 0; color: var(--abc-taupe); font-size: 16px; line-height: 22px; letter-spacing: 1px; font-weight: 300; }
.mfn-footer .abc-footer-menu .mfn-footer-menu > li > a:hover, .mfn-footer .abc-footer-menu .mfn-footer-menu > li.current-menu-item > a { color: #fff; }
.abc-footer-menu .sub-menu { display: none; }
.column.abc-hours .opening_hours { background: none; padding: 0; border: 0; text-align: left; }
.column.abc-hours .opening_hours .opening_hours_wrapper { background: none; padding: 0; border: 0; }
.column.abc-hours .opening_hours .opening_hours_wrapper ul { margin: 0; padding: 0; list-style: none; }
.column.abc-hours .opening_hours .opening_hours_wrapper li { display: flex; padding: 4px; margin: 0; border: 0; background: none; text-align: left; }
.column.abc-hours .opening_hours .opening_hours_wrapper li label,
.column.abc-hours .opening_hours .opening_hours_wrapper li span { flex: 0 0 41%; margin: 0; padding: 0; border: 0; line-height: 28px; font-size: 20px; font-weight: 300; color: var(--abc-taupe); background: none; }
.column.abc-hours .opening_hours .opening_hours_wrapper li span { flex: 1 1 auto; }
.column.abc-hours .opening_hours .title, .column.abc-hours .opening_hours .ohw-desc { display: none; }
.abc-copyright-band .section_wrapper { border-top: 1px solid var(--abc-taupe); padding-top: 40px; }
.abc-copyright p, .abc-copyright .column_attr { color: var(--abc-green); font-size: 14px; line-height: 20px; letter-spacing: 1px; margin: 0; }
.abc-stryv img { max-width: 120px; height: auto; }
@media (max-width: 767px) {
	.abc-copyright .column_attr { text-align: center; }
	.abc-stryv .mcb-column-inner, .abc-stryv { text-align: center !important; }
	.abc-stryv .image_frame { margin: 0 auto; }
	.abc-copyright-band .section_wrapper { margin: 0 16px; }
}