/* Builder Stylesheet * Version: 1.0 * Powered by Grace & James * https://gracejamesmedia.com Builder Structure ↳fl-builder-content ↳fl-row ↳fl-row-content-wrap ↳fl-row-content ↳fl-col-group ↳fl-col ↳fl-col-content ↳fl-module ↳fl-module-content * .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module .fl-module-content Contents * 01. Builder * 02. Rows * 03. Columns * 04. Spacing * 05. Modules * 06. Text * 07. Buttons * 08. Elements * 09. UI */ /* 01. Builder */ /* -------------------------------------------- */ /* Remove Before & After */ .fl-row:before, .fl-row:after, .fl-row-content:before, .fl-row-content:after, .fl-col-group:before, .fl-col-group:after, .fl-col:before, .fl-col:after, .fl-module:before, .fl-module:after, .fl-module-content:before, .fl-module-content:after, .fl-menu .menu:before, .fl-menu .menu:after { display: none !important; } /* Height = Full Height */ .fl-row-full-height > .fl-row-content-wrap { min-height: 100vh; } /* 02. Rows */ /* -------------------------------------------- */ .fl-row:not(header .fl-row) { margin-bottom: var(--row); } .fl-row.fl-row-fixed-width { max-width: var(--fixed-width); margin-left: auto; margin-right: auto; } .fl-row .fl-row-content-wrap .fl-row-content { display: flex; flex-direction: column; gap: var(--margin); /* Changed to --margin from gap because some gaps are way too big for this vertical spacing */ } .fl-row .fl-row-content-wrap .fl-row-content.fl-row-fixed-width { max-width: var(--max-width); margin-left: auto; margin-right: auto; padding-left: var(--gutter); padding-right: var(--gutter); } /* 03. Columns */ /* -------------------------------------------- */ .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group { /* width: 100%; */ display: flex; justify-content: space-between; gap: var(--gap); } *:not(header.navigation):not(footer.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col { flex: 1; } @media screen and (max-width: 768px) { *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group { flex-direction: column; gap: var(--gap); } } main .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col { width: unset; /* Override Beaver Inline Styles ( Ican't remove Width from functions.php otherwise it breaks background images. */ } /* If a .fl-col is empty, make it display: none; on Mobile */ @media (max-width: 768px) { .fl-col:not(:has(.fl-module)) { display: none; } } /* 04. Spacing */ /* -------------------------------------------- */ /* 05. Modules */ /* -------------------------------------------- */ /* Modules */ *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module:not(:last-child):not(.fl-module-photo) { margin-bottom: var(--spacer); } *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-photo:not(:last-child) { margin-bottom: var(--padding); } *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-button:not(:first-child), *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-button-group:not(:first-child), *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-html:not(:first-child), *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-accordion:not(:first-child) { margin-top: var(--padding); } @media screen and (max-width: 768px) { *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-button:not(:first-child), *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-button-group:not(:first-child), *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-html:not(:first-child), *:not(header.navigation) > .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module-accordion:not(:first-child) { margin-top: var(--padding); } } /* Button Group */ .fl-module-button-group { display: flex; gap: var(--padding); } @media screen and (max-width: 768px) { .fl-module-button-group { /* flex-direction: column; */ gap: calc(var(--padding) / 2); } } /* Pagination */ .fl-pagination .fl-button-group { justify-content: center; align-items: center; } /* Accordion */ .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module .fl-module-content .fl-accordion { display: flex; flex-direction: column; gap: var(--padding); padding-top: 0; border: none; } .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module .fl-module-content .fl-accordion .fl-accordion-item { margin: 0; padding: var(--padding); border: var(--border); border-radius: var(--border-radius); } .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module .fl-module-content .fl-accordion .fl-accordion-item .fl-accordion-button { display: flex; align-items: center; justify-content: space-between; gap: var(--padding); } .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module .fl-module-content .fl-accordion .fl-accordion-item .fl-accordion-button .fl-accordion-button-label { font-size: var(--p); font-weight: var(--bold); color: var(--primary); } .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module .fl-module-content .fl-accordion .fl-accordion-item .fl-accordion-content { display: none; } .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module .fl-module-content .fl-accordion .fl-accordion-item .fl-accordion-content { padding: var(--padding) 0 0 0; } .fl-row .fl-row-content-wrap .fl-row-content .fl-col-group .fl-col .fl-col-content .fl-module .fl-module-content .fl-accordion .fl-accordion-item .fl-accordion-button .fl-accordion-button-icon:not(:hover) { opacity: 1; color: var(--primary); } /* Rich Text */ .fl-rich-text *, .fl-accordion-content * { margin-bottom: var(--spacer); } .fl-rich-text *:last-child, .fl-accordion-content *:last-child { margin-bottom: 0; } /* 06. Text */ /* -------------------------------------------- */ /* 07. Buttons */ /* -------------------------------------------- */ /* 08. Elements */ /* -------------------------------------------- */ /* 09. UI */ /* -------------------------------------------- */ /* Advanced (All Lightboxes) */ #fl-builder-settings-tab-advanced #fl-builder-settings-section-margins, #fl-builder-settings-tab-advanced #fl-builder-settings-section-visibility, #fl-builder-settings-tab-advanced #fl-builder-settings-section-animation, /* #fl-builder-settings-tab-advanced #fl-builder-settings-section-css_selectors, */ #fl-builder-settings-tab-advanced #fl-builder-settings-section-export_import, #fl-builder-settings-tab-advanced #fl-builder-settings-section-bb_css_code, #fl-builder-settings-tab-advanced #fl-builder-settings-section-bb_js_code { display: none !important; } /* Rows */ /* .fl-builder-row-settings #fl-builder-settings-section-general, */ .fl-builder-row-settings #fl-builder-settings-section-general #fl-field-max_content_width, .fl-builder-row-settings #fl-builder-settings-section-general #fl-field-aspect_ratio, .fl-builder-row-settings #fl-builder-settings-section-colors, /* .fl-builder-row-settings #fl-builder-settings-section-background, .fl-builder-row-settings #fl-builder-settings-section-bg_photo, .fl-builder-row-settings #fl-builder-settings-section-bg_video, .fl-builder-row-settings #fl-builder-settings-section-bg_slideshow, .fl-builder-row-settings #fl-builder-settings-section-bg_parallax, .fl-builder-row-settings #fl-builder-settings-section-bg_overlay, .fl-builder-row-settings #fl-builder-settings-section-bg_color, .fl-builder-row-settings #fl-builder-settings-section-bg_gradient, .fl-builder-row-settings #fl-builder-settings-section-bg_embed_section, */ .fl-builder-row-settings #fl-builder-settings-section-border, .fl-builder-row-settings #fl-builder-settings-section-top_edge_shape, .fl-builder-row-settings #fl-builder-settings-section-top_edge_style, .fl-builder-row-settings #fl-builder-settings-section-bottom_edge_shape, .fl-builder-row-settings #fl-builder-settings-section-bottom_edge_style, .fl-builder-row-settings #fl-builder-settings-section-shapes_container { display: none !important; } /* Columns */ /* .fl-builder-col-settings #fl-builder-settings-section-general, */ .fl-builder-col-settings #fl-builder-settings-section-general #fl-field-size, .fl-builder-col-settings #fl-builder-settings-section-general #fl-field-min_height, .fl-builder-col-settings #fl-builder-settings-section-text, /* .fl-builder-col-settings #fl-builder-settings-section-background, .fl-builder-col-settings #fl-builder-settings-section-bg_photo, .fl-builder-col-settings #fl-builder-settings-section-bg_overlay, .fl-builder-col-settings #fl-builder-settings-section-bg_color, .fl-builder-col-settings #fl-builder-settings-section-bg_gradient, */ .fl-builder-col-settings #fl-builder-settings-section-border { display: none !important; } /* Modules */ /* .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-style, */ /* Needed for Color and Alignment on Images */ .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-style #fl-field-padding, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-text, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-icons, /* .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-colors, */ /* Needed for Color and Alignment on Headings */ .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-colors .fl-builder-settings-section-header, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-colors #fl-field-style, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-colors #fl-field-bg_color, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-colors #fl-field-bg_hover_color, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-colors #fl-field-button_transition, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-colors #fl-field-bg_gradient, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-colors #fl-field-bg_gradient_hover, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-border, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-general #fl-field-label_size, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-general #fl-field-item_spacing, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-general #fl-field-item_border, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-general #fl-field-border, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-label, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-content, .fl-builder-module-settings #fl-builder-settings-tab-style #fl-builder-settings-section-style #fl-field-color /* Text Editor */ { display: none !important; } /* Align – Typography */ .fl-compound-field-section-toggle { display: none !important; /* Hides dropdowns */ } .fl-typography-field-family-row, .fl-typography-field-size-row { display: block !important; /* Shows Typography Field without needing Dropdown to be clicked */ padding: 0 !important; } #fl-field-typography .fl-field-label { display: none !important; /* Hides Typograhpy label */ } .fl-compound-field-setting { display: none !important; /* Hides all Typography fields */ } .fl-typography-field-align { display: block !important; /* Shows Typography Alignment field */ } /* Responsive Editing */ .fl-field-responsive-toggle { display: none !important; } /* Sidebar - Modules */ /* .fl-builder-block-icon { display: none !important; } */ /* Side Bar - Columns */ #fl-builder-blocks-rows .fl-builder-blocks-section-content .fl-builder-block { display: none !important } #fl-builder-blocks-rows .fl-builder-blocks-section-content .fl-builder-block:first-of-type { display: block !important; } /* Side Bar - Searches */ .fl-builder--panel-controls, .fl-builder-panel-saved-search { display: none !important; } /* Global Menu */ .fl-builder--menu-item[data-event="publishAndRemain"], .fl-builder--menu-item[data-event="previewLayout"], .fl-builder--menu-item[data-event="responsiveEditing"], .fl-builder--menu-item[data-event="revResponsiveEditing"], .fl-builder--menu-item[data-event="toggleUISkin"], .fl-builder--menu-item[data-event="showKeyboardShortcuts"], .fl-builder--menu-item[data-event="showLayoutSettings"], .fl-builder--menu-item[data-event="showGlobalSettings"], .fl-builder--menu-item[data-event="showGlobalStyles"], .fl-builder--menu-item[data-view="admin"] { display: none !important; } .fl-builder--menu hr { display: none !important; } /* Fixes */ .fl-builder-lightbox input { padding-block: 0; border: none; } /* .fl-module-overlay * { margin-bottom: 0; } .navigation .fl-photo-content { display: block !important; } .fl-col { margin-left: unset !important; margin-right: unset !important; } .fl-col-small:not(.fl-col-small-full-width) { max-width: unset !important; width: 100% !important; } .fl-icon i { float: unset !important; } */