/* @group General ------------------------------------------------------ */ html { transition-property: margin; transition-duration: .35s; } html.fl-builder-is-showing-toolbar { margin-top: 46px !important; } .fl-builder-edit body { position: static !important; } /* fix for twentysixteen */ .fl-builder-edit:before, .fl-builder-edit:after { z-index: 0 !important; } .fl-builder-edit .fl-builder-content { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; } #wpadminbar { transition-property: transform, opacity; transition-duration: .35s; transform-origin: bottom; transform-style: preserve-3d; transform: rotateX(89deg) translateY(46px); opacity:0; pointer-events: none; will-change: transform; } html.fl-builder-show-admin-bar { margin-top: 32px; } html.fl-builder-show-admin-bar #wpadminbar { transform: rotateX(0deg) translateY(0px); pointer-events: auto; opacity:1; } @media screen and ( max-width: 782px ) { html.fl-builder-show-admin-bar { margin-top: 46px; } } .fl-clear { clear: both; } .screen-reader-text { position: absolute; left: -1000em; top: -1000em; height: 1px; width: 1px; overflow: hidden; } /* @endgroup General */ /* @group Loading ------------------------------------------------------ */ .fl-builder-loading { background: rgba(240, 240, 240, 0.8) url(../img/ajax-loader.svg) center center no-repeat; bottom: 0; display: none; left: 0; position: fixed; right: 0; text-align: center; top: 0; z-index: 12000000; } .fl-builder-settings .fl-builder-loading { background: rgba(255, 255, 255, 0.8) url(../img/ajax-loader.svg) center center no-repeat; display: block; position: absolute; } .fl-field-loader { color: #B3B3B3 !important; font-style: italic; } .fl-builder-node-loading { opacity: 0.35; } .fl-builder-node-loading-placeholder { background: url(../img/ajax-loader.svg) center center no-repeat; height: 50px; } .fl-col-group-has-child-loading { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .fl-col-group-has-child-loading > .fl-builder-node-loading-placeholder { width: 50px; } /* @endgroup Loading */ /* @group Visibility Rules ------------------------------------------------------ */ .fl-node-hidden { display: none; } .fl-builder-edit .fl-node-hidden { display: block; } /* @endgroupVisibility Rules */ /* @group Responsive Utilities ------------------------------------------------------ */ html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible-desktop, html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible-desktop-medium, html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible-medium, html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible-medium-mobile, html:not(.fl-responsive-preview-enabled) .fl-builder-content-editing .fl-visible-mobile { display: block !important; } /* @endgroup Responsive Utilities */ /* @group Responsive Editing ------------------------------------------------------ */ .fl-responsive-preview-mask { background: #F7F7F7; bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 99999; } .fl-responsive-preview { bottom: 0; left: 0; position: absolute; right: 0; top: 0; margin-top: 50px; z-index: 100000; } .fl-builder-preview .fl-responsive-preview { margin: 0 !important; } .fl-responsive-preview-content { background: #F5F7F9; padding: 20px 20px 45px; } .fl-responsive-preview-message { color: #b3b3b3; font-family: Helvetica, Arial, Verdana, sans-serif; font-size: 14px; font-weight: normal; padding: 0 20px 20px; text-align: center; } .fl-responsive-preview-message i { cursor: pointer; margin-left: 3px; } .fl-responsive-preview .fl-builder-content { box-shadow: 0 0 8px rgba(0,0,0,0.2); margin-left: auto; margin-right: auto; max-width: 100%; } /* @endgroup Responsive Editing */ /* @group Responsive Iframe Preview ------------------------------------------------------ */ #fl-builder-preview-mask { background: #F7F7F7 url(../img/ajax-loader.svg) center center no-repeat; bottom: 0; height: 100%; left: 0; position: fixed; right: 0; top: 0; width: 100%; z-index: 99999; } #fl-builder-preview-frame { bottom: 0; height: 100%; left: 50%; position: fixed; right: 0; top: 0; transform: translateX(-50%); -moz-transform: translateX(-50%); -webkit-transform: translateX(-50%); width: 100%; z-index: 100000; } /* @endgroup Responsive Iframe Preview */ /* @group Buttons ------------------------------------------------------ */ .fl-builder-button { color: #676F7A !important; fill: #676F7A !important; background: #E4E7EA; align-items: center; display: flex; text-decoration: none; font-size: 14px !important; font-weight: 500 !important; line-height: 1 !important; height: 33px; margin: 0; padding: 0px 12px; cursor: pointer; -webkit-border-radius: 3px; -webkit-appearance: none; border:2px solid transparent; border-radius: 3px; letter-spacing: normal !important; white-space: nowrap; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important; -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important; transition-property: background-color, width; transition-duration: .2s; /* Prevent select */ -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; } .fl-builder-button:hover { background: #dadfe5; color: #222; border: 2px solid transparent !important; } .fl-builder-button:active { background: #DCDCDC; } button.fl-builder-button:focus { position: static; top:auto; outline:none; background: #E4E7EA; border:2px solid #00A0D0 !important; } .fl-builder-bar .fl-builder-button { height: auto; } .fl-builder-button-primary, body.fl-builder--layout-has-drafted-changes .fl-builder-done-button { background: #00A0D2; color: #fff !important; text-decoration: none; border:2px solid transparent !important; } .fl-builder-button.fl-builder-button-primary:focus, body.fl-builder--layout-has-drafted-changes .fl-builder-button.fl-builder-done-button:focus { background: #00A0D2; border:2px solid #ffc217 !important; } .fl-builder-button-primary:hover, body.fl-builder--layout-has-drafted-changes .fl-builder-done-button:hover { background: #0197C6; color: #fff !important; } .fl-builder-button-primary:active, body.fl-builder--layout-has-drafted-changes .fl-builder-done-button:active { background: #0484AC; } .fl-builder-button-large { height: 30px; } .fl-builder-button-small { font-size: 11px !important; line-height: 1 !important; } .fl-builder-help-button { color: #b3b3b3; font-size: 16px !important; } .fl-builder-help-button i { position: relative; top: -1px; } .fl-builder-help-button:hover { color: #666; } .fl-builder-publish-button { line-height: 45px !important; } .fl-builder-content-panel-button, .fl-builder-content-panel-button:hover { fill: #00A0D2 !important; font-size: 30px !important; padding-bottom: 4px; } /* Silent buttons have the same dimensions but no background or "button" look. */ .fl-builder-button-silent, .fl-builder-button-silent:hover { padding:0 12px; background:none !important; border:2px solid transparent !important; box-shadow:none !important; } .fl-builder-done-button, .fl-builder-done-button:hover { font-weight: 600; } .fl-field .fl-builder-button { display: inline-block; height: auto; padding: 11px 12px; vertical-align: middle; box-shadow: 0 2px 4px 0 rgba(0,0,0,0.12); } /* @endgroup Buttons */ /* @group Badges ------------------------------------------------------ */ .fl-builder-badge { background: #333; border-radius: 2px; color: #fff !important; display: inline; font-size: 11px !important; font-weight: normal; letter-spacing: 1px; margin-left: 2px; padding: 2px 4px; vertical-align: middle; } .fl-builder-badge-global { background: #ff9600; } .fl-builder-blocks-node-template .fl-builder-badge-global { position: absolute; right: 0; top: 0; } .fl-builder-badge-global { transform: translateY(0px); transition-duration: .25s; transition-property: transform; } .fl-builder-block:hover .fl-builder-badge-global { display:none; } .fl-builder-blocks-section-content .fl-builder-node-template-actions { bottom: 0; cursor: default; } /* @endgroup Badges */ /* @group Toolbar ------------------------------------------------------ */ .fl-builder-bar { left: 0; position: fixed; right: 0; top: 0; z-index: 999999; /* Prevent select */ -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently not supported by any browser */ transition-property: transform opacity; transition-duration: .35s; transform-style: preserve-3d; -webkit-perspective: 1100px; -moz-perspective: 1100px; perspective: 1100px; } .fl-builder-bar.is-hidden { pointer-events: none; } .fl-builder-bar.is-hidden .fl-builder-bar-content { transform: translateY(-100%) rotateX(90deg); } body .fl-builder-bar .fl-builder-bar-content { display: flex; box-sizing: border-box; background: #ffffff; border-bottom: 2px solid #D5DADD; color: #999999; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important; font-size: 14px !important; height: 48px; /* include 2px border */ transition-property: background-color, opacity, transform; transition-duration: .35s; pointer-events: auto; } body .fl-builder-bar .fl-builder-bar-content.is-muted { pointer-events: none; } body .fl-builder-bar .fl-builder-bar-content.is-muted > *:not(.fl-builder-publish-actions) { -webkit-filter: saturate(20%) blur(1px); filter: saturate(20%) blur(1px); opacity: .4; } .fl-builder-bar-title { box-sizing: border-box; color: #333; display: flex; flex: 0 0 380px; max-width: 380px; /* required */ border-right: 2px solid #D5DADD; cursor: pointer; } .fl-builder-bar-title:hover { background: #ffffff; } .fl-builder-bar-title.is-showing-menu .fl-builder-bar-title-caret > svg { transform: rotate(180deg); } .fl-builder-simple .fl-builder-bar-title { cursor: auto; } .fl-builder-simple .fl-builder-bar-title:hover { cursor: auto; background: none; } .fl-builder-bar-title img { /* height: 33px !important; margin: 2px 10px 0 0 !important; vertical-align: middle !important; */ } .fl-builder-bar-title span { vertical-align: middle; } .fl-builder-bar-title-icon { box-sizing: border-box; background: transparent; flex: 0 0 46px; display: flex; align-items: center; padding: 4px; } .fl-builder-bar-title-icon img { max-width: 100% !important; height:auto !important } .fl-builder-bar-title.fl-builder-bar-title-no-icon { padding-left: 12px; } .fl-builder-bar-title-area { box-sizing: border-box; flex: 1 1 100%; display: flex; flex-direction: column; overflow: hidden; padding: 4px; } .fl-builder-layout-title, .fl-theme-builder-preview-select .fl-theme-builder-preview-select-title span { font-size: 17px; font-weight: 400; line-height: 1.3; color: #161B20; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .fl-builder-layout-pretitle, .fl-builder-bar-title-caret, .fl-theme-builder-preview-select .fl-theme-builder-preview-select-title { font-size: 12px; font-weight: 500; line-height: 1.3; color: #656d77; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .fl-builder-bar-title-caret i, .fl-theme-builder-preview-select-title i { color: inherit !important; font-size:14px; } .fl-builder-bar-title-caret { margin-left:auto; margin-left: auto !important; flex: 0 0 46px; } .fl-theme-builder-preview-select-title i { padding:12px 12px; } .fl-theme-builder-preview-select-title i:before { content: "\f078"; } .fl-theme-builder-preview-select.fl-builder-button { position: relative; border-radius:0; background:none; max-width: none; min-width: 0; display: flex; flex:0 0 360px; max-width: 360px; margin:0 !important; padding:4px 10px; border:none !important; border-right: 2px solid #d5dadd !important; box-shadow: none; } .fl-theme-builder-preview-select.fl-builder-button:hover { border:none !important; border-right: 2px solid #d5dadd !important; } .fl-theme-builder-preview-select .fl-theme-builder-preview-select-title { display: flex; flex: 1; justify-content: flex-end; flex-direction: row-reverse; } .fl-theme-builder-preview-select-title div { flex:1; } .fl-theme-builder-preview-select .fl-theme-builder-preview-select-title span { display: block; } .fl-theme-builder-preview-select-open .fl-theme-builder-preview-select-items { position: absolute; top: calc(48px + 10px); left: 10px; width: calc(100% - 20px) !important; background:#ffffff; border:none; border-radius: 4px; border: 2px solid #D5DADD; border-top: 3px solid #00a0d2; box-shadow: 0px 15px 45px 8px rgba(0, 0, 0, 0.04); margin:0 !important; padding:0; z-index: -1; font-size: 16px; overflow: visible; height: auto !important; max-height: calc(100vh - 66px); min-height: 300px; display: flex !important; flex-direction: column; } .fl-theme-builder-preview-select-open .fl-theme-builder-preview-select-items:before { right: 18px; } .fl-theme-builder-preview-select-item { padding: 4px 0 !important; border-bottom: none !important; display: flex; flex-direction: column; } .fl-theme-builder-preview-select-item:hover { text-decoration: none; color: #111111; background: transparent !important; } body .fl-theme-builder-preview-select .fa-caret-down { float: none; } body .fl-theme-builder-preview-select-item-title { padding:10px 15px; color: #222222; font-size:14px; } body .fl-theme-builder-preview-select .fa-caret-down i:before, body .fl-theme-builder-preview-select-item-title i:before { content: "\f078"; } body .fl-theme-builder-preview-select-item-children { overflow:auto; } body .fl-theme-builder-preview-select-item-child { overflow: hidden; text-overflow: ellipsis; line-height: 1.1; color: #6b6b6b; margin: 0 10px; border: 2px solid transparent; border-radius:4px; padding: 8px 10px 10px; font-size:14px; font-weight:normal; color: #222222; } body .fl-theme-builder-preview-select-item-child:hover { background: #e6eaed !important; } .fl-theme-builder-preview-select-item .fa-caret-down { color: #606D77; } .fl-builder-bar-actions { display: flex; flex-direction: row-reverse; flex: 1 1 100%; padding: 4px; } .fl-builder-bar .fl-builder-button { margin: 0 0 0 4px; } /* Actually the first button, but it's the last because it's inside a row-reverse container */ .fl-builder-bar-actions .fl-builder-button:last-child { margin:0; } .fl-builder-bar-actions:after { clear:both; } .fl-builder-bar .fl-builder-content-panel-button { align-items: baseline !important; padding-top:1px; font-weight: 400; } .fl-builder-content-panel-button svg { transition-property: transform; transition-duration: .25s; transform: rotate(0deg) scale(1); transform-origin: center; } .fl-builder-content-panel-is-showing .fl-builder-content-panel-button svg { transform: rotate(135deg) scale(1.1) translate(.5px, -.5px); } .fl-builder--saving-indicator { cursor: pointer; display: flex; align-self: center; padding: 0 16px; font-size: 1em; font-style:italic; color: #676f7a; align-items: center; line-height: 1.2; min-width: 180px; justify-content: flex-end; } .fl-builder--saving-indicator:hover { color: #676f7a; } .fl-builder--saving-indicator .fa-question-circle { font-size: 13px; margin: 3px 0 3px 8px; } /* Buy/Upgrade button */ .fl-builder-buy-button, .fl-builder-upgrade-button { background: #F7A407; color: #fff !important; text-decoration: none; } .fl-builder-buy-button i.fa-external-link-alt, .fl-builder-upgrade-button i.fa-external-link-alt { color: #FFC733; margin: 0 0 0 6px; } .fl-builder-buy-button:hover, .fl-builder-upgrade-button:hover { background: #EE8E0D; color: #fff !important; } /* Responsive Bar */ @media (max-width: 980px) { .fl-builder--main-menu-panel { width: calc(100% - 20px) !important; } .fl-builder--main-menu-panel:before { right:auto; left: 20px; } .fl-builder-bar-title, .fl-theme-builder-preview-select { flex: 1 .5 380px !important; } } @media (max-width:620px) { .fl-theme-builder-preview-select.fl-builder-button { display:none; } } @media (max-width: 500px) { .fl-builder-panel, .fl-builder--main-menu-panel { width: auto !important; top:44px !important; left: 0 !important; right: 0 !important; bottom: 0 !important; border-radius:0 !important; box-shadow: none !important; } .fl-builder--main-menu-panel { border-left: transparent !important; border-right: transparent !important; border-bottom: transparent !important; max-height: calc(100% - 44px) !important; } .fl-builder--panel-arrow { display:none; } .fl-builder-bar-title { flex: 0 0 100px !important; } .fl-builder-bar-title-area { display:none; } .fl-builder--main-menu-panel:before { display:none; } .fl-builder--panel-header { border-radius: 0 !important; cursor: default !important; } .fl-builder--panel-header .fl-builder--tabs { cursor: default !important; } .fl-builder-panel:before { display:none; } .fl-builder-panel-drag-handle { display:none; } .fl-builder-publish-actions { width:100% !important; } .fl-builder-bar-actions .fl-builder-button { padding: 0 8px !important; } } .fl-builder--preview-actions { display:none; position: fixed; top: 4px; left: 4px; z-index: 100008; padding: 4px; justify-content: center; background:white; border-radius: 4px; } .fl-builder-preview .fl-builder--preview-actions { display: flex; } .fl-builder--preview-actions .device-icons { color: #555; background: #e4e4e4; border: none !important; align-items: center; display: flex; text-decoration: none; font-size: 14px !important; line-height: 1 !important; margin: 0; margin-right:4px; padding: 0 6px; cursor: pointer; -webkit-border-radius: 3px; -webkit-appearance: none; border-radius: 3px; } .fl-builder--preview-actions .device-icons i { margin: 0 6px; } /* @endgroup Toolbar */ /* @group Pinned UI ------------------------------------------------------ */ /* Pin Zones */ @keyframes fl-builder-ui-pin-zone-pulse { 0% { opacity: 1; filter: alpha( opacity = 1 ); } 50% { opacity: 0.5; filter: alpha( opacity = 35 ); } 100% { opacity: 1; filter: alpha( opacity = 1 ); } } .fl-builder-ui-pin-zone { animation: fl-builder-ui-pin-zone-pulse 2s infinite; transition: width 0.3s ease; background: rgba(0, 160, 210, .5); bottom: 0; top: 0; position: fixed; width: 35px; z-index: 100001; } .fl-builder-ui-pin-zone-left { left: 0; } .fl-builder-ui-show-pin-zone-left .fl-builder-ui-pin-zone-left { width: 75px; } .fl-builder-ui-pin-zone-right { right: 0; } .fl-builder-ui-show-pin-zone-right .fl-builder-ui-pin-zone-right { width: 75px; } .fl-builder-content-panel-pin-zone .fl-builder-content-panel-button { display: flex !important; background: rgba(0, 160, 210, .5) !important; padding: 2px 4px; width: 80px; animation: fl-builder-ui-pin-zone-pulse 2s infinite; } .fl-builder-content-panel-pin-zone .fl-builder-content-panel-button svg { display: none; } .fl-builder-content-panel-pin-zone-hover .fl-builder-content-panel-button { width:120px; } .fl-builder-content-panel-pin-zone-hover .fl-builder-content-panel-button svg { display: none !important; width: 100%; transform: none !important; fill: #00A0D2 !important; border-radius: 3px; } .fl-builder-content-panel-pin-zone .fl-builder-done-button { filter: grayscale(100%); } /* Pinned - Panel State */ .fl-builder-ui-is-pinned .fl-builder-content-panel-button { display: none; } .fl-builder-panel.fl-builder-ui-pinned { top: 48px !important; bottom: 0 !important; height: auto !important; border-radius: 0; border:none; box-shadow: none; animation-duration: 0s; -moz-animation-duration: 0s; -webkit-animation-duration: 0s; -o-animation-duration: 0s; z-index: 9; } .fl-builder-panel.fl-builder-ui-pinned-right { left: auto !important; right: 0; border-left: 2px solid #d5dadd; } .fl-builder-panel.fl-builder-ui-pinned-left { left: 0; right: auto; border-right: 2px solid #d5dadd; } .fl-builder-panel.fl-builder-ui-pinned .fl-builder--panel-header { border-radius: 0 !important; } /* Pinned - Lightbox State */ .fl-builder-ui-pinned-container .fl-lightbox-wrap { position: absolute; z-index: 9; } .fl-builder-ui-pinned-container .fl-lightbox { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: auto !important; height: auto; border-radius: 0; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; animation-duration: 0s; -moz-animation-duration: 0s; -webkit-animation-duration: 0s; -o-animation-duration: 0s; } .fl-builder-ui-pinned-container .fl-lightbox-header-wrap { border-radius: 0; } .fl-builder-ui-pinned-container .fl-lightbox.ui-draggable .fl-lightbox-header { cursor: auto; } .fl-builder-ui-pinned-container .fl-lightbox-header h1 { padding: 12px 20px 10px !important; } .fl-builder-ui-pinned-container .fl-lightbox-controls { display: none; } /* Pinned - Content Transform */ .fl-builder-ui-pinned-content-transform { transform: scale(1); transform-origin: center top 0px; } /* Pinned - Collapse Controls */ .fl-builder-ui-pinned-collapse { cursor: pointer; display: none; position: absolute !important; bottom: 2px; padding: 5px; border: 2px solid transparent; background: transparent; width: 36px; height: 36px; border-radius: 4px; fill: #778794; flex-direction: row; justify-content: center; } .fl-builder-ui-pinned-collapse:hover, .fl-builder-ui-pinned-collapse:focus { top:auto !important; background:transparent; border: 2px solid transparent; outline:none; fill: #00A0D2; } .fl-builder-ui-pinned-collapse:focus { background: #E4E7EA; } .fl-builder-ui-pinned-collapse > * { margin:auto; line-height: 1; } .fl-builder-ui-pinned-collapse svg g { fill:inherit; } .fl-builder-ui-is-pinned-right .fl-builder-ui-pinned-right-collapse { display: flex; left: -40px; } .fl-builder-ui-is-pinned-left .fl-builder-ui-pinned-left-collapse { display: flex; right: -40px; } .fl-builder-ui-pinned-collapse i[data-toggle="show"], .fl-builder-ui-pinned-is-collapsed i[data-toggle="hide"] { display: none; } .fl-builder-ui-pinned-is-collapsed i[data-toggle="show"] { display: block; } .fl-builder-ui-is-pinned-left [data-toggle="hide"], .fl-builder-ui-is-pinned-right [data-toggle="show"] { transform: rotateY(180deg); } .fl-builder-ui-pinned-is-collapsed .fl-lightbox { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; } .fl-builder-ui-pinned-is-collapsed .fl-builder--panel-header { display:none; /* to take it out of tab order while collapsed */ } /* Pinned - iFrame Fix */ .fl-builder-resizable-is-resizing .fl-builder-content, .fl-builder-resizable-is-resizing .fl-builder-panel .fl-lightbox, .fl-builder-draggable-is-dragging .fl-builder-panel .fl-lightbox, .fl-builder-draggable-is-dragging .fl-builder-content { pointer-events: none; } /* Pinned - Simple UI */ .fl-builder-simple-pinned .fl-builder--content-library-panel .fl-builder--panel-header { background: transparent; border: none; z-index: 10; } .fl-builder-simple-pinned .fl-builder--content-library-panel .fl-builder--tab-wrap, .fl-builder-simple-pinned .fl-builder--content-library-panel .fl-builder--panel-controls, .fl-builder-simple-pinned .fl-builder--content-library-panel .fl-builder--panel-content { display: none; } .fl-builder-simple-pinned .fl-builder--content-library-panel .fl-lightbox-wrap { top: 0; } .fl-builder-simple-pinned .fl-builder--content-library-panel .fl-lightbox-header h1 { padding: 14px 28px 15px !important; } .fl-builder--panel-no-settings { display: none; } .fl-builder-simple-pinned .fl-builder--panel-no-settings { display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } /* @endgroup Pinned UI */ /* @group Content Panel ------------------------------------------------------ */ @keyframes fl-builder-show-panel { from { transform: scale(.8); } to { transform: scale(1); } } .fl-builder-panel, .fl-builder--search-results-panel { box-sizing: border-box; position: fixed !important; right: 20px; top: calc(48px + 10px); width: 380px; bottom: 20px; background: #F5F7F9; color: #676F7A; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 14px; border-radius: 4px; box-shadow: 0px 8px 40px 4px rgba(0, 0, 0, 0.3); z-index: 10000007; will-change: transform; display:none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fl-builder-panel { transform-origin: top right; animation-name: fl-builder-show-panel; animation-duration: .15s; animation-fill-mode: both; } .fl-builder--search-results-panel { position: absolute; right: 0; top: 93px; left: 0; bottom:0; width: auto !important; border:none; border-radius:0; box-shadow:none; min-height: 100px; max-height: calc(100vh - 54px); overflow:auto; z-index:1; } .fl-builder-content-panel-is-showing .fl-builder-panel, .fl-builder-search-results-panel-is-showing .fl-builder--search-results-panel { display:block; } .fl-builder-content-panel-is-showing .fl-builder-panel.fl-builder--current-view-templates { width: 520px; } .fl-builder--search-results-panel .fl-builder--no-results { text-align: center; padding: 50px 20px; } .fl-builder--panel-arrow { position: absolute; top: -13px; right: 10px; } .fl-builder-ui-is-pinned .fl-builder--panel-arrow, body.fl-builder-draggable-is-dragging .fl-builder--panel-arrow { display: none; } .fl-builder--panel-arrow polygon { fill: #00a0d2; } /* Builder Panel Actions ------------------------------------------------------ */ .fl-builder--panel-header { background:white; border-top: 3px solid #00a0d2; border-bottom: 2px solid #e6eaed; border-top-right-radius: 4px; border-top-left-radius: 4px; } .fl-builder-ui-is-pinned .fl-builder--panel-header { border-top-color: transparent; } .fl-builder-panel-drag-handle { position: absolute; top: 7px; left: 10px; fill: #ccd4da; width: 6px; } .fl-builder-ui-is-pinned-left .fl-builder-panel-drag-handle { left: auto; right:10px; } .fl-builder-panel .fl-lightbox .fl-builder-panel-drag-handle, .fl-lightbox-width-full .fl-builder-panel-drag-handle { display: none; } .fl-builder--panel-header .fl-builder--panel-controls { display: flex; flex-direction: row; position: relative; } .fl-builder--panel-header .fl-builder--panel-controls .fl-builder-content-group-select { flex: 1 1; } .fl-builder--panel-header .fl-builder--panel-controls .fl-builder-panel-search { flex: 0 0; padding: 0 10px 6px; padding-left:0; margin-left: -4px; /* compensate for group select padding */ } .fl-builder--panel-controls .fl-builder-panel-search button { width: 38px; background: transparent !important; border: 2px solid transparent !important; font-size: inherit; height: 38px; padding:0; } .fl-builder--panel-controls .fl-builder-panel-search button:focus, .fl-builder--panel-controls .fl-builder-panel-search button:active { top:0; outline: none; } .fl-builder-panel-search button svg { height:auto; width:20px; } .fl-builder-panel-search button.fl-builder-dismiss-panel-search svg { width: 16px; } .fl-builder-panel-search button svg .filled-shape { fill:black; } .fl-builder--panel-controls .fl-builder-panel-search button:focus svg .filled-shape, .fl-builder--panel-controls .fl-builder-panel-search button:active svg .filled-shape { fill: #00A0D2; } .fl-builder-panel-search .fl-builder-panel-search-input { display: none; position: absolute; top:0; left:0; right:0; bottom:0; background:white; } .fl-builder-panel-search.is-showing-input .fl-builder-panel-search-input { display: flex; flex-direction: row; padding: 0 10px 6px; } .fl-builder-panel-search-input input { flex: 1 1 100%; border: 2px solid #e6eaed; background:white; border-radius: 4px; margin-right: 4px; padding: 10px; color: #333; } .fl-builder-panel-search-input input:focus { border-color: #0197C6; outline: none; } .fl-builder-panel-search-input button { flex: 0 0 38px; } /* Builder Panel Content ------------------------------------------------------ */ .fl-builder-panel-content-wrap { bottom: 0; height: auto; left: 0; overflow: hidden; position: absolute; right: 0; top: 43px; } .fl-builder-panel-content { padding-bottom: 60px; } .fl-builder-blocks-section { border-top: 2px solid #e6eaed; } .fl-builder--panel-view .fl-builder-blocks-section:first-child { border-top:none; } .fl-builder-blocks-group:first-child { padding: 20px 0 0; } .fl-builder-blocks-group .fl-builder-blocks-section-group-name { display: block; padding: 0 30px 15px; color: #000000; font-size: 20px; font-weight: 600; line-height: 1.4; } .fl-builder-blocks-section .fl-builder-blocks-section-title, .fl-builder-blocks-section .fl-builder-block { display: block; line-height: 1.1; padding: 15px 20px; } .fl-builder-blocks-section .fl-builder-blocks-section-title, .fl-builder--template-collection-section-name { display: inline-block; font-weight: 700; font-size: 12px; line-height: 1.2; text-transform: uppercase; padding-top: 30px; color: #333333; padding: 4px 10px; padding-left: 15px; margin:0 !important; background: #e6eaed; border-bottom-right-radius: 4px; user-select: none; vertical-align: top; } .fl-builder-blocks-section .fl-builder-blocks-section-title i { color: #bfbfbf; float: right; } .fl-builder-blocks-section-content { overflow: auto; padding: 10px 10px 20px; } .fl-builder-blocks-section-content:after { float:none; clear:both; } .fl-builder-blocks-section-content.fl-builder-modules, .fl-builder-blocks-section-content.fl-builder-widgets, .fl-builder-blocks-section-content.fl-builder-rows { display: flex; flex-wrap: wrap; } .fl-builder-blocks-section-content .fl-builder-block-module, .fl-builder-blocks-section-content .fl-builder-block-row { flex: 1 1 50%; width:50%; box-sizing: border-box; } .fl-builder--search-results-panel .fl-builder-blocks-section-content .fl-builder-block-module { flex: 1 1 100%; width: 100%; } .fl-builder-blocks-section.fl-active .fl-builder-blocks-section-content { display: block; } .fl-builder-blocks-section-content .fl-builder-block { box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-radius: 4px; font-size: 14px; line-height: 1.1; font-weight: 500; color: #727272; } .fl-builder-block { position: relative; height:47px; } .fl-builder-block.fl-builder-block-col-group { height:84px; } .fl-builder-block.fl-builder-block-has-thumbnail { height:auto !important; padding:10px !important; } .fl-builder-block.fl-builder-block-has-thumbnail:hover { padding:0 !important; } .fl-builder-block.fl-builder-block-has-thumbnail .fl-builder-block-content { position: relative !important; } .fl-builder-block.fl-builder-block-has-thumbnail:hover .fl-builder-block-content { padding: 10px !important; } .fl-builder-block.fl-builder-block-has-thumbnail .fl-builder-block-details { margin: 0 10px 4px !important; } .fl-builder-block:hover { overflow:visible; z-index: 1; } .fl-builder-block:hover .fl-builder-block-content { display: block; box-sizing: border-box; position: absolute; top:0; left:0; width: 100%; padding: 15px 20px; border-radius: 4px; background: #ffffff; box-shadow: 0 2px 4px 0 rgba(0,0,0,0.12); text-decoration: none; color: #111111; cursor: move; overflow:hidden; } .fl-builder-block-module:hover .fl-builder-block-content { width:auto; /* modules allow auto width to show long titles */ min-width:100%; } .fl-builder-block .fl-builder-block-content .fl-builder-block-visual { display: block; margin-bottom: 7px; } .fl-builder-block-drag-helper .fl-builder-block-content .fl-builder-block-visual { display: none !important; } .fl-builder-block .fl-builder-block-content .fl-builder-block-visual.fl-cols-visual { display: flex; flex-direction: row; height: 30px; } .fl-builder-block-visual.fl-cols-visual .fl-cols-visual-col { flex: 1 100%; background: #464a4c; height: 30px; margin: 0 2px; border-radius: 2px; } .fl-builder-block:hover .fl-builder-block-visual.fl-cols-visual .fl-cols-visual-col { background: #000000; } .fl-builder-block-visual.fl-cols-visual .fl-cols-visual-col:first-child { margin-left: 0 !important; } .fl-builder-block-visual.fl-cols-visual .fl-cols-visual-col:last-child { margin-right: 0 !important; } .fl-cols-visual.left-sidebar .fl-cols-visual-col:first-child { flex-basis:60px; } .fl-cols-visual.right-sidebar .fl-cols-visual-col:last-child { flex-basis:60px; } .fl-cols-visual.left-right-sidebar .fl-cols-visual-col:first-child, .fl-cols-visual.left-right-sidebar .fl-cols-visual-col:last-child { flex-basis:60px; } .fl-builder-block-saved-module.fl-builder-block-global .fl-builder-block-title, .fl-builder-block-saved-module:hover .fl-builder-block-title, .fl-builder-block-saved-column.fl-builder-block-global .fl-builder-block-title, .fl-builder-block-saved-column:hover .fl-builder-block-title, .fl-builder-block-saved-row.fl-builder-block-global .fl-builder-block-title, .fl-builder-block-saved-row:hover .fl-builder-block-title { margin-right: 70px; } .fl-builder-block-module:nth-child(even):hover .fl-builder-block-content { left:auto; right:0; } .fl-builder-block-thumbnail { border-radius: 4px; background-size: contain; background-repeat: no-repeat; background-position: center; background-color: rgba(0, 0, 0, 0.06); margin-bottom:10px; transform-origin: bottom; transition-property: transform, box-shadow; transition-duration: .15s; } .fl-builder-block:hover .fl-builder-block-thumbnail { transform:scale(1.05); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.08) } .fl-builder-block .fl-builder-block-icon { margin-right:7px; fill: #000000; display: inline-block; width:20px; height:20px; vertical-align: middle; } .fl-builder-block-thumbnail:before { content: ""; display:block; padding-top:50%; } .fl-builder-block-thumbnail img { max-width: 100%; max-height: 160px; margin: 0; object-fit: cover; } .fl-builder-blocks-section-content .fl-builder-block { box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); transition-property: box-shadow; transition-duration: .15s; } .fl-builder-blocks-section-content .fl-builder-block i, .fl-user-template-actions i { color: #000000; margin-right: 10px; } .fl-builder-blocks-section-content .fl-builder-block .fl-builder-block-details { position: relative; } .fl-builder-blocks-separator { background: #f1f1f1; height: 6px; } .fl-builder-block:hover .fl-builder-badge { background: #2ea2cc; } .ui-sortable-helper .fl-builder-badge { display: none !important; } /* Lite version modules CTA */ .fl-builder-modules-cta a { color: #999 !important; display: block !important; font-size: 12px !important; font-style: italic !important; padding: 15px 20px !important; line-height: 16px !important; } .fl-builder-modules-cta a:hover { background: #e5e5e5 !important; color: #666 !important; text-decoration: none !important; } .fl-builder-modules-cta a:focus { text-decoration: none !important; } .fl-builder-modules-cta .fa { float: right !important; font-size: 14px !important; margin: 3px 0px 0 9px !important; } .fl-builder--panel-message { text-align: center; padding:40px 20px; font-size: 16px; } .fl-builder--panel-message .fl-builder-button { display: inline-block; padding:10px; } .fl-builder--panel-cta { padding: 20px 30px; font-size:16px; text-align: center; } .fl-builder--panel-cta a { color:inherit; text-decoration: none; } .fl-builder--panel-cta a:hover { text-decoration: none; } /* Builder Panel Templates ------------------------------------------------------ */ .fl-builder-block-template-image { margin: 5px 0 10px; max-width: 100%; border: 1px solid #dfdfdf; } .fl-builder-block .fl-builder-block-title { overflow: hidden; text-overflow: ellipsis; vertical-align: middle; line-height: 1.3; } .ui-sortable-helper .fl-builder-block-template-image { display: none !important; } @keyframes fl-builder-template-item-enter { from { transform: translateY(100px) scale(.3); opacity:0; } to { transform: scale(1); opacity:1; } } .fl-builder--template-collection { clear:both; padding:10px 0; } .fl-builder--template-collection-section-content { padding: 0 10px; } .fl-builder--template-collection-item { box-sizing: border-box; width: 50%; float:left; padding:10px; cursor: pointer; font-size: 13px; transform-origin: center; opacity: 1; } .fl-builder--template-thumbnail { background-size: cover; background-clip: content-box; background-position: center top; background-color:white; border:2px solid transparent; transform-origin: bottom; transition-property: transform, box-shadow; transition-duration: .15s; } .fl-builder--template-collection-item[data-id="0"] .fl-builder--template-thumbnail { border-color: #e4e7ea; } .fl-user-template .fl-builder--template-thumbnail { border-color: #e4e7ea; } .fl-builder--template-thumbnail:before { display:block; content: ""; padding-top:120%; } .fl-builder--template-thumbnail:hover { transform: scale(1.05); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.08); } .fl-builder--template-name { text-align: center; padding:4px 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .fl-builder--template-collection-section { padding-bottom: 10px; border-bottom: 1px solid #dfdfdf; } .fl-builder--template-collection-section:after, .fl-builder--template-collection-section:before { content: ""; display: block; clear:both; } .fl-builder--template-collection-section-name { padding: 15px 10px 10px; } .fl-builder--template-collection-section-name:before, .fl-builder--template-collection-section-name:after, .fl-builder--template-collection-section-content:before, .fl-builder--template-collection-section-content:after { } /* Builder Panel Node Templates ------------------------------------------------------ */ span.fl-builder-block-no-node-templates { display: block; padding: 15px 20px; text-align: center; } span.fl-builder-block-no-node-templates:hover { cursor: default; } .fl-builder-blocks-node-template .fl-builder-block { position: relative; } .fl-builder-blocks-section-content .fl-builder-node-template-actions { bottom: 0; cursor: default; display: none; position: absolute; right: 0; top: 0; } .fl-builder-blocks-section-content .fl-builder-node-template-edit, .fl-builder-blocks-section-content .fl-builder-node-template-delete { display: inline; cursor: pointer; margin: 0; padding: 15px 10px; text-align: center; width: 30px; } .fl-builder-block-details .fl-builder-node-template-edit, .fl-builder-block-details .fl-builder-node-template-delete { padding-top: 0 !important; } .fl-builder-blocks-section-content .fl-builder-node-template-edit i, .fl-builder-blocks-section-content .fl-builder-node-template-delete i { margin: 0; } .fl-builder-blocks-section-content .fl-builder-node-template-edit:hover i, .fl-builder-blocks-section-content .fl-builder-node-template-delete:hover i { color: #444444; } .fl-builder-blocks-node-template .fl-builder-block:hover .fl-builder-node-template-actions { display: block; } .ui-sortable-helper .fl-builder-node-template-edit, .ui-sortable-helper .fl-builder-node-template-delete { display: none !important; } /* @endgroup Content Panel */ /* @group Panel ------------------------------------------------------ */ .fl-builder--tabs { display: flex; flex-direction: row; position: relative; justify-content: flex-start; align-items: center; } .fl-builder-panel .fl-builder--panel-header { cursor:move; position: absolute; top: 0; left: 0; right: 0; z-index: 9; } .fl-builder-panel .fl-builder--tabs { justify-content: space-around; padding: 0 24px; min-height: 46px; cursor: pointer; } .fl-builder--tab-wrap { flex: 1 1 100%; display: flex; flex-direction: row; align-items: stretch; justify-content: space-between; } .fl-builder--tabs button, .fl-builder--tabs button:hover, .fl-builder--tabs button:focus, .fl-builder--tabs button:active { flex:1 1 100%; display: inline-block; text-decoration: none; color:inherit; text-align: center; letter-spacing: normal !important; padding:5px; cursor: pointer; font-size: 14px !important; font-weight: 600 !important; line-height: 1.4 !important; background: transparent !important; outline: none !important; border: 2px solid transparent; border-radius: 4px; margin: 7px 0px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important; top:0; /* fix default button active */ transition-property: background, color; transition-duration: .25s; } .fl-builder--tabs button:focus { background: #e6eaed !important; } .fl-builder--tabs button.is-showing { /* active tab */ color: #0086b0; } .fl-builder--panel-view { display: none; overflow: hidden; } .fl-builder--panel-view.is-showing { display: block; } .fl-builder--content-library-panel .fl-builder--panel-view.is-showing { position: absolute; top: 96px; bottom:0; left:0; right:0; width: auto; height: auto; } .fl-builder--content-library-panel.single-view .fl-builder--panel-view.is-showing { top: 52px; } .fl-builder--content-library-panel.ui-draggable-dragging { height: 500px !important; } .fl-builder--content-library-panel .fl-builder-drop-zone { display: none !important; } .fl-builder--panel-header .fl-builder--tabs { cursor: move; } .fl-builder--category-select { display: flex; flex-direction: column; position: relative; } .fl-builder--selector-display { display: flex; flex-direction: row; position: relative; justify-content: space-between; align-items: center; color: #161B20; background: white url(../img/svg/select-arrow-down-alt2.svg) no-repeat center right 10px !important; cursor: pointer; font-size: 13px; font-weight: 700; line-height: 16px; border-radius: 4px; } .fl-builder--selector-display-label { display: flex; flex-direction: row; font-size: inherit; line-height: inherit; width: 100%; padding:0 !important; color: #6D6D6D; background: none; border: 2px solid #e4e7ea; border-radius: 4px; font-family: inherit; } .fl-builder--selector-display-label:hover, .fl-builder--selector-display-label:active { top:0; color: inherit; background: none; border: 2px solid #e4e7ea; border-radius: 4px; } .fl-builder--selector-display-label:focus { top:0; color: inherit; background:none; border: 2px solid #00A0D2; outline: none; } .fl-builder--group-label { color: inherit; flex: 0 0 0%; padding: 9px 10px; padding-right: 12px; background: #e6eaed; border-top-left-radius: 2px; border-bottom-left-radius: 2px; } .fl-builder--current-view-name { flex: 1 1 100%; color: inherit; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; padding: 9px 10px; text-align: left; } .fl-builder--selector-menu { display: none; overflow:auto; color: #293138; position: absolute; top: 46px; left: 0; width: 100%; background: white; border-radius: 4px; box-shadow: 0px 0px 20px 2px rgba(0, 0, 0, 0.2); overflow: visible; } .fl-builder--selector-menu:before { bottom: 100%; right: 8px; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border: solid; border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; border-width: 10px; margin-left: -10px; } .fl-builder--category-select.is-showing .fl-builder--selector-menu { display: flex; max-height: calc(100vh - 150px); } .fl-builder--category-select.is-showing .fl-builder--selector-menu .fl-builder--menu { margin:10px 0; flex: 1 100%; overflow: auto; } button.fl-builder-button.fl-builder-bar-title-caret { margin:4px; } button.fl-builder-button.fl-builder-bar-title-caret:focus { background-color: #e6eaed !important; border-color: transparent !important; } .fl-builder--category-select.is-showing .fl-builder-bar-title-caret i { transform: rotate(180deg); } .fl-builder--menu { padding:4px; margin-bottom:2px; } .fl-builder--menu > span, .fl-builder--menu > a, .fl-builder--menu > button { display: block; padding:8px 10px 10px; border-radius: 4px; color:inherit; text-decoration: none; background:transparent !important; border: 2px solid transparent !important; font-weight: normal; font-family: inherit; } .fl-builder--menu > a:hover, .fl-builder--menu > button:hover, .fl-builder--menu > a:active, .fl-builder--menu > button:active { top:0; background: #e6eaed !important; border: 2px solid transparent !important; } .fl-builder--menu > a:focus, .fl-builder--menu > button:focus { top:0; outline:none; color:inherit; background: #e6eaed !important; border: 2px solid transparent !important; text-decoration: none; } .fl-builder--menu .fl-inset { padding-left:35px; font-size: 14px; line-height: 1.25; } .fl-builder--menu a.fl-template-collection { color: #161B20; } .fl-builder--menu > *:after { clear:both; } .fl-builder--menu * .fl-builder--menu-item-accessory { float:right; color: #000000; text-transform: uppercase; text-align: center; min-width: 20px; letter-spacing: 2px; } .fl-builder--menu * .fl-builder--menu-item-accessory i { font-size:1em; margin-top:2px; } .fl-builder--menu hr { margin:4px 30px; } .fl-builder--menu .fl-builder-video-wrap iframe { display: block; margin:4px 0; width: 100%; } /* @endgroup Admin Panel */ /* @group Publish Actions */ .fl-builder-publish-actions { display: flex; box-sizing: border-box; position: absolute; top:0; right:0; width: 380px; max-width: 100%; height:46px; padding: 4px; flex-direction: row; justify-content: flex-end; opacity:1; pointer-events: auto; transform: scaleX(1) translateX(0px); transform-origin: right; transition-property: transform, opacity; transition-duration: .15s; } .fl-builder-publish-actions.is-hidden { transform: scaleX(.23) translateX(68px); opacity:0; pointer-events: none; } .fl-builder-bar .fl-builder-button-group { display: flex; flex-basis: 100%; } .fl-builder-bar .fl-builder-button-group > .fl-builder-button { border-radius: 0; margin-left: 0px; flex-basis: 100%; text-align: center; justify-content: space-around; } .fl-builder-bar .fl-builder-button-group > .fl-builder-button { box-shadow:none; } .fl-builder-bar .fl-builder-button-group > .fl-builder-button:first-child { margin-left:0; border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .fl-builder-bar .fl-builder-button-group > .fl-builder-button:last-child { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .fl-builder-publish-actions-click-away-mask { display: none; position: fixed; top:0; left:0; right:0; height:100vh; background: transparent; } /* @endgroup Publish Actions */ /* @group Drag and Drop ------------------------------------------------------ */ .fl-builder-dragging .fl-builder-content:not(.fl-builder-empty) { padding: 16px 0; } .fl-builder-empty { display: none; border: 2px dashed #969696; border-radius: 8px; color: #909090; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 20px; font-weight: 700; margin: 10px; padding: 250px 20px; position: relative; text-align: center; text-transform: uppercase; } .fl-builder-edit .fl-builder-empty { display: block; } .fl-builder-block.ui-draggable-dragging, .fl-builder-block-drag-helper { background: rgba( 255, 255, 255, 0.95 ) !important; border: 2px solid #000000; border-radius: 4px; box-shadow: 0 0 8px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 8px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 8px rgba(0,0,0,0.2); color: #333333 !important; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 13px !important; height: 47px !important; line-height: 40px !important; overflow: hidden; padding: 0 20px; position: fixed !important; text-overflow: ellipsis; white-space: nowrap; width: 180px !important; z-index: 100010 !important; display:flex; flex-direction:row; align-content: center; justify-content: flex-start; } .fl-builder-block.fl-builder-block-drag-helper:hover { padding:0; box-shadow: none; } .fl-builder-block-drag-helper:hover .fl-builder-block-content { position: static; padding: 0 20px; } .fl-builder-block-saved-row.fl-builder-block-drag-helper:hover .fl-builder-block-content, .fl-builder-block-saved-column.fl-builder-block-drag-helper:hover .fl-builder-block-content, .fl-builder-block-saved-module.fl-builder-block-drag-helper:hover .fl-builder-block-content { padding: 14px 20px; } .fl-builder-block-drag-helper .fl-builder-block-icon { fill: #000000; margin-top:-10px; } .fl-builder-drop-zone { animation: fl-builder-drop-zone-pulse 2s infinite; background: #00A2D7; border-radius: 4px; color: #fff !important; display: block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: normal; font-size: 12px; letter-spacing: 1px; line-height: 14px; margin: 10px; padding: 6px 8px 5px; position: relative; text-align: left; text-overflow: ellipsis; text-shadow: none; text-transform: none; white-space: nowrap; overflow: hidden; z-index: 10; } @keyframes fl-builder-drop-zone-pulse { 0% { background-color: #00A2D7; } 50% { background-color: #79DEFF; } 100% { background-color: #00A2D7; } } .fl-builder-drop-zone-global { animation: fl-builder-drop-zone-global-pulse 2s infinite; background: #ff9600; } @keyframes fl-builder-drop-zone-global-pulse { 0% { background-color: #FFBC5C; } 50% { background-color: #ff9600; } 100% { background-color: #FFBC5C; } } .fl-builder-content > .fl-builder-drop-zone { margin: 10px 20px; } .fl-row-content > .fl-builder-drop-zone { margin: 3px 7px; } .fl-col-has-cols > .fl-col-content > .fl-builder-drop-zone { margin: 3px 10px; } .fl-sortable-disabled > .fl-builder-drop-zone { display: none !important; } .fl-col-group-equal-height.fl-col-group-align-center .fl-col-content > .fl-builder-drop-zone { width: 100%; } /* Row Highlights */ .fl-row-highlight { padding: 16px 0; } .fl-row-highlight .fl-row-content { border:2px dashed rgba(203, 205, 206, .5); padding: 8px; border-radius: 6px; } .fl-row-highlight.fl-node-global .fl-row-content { border-color: #ff9600; } .fl-row-highlight .fl-col-group { position: relative; } /* Column Highlights */ .fl-col-highlight { padding: 8px; position: relative; } .fl-col-highlight .fl-col-content { border-style: dashed !important; border-color: #00a0d2 !important; border-top-width: 2px !important; border-bottom-width: 2px !important; border-left-width: 2px !important; border-right-width: 2px !important; border-radius: 4px; min-height: 100px; overflow-x: hidden; width: 100%; } .fl-col-has-cols.fl-col-highlight > .fl-col-content { padding: 8px; } .fl-col-highlight.fl-node-global .fl-col-content { border-color: #ff9600 !important; } .fl-builder-simple .fl-col-highlight .fl-col-content { border: none !important; } /* Column Highlight Guides */ .fl-col-has-highlight-guide .fl-col-content { position: relative; } .fl-col-highlight-guide { background: rgba(0, 160, 210, 0.05); border: 2px solid #00A0D2; border-radius: 4px; bottom: 4px; left: 4px; position: absolute; right: 4px; top: 4px; z-index: 1; } .fl-node-global .fl-col-highlight-guide { border-color: #ff9600 !important; background-color: rgba(255, 150, 0, 0.06) !important; } .fl-col-has-highlight-guide .fl-block-overlay { background: none; border-color: transparent; } .fl-col-has-highlight-guide .fl-block-col-resize { display: none; } .fl-col-has-highlight-guide .fl-col-highlight .fl-col-content { border-color: transparent !important; } /* Column Drop Targets */ .fl-col-drop-target { bottom: 8px; display: none; left: -9px; position: absolute; top: 8px; width: 18px; z-index: 1; } .fl-col-highlight .fl-col-drop-target { display: block; } .fl-col-drop-target-last { left: auto; right: -9px; } .fl-col-drop-target .fl-builder-drop-zone { bottom: 0; left: 2px; margin: 0; padding: 0; position: absolute; right: 2px; top: 0; } /* Column Group Drop Targets */ .fl-col-group-drop-target { display: none; left: 8px; height: 18px; position: absolute; right: 8px; top: -9px; z-index: 1; } .fl-row-highlight .fl-col-group-drop-target { display: block; } .fl-col-group-drop-target-last { top: auto; bottom: -9px; } .fl-col-group-drop-target .fl-builder-drop-zone { bottom: 2px; left: 0; margin: 0; padding: 0; position: absolute; right: 0; top: 2px; } .fl-row-content > .fl-col-group-drop-target { position: static; } .fl-row-content > .fl-col-group-drop-target .fl-builder-drop-zone { height: 18px; position: static; } /* Row Drop Targets */ .fl-row-drop-target { display: none; left: 0; height: 24px; margin-top: -28px; position: absolute; right: 0; z-index: 1; } .fl-row-highlight .fl-row-drop-target { display: block; } .fl-row-drop-target-last { margin-top: 0; margin-top: 4px; } .fl-row .fl-row-drop-target .fl-builder-drop-zone { bottom: 0; left: 4px; margin: 0; position: absolute; right: 4px; top: 0; } /* Main Layout Row Drop Target */ .fl-builder-content > .fl-row-drop-target { margin: 0; position: static; } .fl-builder-dragging .fl-builder-content.fl-builder-empty > .fl-row-drop-target { bottom: 10px; display: block; height: auto; left: 0; position: absolute; right: 0; top: 10px; } .fl-builder-content .fl-row-drop-target .fl-builder-drop-zone { margin-bottom: 0; margin-top: 0; } /* Nodes */ .fl-module:focus, .fl-row:focus, .fl-col-group:focus, .fl-col:focus { outline:none; } /* Sortable Proxies */ .fl-sortable-proxy { display: none; } /* Action Overlays ------------------------------------------------------ */ .fl-block-overlay, .fl-block-overlay * { text-shadow: none; -webkit-touch-callout: none; } .fl-block-overlay-active { position: relative; } .fl-block-overlay-actions { background: #00A0D2; float: left; height: 30px; margin: -1px -1px 0; padding: 0 4px; text-shadow: none; border-bottom-right-radius: 5px; border-top-left-radius: 3px; } .fl-row-overlay-header-bottom .fl-block-overlay-actions { border-radius: 0; border-top-right-radius: 5px; border-bottom-left-radius: 3px; } .fl-builder-col-resizing .fl-block-overlay-actions, .fl-builder-row-resizing .fl-block-overlay-actions { overflow: hidden; } .fl-block-overlay-actions > span { display: block; float: left; } .fl-block-overlay-actions i { color: #fff !important; cursor: pointer; display: block !important; float: left; font-size: 16px !important; height: 28px !important; /* font-weight: 100 !important; */ line-height: 28px !important; opacity: 0.8; filter: alpha(opacity = 80); text-align: center; width: 32px !important; } .fl-block-overlay-actions i:hover { opacity: 1; filter: alpha(opacity = 100); } .fl-block-overlay-actions > i:first-child { padding-left: 4px; } .fl-block-overlay-actions > i:last-child { padding-right: 2px; } .fl-block-overlay-actions .fl-block-move { cursor: move; } .fl-block-has-rules { color: #00A0D2 !important; cursor: pointer; padding: 7px; position: absolute; right: 0; top: 0; } .fl-block-overlay-title { color: #fff !important; float: left; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 14px; height: 30px; line-height: 29px; margin-right: 2px; padding: 0 12px 0 8px; } /* Row Overlays */ .fl-row-overlay { background: rgba(190, 239, 255, 0); border: 2px solid #00A0D2; border-radius: 4px; bottom: 0; box-sizing: border-box !important; -moz-box-sizing: border-box !important; -webkit-box-sizing: border-box !important; color: #fff; left: 0; position: absolute; top: -33px; right: 0; z-index: 100006; } .fl-row-overlay.fl-row-menu-active, .fl-row-overlay.fl-row-menu-active.fl-block-overlay.fl-block-overlay-global { z-index: 100007; } .fl-row-full-width .fl-row-overlay { left: 2px; right: 2px; bottom: 2px; } .fl-row-overlay-header-bottom { bottom: -32px !important; top: 0; } .fl-row-overlay-header-bottom .fl-block-overlay-header { position: absolute; bottom: 0; } .fl-block-overlay-active .fl-row-content-wrap { position: relative; } .fl-block-overlay-active .fl-row-content { position: relative; z-index: 100007 !important; } /* Row Resizing */ .fl-builder-row-resizing .fl-col.fl-block-overlay-active, .fl-builder-row-resizing .fl-module.fl-block-overlay-active { position: static; } /* Column Overlays */ .fl-col-overlay { background: rgba(190, 239, 255, 0); border: 2px solid #00A0D2; border-radius: 4px; bottom: 8px; cursor: pointer; color: #fff; left: 8px; position: absolute; right: 8px; top: 8px; z-index: 100008; } /* Module Overlays */ .fl-module-overlay { background: rgba(190, 239, 255, 0); border: 2px solid #00A0D2; border-radius: 4px; bottom: 4px; cursor: pointer; color: #fff; left: 4px; min-height: 32px; position: absolute; right: 4px; top: 4px; z-index: 100007; } .fl-builder-global-templates-locked .fl-block-overlay-global.fl-module-overlay { cursor: default; } .fl-module-adjust-height { padding-bottom: 15px; padding-top: 15px; } /* Global Overlays */ .fl-block-overlay-global { background: rgba(255, 150, 0, 0); border: 2px solid #F7A407; border-radius: 4px; } .fl-block-overlay-global .fl-block-overlay-actions { background: #F7A407; } .fl-block-overlay-title-global { background: #fff; color: #ff9600 !important; font-size: 11px; letter-spacing: 1px; margin-left: 4px; padding: 2px 4px; vertical-align: top; } /* Global Row Overlays */ .fl-block-overlay-global.fl-row-overlay { background: rgba(255, 150, 0, 0); cursor: pointer; z-index: 100007; } .fl-builder-global-templates-locked .fl-block-overlay-global.fl-row-overlay { cursor: default; } .fl-builder-row-template .fl-block-overlay-global.fl-row-overlay { background: rgba(255, 150, 0, 0); cursor: default; z-index: 100006; } .fl-block-overlay-global.fl-row-overlay .fl-block-col-resize { display:none; } /* Muted Overlays */ .fl-block-overlay-muted .fl-row-overlay { background: rgba(85, 93, 102, 0); border: 2px solid #555D66; } .fl-block-overlay-muted .fl-row-overlay .fl-block-overlay-actions { background: #555D66; } .fl-block-overlay-muted .fl-row-overlay .fl-block-has-rules { color: #555D66 !important; } .fl-block-overlay-muted .fl-row-overlay .fl-block-col-resize { display:none; } /* Disabled Overlays */ .fl-node-disabled .fl-row-content-wrap, .fl-node-disabled > .fl-col-content { opacity: 0.3; } /* Column Resize Handles */ .fl-block-col-resize { bottom: 0 !important; position: absolute; top: 0 !important; width: 6px; } .fl-block-col-resize-e { cursor: ew-resize; left: auto !important; right: -2px !important; } .fl-block-col-resize-w { cursor: ew-resize; left: -7px !important; } .fl-block-col-resize-handle-wrap { margin: -4px 0 0 -5px; padding: 0 5px; position: absolute; top: 50% !important; } .fl-block-col-resize-e .fl-block-col-resize-handle-wrap { margin-left: -6px; } .fl-block-col-resize-handle { background: #fff; border: 2px solid #00A0D2; border-radius: 50%; height: 12px; width: 12px; } .fl-node-global .fl-block-col-resize-handle { border-color: #ff9600; } .fl-block-col-resize-feedback { color: #333 !important; display: none; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 11px !important; position: absolute; } .fl-block-col-resize-feedback-left, .fl-block-col-resize-feedback-right { background: #fff; border: 1px solid #3ba0ff; padding: 2px 4px; } .fl-block-col-resize-feedback-left { right: 20px; top: -7px; } .fl-block-col-resize-feedback-right { left: 20px; top: -7px; } /* Builder Submenus ------------------------------------------------------ */ .fl-builder-has-submenu { position: relative; } .fl-builder-has-submenu > ul.fl-builder-submenu { background: #00A0D2; box-shadow: 0 0 20px rgba(0,0,0,0.20); border-radius: 4px; border-top-left-radius: 0; display: none; left: 0; list-style: none; margin: 0; padding: 6px 0; position: absolute; text-align: left; top: 100%; width: 165px; z-index: 100008; } .fl-builder-has-submenu > ul.fl-builder-submenu li { list-style: none; margin: 0; padding: 0; } .fl-builder-submenu-right ul.fl-builder-submenu { left: auto; right: 0; } .fl-builder-has-submenu.fl-builder-submenu-open > ul.fl-builder-submenu { display: block; } .fl-builder-has-submenu > ul.fl-builder-submenu li a { border-bottom: 0 none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; color: #fff !important; display: block; line-height: 13px; font-size: 13px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: normal; opacity: 0.8; filter: alpha(opacity = 80); overflow: hidden; padding: 6px 12px; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; } .fl-builder-has-submenu > ul.fl-builder-submenu li a:hover { background: #0197C6; color: #fff; opacity: 1; filter: alpha(opacity = 100); text-decoration: none; } /* Nested Submenus */ .fl-builder-has-submenu .fl-builder-submenu .fa, .fl-builder-has-submenu .fl-builder-submenu .fas, .fl-builder-has-submenu .fl-builder-submenu .far { float: right; height: 12px !important; line-height: 12px !important; position: relative; right: -5px; width: 14px !important; } .fl-builder-has-submenu .fl-builder-has-submenu .fl-builder-submenu { display: none; left: 100%; top: 0; } .fl-builder-has-submenu .fl-builder-submenu-right.fl-builder-has-submenu .fl-builder-submenu { left: auto; right: 100%; } .fl-builder-has-submenu .fl-builder-has-submenu:hover .fl-builder-submenu { display: block; } /* Submenu Item Separators */ .fl-builder-submenu-sep { padding: 7px 0px !important; } .fl-builder-submenu-sep div { border-bottom: 1px solid rgba( 255, 255, 255, 0.4 ); } /* Parent Column Controls */ .fl-block-col-move, .fl-block-col-move-parent { cursor: move; position: relative; } /* Submenu Move Icons */ .fl-builder-submenu .fa-arrows-alt { cursor: move; display: none !important; } .fl-builder-submenu a:hover .fa-arrows-alt { display: block !important; float:right; line-height: 12px !important; height: 12px !important; } /* Global Submenus */ .fl-block-overlay-global ul.fl-builder-submenu { background: #ff9600 !important; } .fl-block-overlay-global ul.fl-builder-submenu li a:hover { background: #ffaa33; } /* @endgroup Drag and Drop */ /* @group Actions Lightbox ------------------------------------------------------ */ .fl-builder-actions-lightbox .fl-lightbox { display: block; width: 300px; border-radius: 4px; } .fl-builder-actions-lightbox .fl-lightbox-content-wrap { display: block; } .fl-builder-actions-lightbox .fl-builder-actions { display: flex; flex-direction: column; padding: 25px; text-align: center; } .fl-builder-actions-title { color: #333 !important; display: block; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 16px !important; margin-bottom: 20px; } .fl-builder-actions .fl-builder-button { display: flex; justify-content: center; margin-bottom: 7px; min-height: 36px; } /* @endgroup Actions Lightbox */ /* @group Alert Lightbox ------------------------------------------------------ */ .fl-builder-alert-lightbox { padding: 20px; z-index: 30000000; top: 0; pointer-events: auto; } .fl-builder-alert-lightbox .fl-lightbox { max-width: 440px; width: auto; } .fl-builder-alert-lightbox .fl-lightbox-content-wrap { display: block; } .fl-builder-alert-lightbox .fl-lightbox-message { color: #333 !important; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 16px !important; line-height: 24px; padding: 30px; } /* @endgroup Alert Lightbox */ /* @group Template Selector ------------------------------------------------------ */ @keyframes fl-builder-content-section-entry { from { transform: translateY(150px) translateX(100px) scale(.3); opacity:0; } to { transform: translateY(0px) translateX(0px) scale(1); opacity:1; } } .fl-template-category-select { width: 180px !important; } .fl-template-selector .fl-builder-settings-section { margin: 0 0 10px; } .fl-template-selector .fl-builder-settings-fields { height: 470px; } .fl-template-selector .fl-builder-settings-tab { width: 560px; } .fl-template-selector .fl-builder-settings-tab-description { font-size: 15px!important; margin: 0 !important; padding: 10px 0 25px; text-align: center; } .fl-template-preview { float: left; margin: 0 25px 30px 0; position: relative; text-align: center; width: 170px; } .fl-template-preview.fl-last { margin-right: 0; } .fl-template-image { border: 1px solid #d9d9d9; cursor: pointer; margin-bottom: 12px; height: 164px; overflow: hidden; } .fl-template-image:hover { border-color: #ff0000; } .fl-template-image img { max-height: none; width: 100%; } .fl-template-preview span { display: block; text-align: center; } .fl-user-template-category-name { background: #f2f2f2; border-bottom: 3px solid #dfdfdf; border-top: 2px solid #dfdfdf; font-weight: bold; padding: 8px 15px; } .fl-user-templates { border-bottom: 1px solid #dfdfdf; padding: 10px 0 20px; } .fl-builder--user-templates-section-content { padding-top: 10px; padding-left: 10px; padding-right: 10px; padding-bottom: 10px; border-bottom: 2px solid #e6eaed; } .fl-builder--user-templates-section-content:first-child { padding-top:0; } .fl-user-templates:last-child, .fl-builder--user-templates-section-content:last-child { border-bottom: none; } .fl-builder--user-templates-section-name { font-weight: bold; font-size: 16px; padding-top: 30px; color: #333333; z-index: 9999; padding: 15px 10px; margin: 0 10px; } @keyframes fl-list-item-entry { from { opacity:0; transform: scale(.5) translateY(100px); } to { opacity:1; transform: scale(1) translateY(0px); } } .fl-user-template, .fl-builder--save-new-user-template { position: relative; display: flex; flex-direction: row; align-items: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-radius: 4px; font-size: 16px; font-weight: 200; line-height: 1.1; padding: 10px 20px; color: #6d6d6d; } .fl-user-template:hover { cursor: pointer; background: #ffffff; box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.08); text-decoration: none; color: #111111; padding-right:68px; } .fl-user-template-name { overflow: hidden; text-overflow: ellipsis; flex:1; } .fl-user-template-actions { display:none; bottom: 0; position: absolute; right: 0; top: 0; } .fl-user-template:hover .fl-user-template-actions { display: flex; flex-direction: row; align-items: center; } .fl-user-template-actions a { display: inline-block; padding: 15px 0; width:30px; } .fl-user-template:hover a:hover i { color: #444444 !important; } .fl-user-templates-message { display: none; } .fl-user-template-thumbnail { flex:0; margin-right:20px; } .fl-user-template-thumbnail .fl-builder--template-thumbnail { background-size: cover; background-position: center top; } .fl-user-template-thumbnail .fl-builder--template-thumbnail:hover { box-shadow: none; transform: scale(1); transition-property: none; } .fl-user-template-thumbnail .fl-builder--template-thumbnail { width:45px; } .fl-builder--save-new-user-template .fl-user-template-thumbnail .fl-builder--template-thumbnail { border-style: dashed; border-width: 2px; border-color: #ccd4da; } .fl-builder--save-new-user-template .fl-save-control { display: flex; flex-direction: row; flex:1; } .fl-builder--save-new-user-template .fl-save-control input { background:transparent; border:none !important; flex:1; font-size: 16px; margin-right:10px; margin-left: -12px; color: #000; } .fl-builder--save-new-user-template .fl-save-control input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #777; } .fl-builder--save-new-user-template .fl-save-control input::-moz-placeholder { /* Firefox 19+ */ color: #777; } .fl-builder--save-new-user-template .fl-save-control input:-ms-input-placeholder { /* IE 10+ */ color: #777; } .fl-builder--save-new-user-template .fl-save-control input:-moz-placeholder { /* Firefox 18- */ color: #777; } @keyframes fl-slide-in-right { from { transform: translateX(50px); } to { transform: translateX(0px); } } .fl-builder--save-new-user-template .fl-save-control button { display: none; animation-name: fl-slide-in-right; animation-duration: .25s; background-color: #00a0d2; border: none; padding: 0 15px; } .fl-save-control-mask { display:none; background: transparent; position: absolute; top: -50px; left: 0; bottom: 0; right: 0; z-index: -1; min-height: 80vh; } /* Lite version templates CTA */ .fl-builder-templates-cta { margin-bottom: 20px; } .fl-builder-templates-cta p { display: inline-block !important; width: 75% !important; font-size: 14px !important; line-height: 1.5 !important; margin-bottom: 0 !important; } .fl-builder-templates-cta .fl-builder-upgrade-button { font-size: 13px !important; line-height: 13px !important; position: relative; top: 8px; left: 15px; padding: 1px 12px; } /* @endgroup Template Selector */ /* @group User Template Editing ------------------------------------------------------ */ .single-fl-builder-template .fl-content { width: 100% !important; } /* @endgroup User Template Editing */ /* @group Settings Lightboxes ------------------------------------------------------ */ form.fl-builder-settings { height: 100%; margin: 0; padding: 0; display: flex; flex-direction: column; } .fl-builder-settings-message { font-size: 15px !important; line-height: 23px !important; padding: 20px 25px !important; background: #f2f2f2 !important; } .fl-builder-settings-message * { font-size: 15px !important; line-height: 23px !important; } .fl-builder-preview-loader { position: relative; top: -2px; margin-left: 3px; } .fl-lightbox-header .fl-builder-preview-loader { margin: 0; position: absolute; right: 40px; top: 15px; } @keyframes fl-grab-attention { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } } /* Slim Settings ------------------------------------------------------ */ .fl-lightbox-width-slim .fl-form-table { margin: 20px 25px 10px 15px !important; width: calc(100% - 60px); } .fl-lightbox-width-slim .fl-form-table th { display: block; position: relative; padding: 10px 0 0 12px !important; width: auto !important; } .fl-lightbox-width-slim .fl-form-table td { display: block; } .fl-lightbox-width-slim .fl-form-table td:first-child { padding-left: 10px !important; } .fl-lightbox-width-slim .fl-form-table .fl-field[data-type="editor"] td:first-child { padding-left: 0px !important; } .fl-field-label .fl-field-responsive-toggle { display:none; /* Hide label icons on wide settings */ } .fl-lightbox-width-slim .fl-field-control-wrapper .fl-field-responsive-toggle { display:none; /* Hide control icons on slim settings */ } .fl-lightbox-width-slim .fl-field-label .fl-field-responsive-toggle { display: inline-block; padding: 0 5px !important; } /* Slim - Selects */ .fl-lightbox-width-slim .fl-builder-settings-fields select { width: 100%; } /* Slim - Color Picker */ .fl-lightbox-width-slim .fl-color-picker { display: flex; width:auto; } .fl-lightbox-width-slim .fl-color-picker-clear { flex: 0 0 50px; } /* Slim - TinyMCE */ .fl-lightbox-width-slim .mce-menubtn.mce-fixed-width button { width: 72px !important; } .fl-lightbox-width-micro .mce-menubtn.mce-fixed-width button { width: 38px !important; } .fl-lightbox-width-micro .mce-btn[aria-label="Fullscreen"], .fl-lightbox-width-micro .mce-btn[aria-label="Blockquote"] { display: none; } /* Slim - Repeaters */ .fl-lightbox-width-slim .fl-builder-field-multiple { display: flex; flex-wrap: wrap; position: relative; } .fl-lightbox-width-slim .fl-builder-field-multiple .fl-field-label { width: 100% !important; } .fl-lightbox-width-slim .fl-builder-field-multiple .fl-field-control { width: 100% !important; } .fl-lightbox-width-slim .fl-builder-field-multiple .fl-builder-field-actions { position: absolute !important; top:0; right:0; width: 70px; } /* Slim - Time */ .fl-lightbox-width-slim .fl-field[data-type="time"] select { width: auto; } /* Settings Tabs ------------------------------------------------------ */ .fl-builder-settings-tabs { margin: 6px 6px 6px; border: 2px solid #e6eaed; border-radius: 4px; display: flex; flex-direction: row; overflow: hidden; } .fl-builder-content-group-select { padding: 0 10px 6px; } .fl-builder-content-group-select { display:none; /* Default to hidden */ } .fl-builder-content-group-select select { display: block; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; padding: 8px 10px; background: white url(../img/svg/select-arrow-down-alt2.svg) no-repeat center right 10px !important; border: 2px solid #e4e7ea; color: #161B20; } select:focus { border-width: 2px !important; border-style: solid !important; border-color: #00a0d2 !important; outline:none !important; } .fl-legacy-settings-tab { background: url(../img/ajax-loader.svg) center center no-repeat; height: 100px; } .fl-builder-settings-tab:first-child .fl-legacy-settings-tab { background: transparent; height: auto; } body .fl-builder-settings-tabs > * { box-sizing: border-box; color: #676F7A !important; fill: #676F7A !important; background: transparent; border: 2px solid transparent; border-radius:0; display: inline-block; margin: 0; outline: none; padding: 6px 15px; text-decoration: none !important; font-size: 14px; font-weight: normal !important; flex: 0 0 auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display:block; text-align: center; } body .fl-builder-settings-tabs > *:first-child { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } body .fl-builder-settings-tabs > *:last-child { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } body .fl-lightbox-width-slim .fl-builder-settings-tabs > * { flex: 1 1 auto; padding: 6px 8px; } body .fl-builder-settings-tabs > .fl-builder-settings-tabs-more { flex: 0 0 60px; display:none; margin-left:auto; justify-content: center; } .fl-builder-settings-tabs-more svg { width:16px; height:auto; fill:inherit; margin:auto; /* safari centering fix */ } .fl-builder-settings-tabs-more svg, .fl-builder-settings-tabs-more g, .fl-builder-settings-tabs-more path { fill:inherit; } body .fl-lightbox-has-tab-overflow .fl-builder-settings-tabs-more { display: flex; } .fl-builder-settings-tabs > *:hover, .fl-builder-settings-tabs > *:active { top:0; color: #333; background: transparent; border: 2px solid transparent; } .fl-builder-settings-tabs > *:focus { top:0; outline: none; border: 2px solid transparent; background: transparent; color: #0086b0; fill: #0086b0; } .fl-builder-settings-tabs .fl-active, .fl-builder-settings-tabs-more.fl-contains-active, .fl-builder-settings-tabs-overflow-menu .fl-active { color: #0086b0 !important; fill: #0086b0 !important; position: relative; background: #e6eaed; } .fl-builder-settings-tabs .fl-overflowed, .fl-builder-settings-tabs .fl-active.fl-overflowed { display:none !important; } .fl-builder-settings-tabs .error { color: #d03436; padding-right: 10px; } .fl-builder-settings-tabs .error .fl-error-icon, .fl-builder-settings-tabs-overflow-menu .error .fl-error-icon { background: url('../img/sprite.png') -148px -5px no-repeat; display: inline-block; height: 16px; margin-left: 7px; position: relative; top: 3px; width: 16px; } .fl-builder-settings-tabs-more.fl-contains-errors { fill: #d03436 !important; } .fl-builder-settings-tab { display: none; width: auto !important; } .fl-builder-settings-tab.fl-active { display: block; } .fl-builder-settings-tab-description { background: #e4e7ea; padding: 10px 15px; border-radius: 4px; margin: 20px 20px; } .fl-builder-settings-tab-description a { text-decoration: underline !important; } .fl-builder-settings-tab-description a:hover { color: #333; } .fl-builder-settings-tabs-overflow-menu { display:none; position: absolute; left: 0; right: 0; border: 2px solid #e6eaed; border-top: 3px solid #00a0d2; border-radius: 4px; background: white; z-index: 9999; margin: 0 6px; padding: 10px; flex-direction: column; box-shadow: 0px 0px 20px 2px rgba(0, 0, 0, 0.2); } .fl-builder-settings-tabs-overflow-menu:before { bottom: 100%; right: 20px; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border: solid; border-color: rgba(255, 255, 255, 0); border-bottom-color: #00a0d2; border-width: 10px; margin-left: -10px; } .fl-builder-settings-tabs-overflow-menu > a { display: block; padding: 10px 15px; font-size: 14px; font-weight: 600 !important; border:2px solid transparent; border-radius: 4px; outline:none; } .fl-builder-settings-tabs-overflow-menu > a:hover { background: #e6eaed; text-decoration: none; } .fl-builder-settings-tabs-overflow-click-mask { display: none; position: fixed; top:0; bottom:0; left:0; right:0; background:transparent; z-index: 9; } /* Settings Tables ------------------------------------------------------ */ .fl-form-table { background: none transparent; border: none; width: calc(100% - 35px); /* extra 25px for field connections toggle) */ } .fl-form-table tbody { border: none; } .fl-form-table tr, .fl-form-table tr:nth-child(even) { background: transparent; } .fl-form-table th { border: none !important; font-weight: normal !important; padding: 10px !important; padding-left:30px !important; text-align: left !important; vertical-align: top !important; width: 200px !important; background:transparent !important; } .fl-form-table td:first-child { padding-left:30px !important; } .fl-form-table th label { color: #333; width: auto; max-width: 100%; } .fl-form-table td { background: transparent !important; border: none !important; font-weight: normal !important; padding: 8px 10px; text-align: left !important; } .fl-lightbox-width-slim .fl-form-table td { padding: 4px 0 10px; } /* Settings Fields ------------------------------------------------------ */ .fl-builder-settings-fields { margin: 0; overflow: hidden; position: relative; flex: 1 100%; visibility: hidden; } .fl-lightbox-header .fl-builder-settings-fields { height: auto; margin: 0; position: absolute; right: 10px; top: 10px; } .fl-builder-settings-fields .fl-nanoscroller-content { padding: 0; } .fl-builder-settings-fields .fl-field-control-wrapper { position: relative; } .fl-field { animation-duration: .25s; animation-delay: .1s; } .fl-builder-settings-fields textarea, .fl-builder-settings-fields input[type=text], .fl-builder-settings-fields input[type=password], .fl-builder-settings-fields input[type=file], .fl-builder-settings-fields input[type=email], .fl-builder-settings-fields input[type=number], .fl-builder-settings-fields input[type=search], .fl-builder-settings-fields input[type=tel], .fl-builder-settings-fields input[type=url], .fl-builder-settings-fields select { background: #fff !important; border-color: transparent !important; border-style: solid; border-width: 2px; border-radius: 4px !important; box-shadow: 0 2px 4px 0 rgba(0,0,0,0.12); color: #333 !important; display: inline; font-size: 13px; height: auto; line-height: 15px; margin: 1px; outline: none; padding: 3px 9px; width: auto; box-sizing: border-box; } .fl-builder-settings-fields input[type=text], .fl-builder-settings-fields input[type=password], .fl-builder-settings-fields input[type=file], .fl-builder-settings-fields input[type=email], .fl-builder-settings-fields input[type=number], .fl-builder-settings-fields input[type=search], .fl-builder-settings-fields input[type=tel], .fl-builder-settings-fields input[type=url], .fl-builder-settings-fields select:not(multiple) { height: 36px !important; } .fl-builder-settings-fields select, .fl-builder-settings-fields select[multiple] { height: auto !important; } .fl-builder-settings-fields input[type=number] { width: 70px; } .fl-builder-lightbox .fl-builder-settings-fields textarea:focus, .fl-builder-lightbox .fl-builder-settings-fields input[type=text]:focus, .fl-builder-lightbox .fl-builder-settings-fields input[type=password]:focus, .fl-builder-lightbox .fl-builder-settings-fields input[type=file]:focus, .fl-builder-lightbox .fl-builder-settings-fields input[type=email]:focus, .fl-builder-lightbox .fl-builder-settings-fields input[type=number]:focus, .fl-builder-lightbox .fl-builder-settings-fields input[type=search]:focus, .fl-builder-lightbox .fl-builder-settings-fields input[type=tel]:focus, .fl-builder-lightbox .fl-builder-settings-fields input[type=url]:focus, .fl-builder-lightbox .fl-builder-settings-fields select:focus { border-width: 2px !important; border-style: solid !important; border-color: #00a0d2 !important; box-shadow: 0 2px 4px 0 rgba(0,0,0,0.12) !important; } .fl-builder-settings-fields ::-webkit-input-placeholder { /* WebKit browsers */ color: #999 !important; font-size: 13px; } .fl-builder-settings-fields input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #999; font-size: 13px; } .fl-builder-settings-fields ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #999 !important; font-size: 13px; } .fl-builder-settings-fields input:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #999; font-size: 13px; } .fl-builder-settings-fields label { display: inline-block; font-weight: normal; user-select: none; margin-bottom:3px; } .fl-builder-settings-fields select { -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; color: #000; margin: 0; margin-bottom: 2px; padding: 2px 10px; padding-right:30px !important; background: white url("../img/svg/select-arrow-down-alt2.svg") no-repeat center right 10px !important; } .fl-builder-settings-fields select[multiple] { height: 60px; background-image: none !important; } .fl-photo-field select, .fl-builder-custom-field select { -webkit-box-shadow: none; border-color: #e6eaed !important; } .fl-font-field .fl-font-field-font { margin-bottom:4px; width: calc( 70% - 5px ) !important; } .fl-font-field .fl-font-field-weight { width:30% !important; } /* Add predefined value dropdown for text field */ .fl-builder-settings-fields .fl-text-field-add-value { min-width: 50%; margin-top: .62em; } .fl-lightbox-width-slim input.text-full + .fl-field-description, .fl-lightbox-width-slim select + .fl-field-description { display: block; padding: 8px 10px; margin: 0; } /* Dimension Field */ .fl-field[data-type="dimension"] .fl-field-control-wrapper { display: flex; } .fl-field[data-type="dimension"] .fl-field-description { padding-top: 9px; } .fl-field[data-type="dimension"] .fl-field-responsive-toggle { padding: 9px 9px 0 0; } .fl-dimension-field-units { display: flex; } .fl-dimension-field-unit { padding-right: 5px; } .fl-dimension-field-unit input { max-width: 60px; width: auto !important; } .fl-dimension-field-unit label { padding: 5px 0 0; font-size: 12px; color: inherit !important; display: block; text-align: center; } /* Link Field */ .fl-link-field-search input { box-shadow: none !important; width: 100% !important; padding: 3px 9px !important; } .fl-link-field-search #as-original-link-search { width:100%; } .fl-builder-settings-section { border-top: 2px solid #E6EAED; } .fl-builder-settings-section:first-child { border-top: none !important; } .fl-custom-query .fl-builder-settings-section { border-top: 2px solid #E6EAED !important; /* custom for posts module */ } .fl-builder-settings-description { padding: 10px; padding-top: 0; margin: 0; font-style: italic; opacity: .75; } .fl-builder-settings-fields table { margin: 20px 0 20px; } .fl-builder-settings-fields h3.fl-builder-settings-title { display: inline-block; background: #E6EAED; padding:4px 10px; padding-left: 15px; margin:0; text-transform: uppercase !important; border-bottom-right-radius: 4px; font-size: 12px !important; font-weight: 700; user-select: none; } /* Core WordPress UI */ .wp-core-ui h1, .wp-core-ui h2, .wp-core-ui h3, .wp-core-ui h4, .wp-core-ui h5, .wp-core-ui h6 { color: #333; } .wp-core-ui .submitbox .submitdelete { color: #a00; } .wp-core-ui button { font-weight: normal; } .wp-core-ui textarea, .wp-core-ui input[type=text], .wp-core-ui input[type=password], .wp-core-ui input[type=file], .wp-core-ui input[type=email], .wp-core-ui input[type=number], .wp-core-ui input[type=search], .wp-core-ui input[type=tel], .wp-core-ui input[type=url], .wp-core-ui select { background-color: #fff; border-color: #dfdfdf; border-style: solid; border-width: 1px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; color: #333; font-weight: normal; } .wp-core-ui textarea:focus, .wp-core-ui input[type=text]:focus, .wp-core-ui input[type=password]:focus, .wp-core-ui input[type=file]:focus, .wp-core-ui input[type=email]:focus, .wp-core-ui input[type=number]:focus, .wp-core-ui input[type=search]:focus, .wp-core-ui input[type=tel]:focus, .wp-core-ui input[type=url]:focus, .wp-core-ui select:focus { background: transparent; border-color: #aaa; } .wp-core-ui input[type=search] { background-image: none; padding: 6px; } /* Responsive Options */ .fl-field-responsive-setting { display: inline-block; } .fl-field-responsive-setting-medium, .fl-field-responsive-setting-responsive { display: none; } i.fl-field-responsive-toggle { color: #808080; cursor: pointer; display: inline-block; font-size: 15px !important; height: auto; line-height: 18px !important; text-align: left; vertical-align: middle; width: 20px; } i.fl-field-responsive-toggle:hover { color: #000; } /* Text Field */ .fl-builder-settings-fields input.text-full { width: 100%; } /* Textarea */ .fl-builder-settings-fields textarea { width: 100%; } /* Color Picker */ .fl-color-picker { cursor: pointer; } .fl-color-picker .fl-color-picker-clear { box-sizing: border-box; } .fl-color-picker .fl-color-picker-clear:hover { background-color: #ededed; } .colorpicker input { padding: 0 !important; font-size: 11px !important; color: #fff !important; width: 29px !important; height: auto !important; background: transparent !important; border: none !important; } .colorpicker .colorpicker_hex input { width: 45px !important; } /* Custom Fields */ .fl-builder-custom-field { background:white; border: 2px solid transparent; border-radius: 4px; padding: 7px 10px; box-shadow: 0 2px 4px 0 rgba(0,0,0,0.12); min-height: 36px; box-sizing: border-box; } .fl-builder-field-multiple .fl-builder-custom-field { cursor: move; } .fl-builder-custom-field a { color: #21759b !important; text-decoration: underline !important; } .fl-builder-custom-field a:hover { color: #d54e21 !important; } .fl-builder-custom-field label.error { margin-top: 5px; } /* Photo Fields */ .fl-photo-field .fl-photo-preview { display: flex; } .fl-photo-field .fl-photo-select, .fl-photo-field.fl-photo-empty .fl-photo-preview { display: none; } .fl-photo-field.fl-photo-empty .fl-photo-select { display: block; } .fl-photo-field .fl-photo-preview-img { line-height: 0; margin: 5px 0; } .fl-photo-field .fl-photo-preview-img img { max-width: 60px; } .fl-photo-field .fl-photo-preview select { margin: 8px 0 8px 10px; width: 200px; } .fl-photo-field.fl-photo-no-attachment .fl-photo-preview select { display: none; } .fl-photo-field .fl-photo-preview-filename { display: none; font-size: 14px; font-weight: bold; margin: 7px 0 5px 11px; } .fl-photo-field.fl-photo-no-attachment .fl-photo-preview-filename { display: inline-block; word-break: break-all; } .fl-photo-field .fl-photo-edit { margin: 0 0 0 11px; } .fl-photo-field.fl-photo-no-attachment .fl-photo-edit { display: none; } .fl-photo-field .fl-photo-replace, .fl-photo-field .fl-photo-remove { margin: 0 0 0 8px; } /* Media Uploader */ .fl-builder-edit .media-modal { z-index: 9999991; } .fl-builder-edit .media-modal-backdrop { z-index: 999999; } .fl-builder-edit .media-frame { -webkit-backface-visibility: hidden; } .fl-builder-edit .media-modal-content h1 { font-family: inherit; } .fl-builder-edit .media-modal-content .thumbnail { padding: 0; border: none; border-radius: 0; } .fl-builder-edit button.media-modal-close { position: absolute; box-shadow: none; -webkit-box-shadow: none; } .fl-builder-edit .media-frame.hide-menu { visibility: visible; } span.select2-container.select2-container--open { z-index: 9999999; } /* Multiple Photo Fields */ .fl-multiple-photos-lightbox .gallery-settings, .fl-multiple-photos-field .fl-multiple-photos-select { display: none; } .fl-multiple-photos-field.fl-multiple-photos-empty .fl-multiple-photos-count, .fl-multiple-photos-field.fl-multiple-photos-empty .fl-multiple-photos-edit, .fl-multiple-photos-field.fl-multiple-photos-empty .fl-multiple-photos-add { display: none; } .fl-multiple-photos-field .fl-multiple-photos-add { margin: 0 0 0 8px; } .fl-multiple-photos-field.fl-multiple-photos-empty .fl-multiple-photos-select { display: inline; } .fl-multiple-photos-count { font-weight: bold; margin-bottom: 3px; } /* Video Fields */ .fl-video-field .fl-video-select, .fl-video-field.fl-video-empty .fl-video-preview { display: none; } .fl-video-field.fl-video-empty .fl-video-select { display: block; } .fl-video-field .fl-video-preview-img { float: left; line-height: 0; margin: 5px 0; } .fl-video-field .fl-video-preview-img img { max-width: 60px; } .fl-video-field .fl-video-preview-img .dashicons.dashicons-media-video { display: block; font-size: 60px; height: 60px; line-height: 60px; width: 60px; } .fl-video-field .fl-video-preview-filename { display: inline-block; font-size: 14px; font-weight: bold; margin: 7px 0 5px 11px; } .fl-video-field .fl-video-replace, .fl-video-field .fl-video-remove { margin: 0 0 0 11px; } /* Multiple Audio Fields */ .fl-multiple-audios-field .fl-multiple-audios-select, .fl-multiple-audios-field.fl-multiple-audios-empty .fl-multiple-audios-edit, .fl-multiple-audios-field.fl-multiple-audios-empty .fl-multiple-audios-add { display: none; } .fl-multiple-audios-field.fl-multiple-audios-empty .fl-multiple-audios-select { display: block; } .fl-multiple-audios-field .fl-multiple-audios-add { margin: 0 0 0 8px; } /* Icon Fields */ .fl-icon-field .fl-icon-select, .fl-icon-field.fl-icon-empty .fl-icon-preview { display: none; } .fl-icon-field.fl-icon-empty .fl-icon-select { display: block; } .fl-icon-field .fl-icon-preview i { display: inline-block; font-size: 28px; margin: 10px 10px 9px 10px; vertical-align: middle; } .fl-icon-field .fl-icon-remove { margin: 0 0 0 8px; } /* Text Editors */ .fl-builder-hidden-editor { display: none; } .fl-builder-settings .wp-switch-editor { background: #ebebeb; border: 1px solid #e5e5e5; border-radius: 0; color: #333; } .fl-builder-settings .wp-editor-container { border: 1px solid #e5e5e5; } .fl-builder-settings .mce-toolbar .mce-btn-group .mce-btn { margin: 2px 0; } .fl-builder-settings .mce-menubtn.mce-fixed-width button { width: 100px; } .fl-builder-settings .mce-menubtn.mce-fixed-width span { width: 100%; } .mce-close:hover, .mce-close:active, .mce-window .mce-btn button:hover, .mce-window .mce-btn button:active, .mce-toolbar .mce-btn button:hover, .mce-toolbar .mce-btn button:active { background: transparent; border: none; } .wp-core-ui .quicktags-toolbar input.button.button-small { margin: 1px !important; } .wp-editor-container textarea.wp-editor-area { background: transparent; border: none; padding: 10px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } /* Editor Link Modal */ .fl-builder-edit form#wp-link { color: #000; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 13px; } .fl-builder-edit form#wp-link #link-options label { display: block; margin-bottom: 2px; } .fl-builder-edit form#wp-link #link-options label span { padding-right: 10px; vertical-align: middle; } .fl-builder-edit form#wp-link #link-options input[type="text"] { display: inline-block; height: auto; margin: 5px 0 0; padding: 3px 5px; width: 80%; } .fl-builder-edit form#wp-link .query-results { top: 225px; } /* Code Editors */ .fl-code-field { border: 1px solid #E6E6E6; border-left: none; } .ace_editor, .ace_editor * { font-family: "Monaco", "Menlo", "Ubuntu Mono", "Droid Sans Mono", "Consolas", monospace !important; font-size: 12px !important; font-weight: 400 !important; letter-spacing: 0 !important; } /* Layout Fields */ .fl-layout-field-option { border: 2px solid #d9d9d9; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; box-sizing: border-box !important; -moz-box-sizing: border-box !important; -webkit-box-sizing: border-box !important; cursor: pointer; float: left; line-height: 0; max-width: 23%; margin: 0 1% 2%; padding: 5px; } .fl-layout-field-option-selected, .fl-layout-field-option:hover { border-color: #ff0000; } .fl-layout-field-option img { max-width: 100%; } /* Link Field */ .fl-link-field .fl-link-field-input-wrap { display: flex; flex-direction: row; } .fl-link-field-input { width: auto !important; flex: 1 1 100%; } .fl-link-field .fl-link-field-input-wrap button { flex: 0 0 0%; margin-left: 5px; } .fl-link-field-input {} .fl-link-field-search { display: none; border: 2px solid #e6eaed; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; margin: 4px 0 0 0; padding: 10px; } .fl-link-field-search-title { display: block; margin: 0 0 3px 2px; } .fl-link-field-search-cancel { margin-top: 6px; } /* Tooltips */ .fl-help-tooltip { display: inline-block; position: relative; } .fl-lightbox-width-slim .fl-help-tooltip { position: static; } .fl-help-tooltip-icon { color: #999 !important; cursor: pointer; /* font-family: Font Awesome\ 5 Free; */ font-size: 15px !important; padding: 5px; vertical-align: middle; } .fl-help-tooltip-text { box-sizing: border-box; background: #fff; border: 1px solid #ccc; box-shadow: 0 0 5px #ccc; -moz-box-shadow: 0 0 5px #ccc; -webkit-box-shadow: 0 0 5px #ccc; display: none; font-weight: normal; left: 23px; padding: 10px 13px; position: absolute; top: -6px; width: 250px; z-index: 1000; border-radius: 4px; } .fl-lightbox-width-slim .fl-help-tooltip-text { top:30px; left:0; width: 100%; } /* Multiples */ .fl-field-control .fl-form-field { margin-bottom: 0; } .fl-form-field-preview-text i { display: inline-block; font-size: 18px; line-height: 22px; margin-bottom: 5px; } .fl-builder-field-actions { padding-left: 0 !important; padding-right: 0 !important; text-align: center; width: 85px; } .fl-builder-field-actions i { color: #999 !important; cursor: pointer; font-size: 13px !important; line-height: 29px !important; width: 16px; } .fl-builder-field-actions i:hover { color: #000 !important; } .fl-builder-field-actions i.fl-builder-field-copy, .fl-builder-field-actions i.fl-builder-field-delete { margin-left: 5px; } .fl-builder-field-actions i.fl-builder-field-move { cursor: move; } .fl-builder-field-dd-helper { background: #ccc; height: 30px !important; float: left; width: 130px !important; } .fl-builder-field-dd-zone { border: 1px dashed #cccccc; height: 30px; } .fl-builder-field-actions-single .fl-builder-field-move, .fl-builder-field-actions-single .fl-builder-field-delete { display: none !important; } .fl-lightbox-width-slim .fl-builder-field-actions-single .fl-builder-field-copy { float: right !important; } .fl-builder-field-multiple .fl-field-label, .fl-builder-field-multiple .fl-field-control, .fl-builder-field-multiple .fl-builder-field-actions { padding-top:2px !important; padding-bottom:2px !important; } .fl-builder-field-multiple .fl-builder-field-actions { min-width: 70px !important; } .fl-builder-field-multiple[data-field="icons"] .fl-builder-field-actions { width: 70px !important; } /* Multiple item during drag */ .fl-builder-field-multiple.ui-sortable-helper .fl-field-control { width: 60%; /* loose number because calc() doesn't work on table cells */ } .fl-builder-field-multiple.ui-sortable-helper .fl-builder-field-actions { display: none; } /* Wordpress Widgets */ .fl-builder-widget-settings input { display: inline-block !important; margin: 5px 10px 8px 10px !important; } /* Misc */ .fl-builder-lightbox-loading { background: url(../img/ajax-loader.svg) center center no-repeat; height: 100px; } .fl-builder-settings .error, .fl-builder-settings input.error { color: #d03436 !important; } .fl-builder-settings label.error, .fl-builder-settings p.error { color: #d03436; display: block; margin-top: 5px; } .fl-builder-settings .fl-form-table .fl-field-description { color: #464646; font-style: normal; margin-left:2px; } .fl-lightbox .fl-field-connection { right: -1px; } .fl-lightbox .fl-field-connection-content { border: 2px solid transparent !important; background: #e4e7ea !important; } .fl-field-connection-content .fl-field-connection-label { color: #676f7a !important; } /* Auto Suggest */ ul.as-selections { background-color: #fff; border:none; border-radius: 4px; box-shadow: none; color: #333; font-size: 12px; height: auto; line-height: 15px; margin: 1px; outline: none; padding: 3px; width: auto; } ul.as-selections.loading { background: url('../img/ajax-loader-small.svg') 98% center no-repeat; } ul.as-selections li.as-selection-item { background: #d4eaf6; border: none; -webkit-border-radius: 0; -moz-border-radius: 0px; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; font-size: 11px; line-height: 14px; padding: 8px 15px; border-radius: 4px; margin: 2px; } ul.as-selections li.as-selection-item.blur { background: #f4f4f4; } ul.as-selections li.as-selection-item a.as-close { line-height: 12px; } ul.as-selections li.as-original { margin: 0; } ul.as-selections li.as-original input { height: auto; font-size: 12px; margin: 0; padding: 0; box-shadow: none; } ul.as-list { margin: 0; font-size: 13px; color: #000; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; background-color: #fff; background-color: rgba(255,255,255,.95); z-index: 2; -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 10px rgba(0,0,0,0.1); box-shadow: 0 0 10px rgba(0,0,0,0.1); -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } ul.as-list { border: none; border: 1px solid #dfdfdf; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } li.as-result-item, li.as-message { border: none; } li.as-result-item.active { background: #e5e5e5; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; color: #333; text-shadow: none; } li.as-result-item em { background: none !important; color: #333 !important; font-size: 12px; padding: 0 !important; font-weight: bold; } /* Loop Settings */ .fl-custom-query-filter { display: none; } .fl-custom-query .fl-field[data-type="suggest"] select { margin-bottom: 5px; width: 100%; } /* Service Fields */ .fl-builder-service-settings { position: relative; } .fl-builder-service-error { color: #ff0000 !important; padding: 15px 0 0 0; } .fl-builder-service-account-delete { color: #ff0000 !important; margin-left: 10px; position: relative; top: 2px; } .fl-builder-service-connect-row .fl-field-description, #fl-field-visibility_user_capability .fl-field-description { background: #f0f0f0; color: #333 !important; display: block; float: none; margin: 10px 0 0 0; padding: 10px; } .fl-builder-service-connect-row .fl-field-description a, #fl-field-visibility_user_capability .fl-field-description a { color: #21759b !important; text-decoration: underline !important; } /* Ordering Fields */ .fl-ordering-field-option { background: #fff; border: 1px solid #dfdfdf; border-radius: 3px; cursor: move; margin-bottom: 5px; padding: 5px 10px; } .fl-ordering-field-option .fa { color: #ccc; float: right; line-height: 16px; } /* TipTip ------------------------------------------------------ */ #tiptip_holder { z-index: 1000000; } #tiptip_holder.tip_top #tiptip_arrow_inner { border-top-color: #333; } #tiptip_holder.tip_bottom #tiptip_arrow_inner { border-bottom-color: #333; } #tiptip_holder.tip_right #tiptip_arrow_inner { border-right-color: #333; } #tiptip_holder.tip_left #tiptip_arrow_inner { border-left-color: #333; } #tiptip_content { background: #333; box-shadow: none; } /* @endgroup Settings Lightboxes */ /* @group Help */ /* Getting Started Video ------------------------------------------------------ */ .fl-builder-getting-started-video { line-height: 0 !important; padding: 10px; } .fl-builder-getting-started-video iframe { border: none; height: 326px; width: 100%; } /* Help Tour ------------------------------------------------------ */ .fl-builder-tour-actions .fl-builder-actions-title { font-size: 14px !important; line-height: 19px; } .fl-builder-tour-mask { bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 100000000; } .fl-builder-tour-dimmed { background: rgba( 0, 0, 0, 0.7 ); bottom: 0; left: 0; position: absolute; right: 0; top: 0; } body > .fl-builder-tour-dimmed { position: fixed; } .tour-backdrop { z-index: 110000; } .popover[class*=tour-] { border: 1px solid #ccc; border-radius: 0; -webkit-box-shadow: 0 0 30px rgba(0,0,0,.3); box-shadow: 0 0 40px rgba(0,0,0,.3); color: #666; font-size: 13px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: normal; line-height: 18px; max-width: none; padding: 0; width: 300px; z-index: 100000001; } .popover[class*=tour-].bottom > .arrow { border-bottom-color: #ccc; } .popover[class*=tour-].bottom > .arrow:after { border-bottom-color: #f7f7f7; } .popover[class*=tour-] .popover-title { border-radius: 0; color: #333; letter-spacing: normal; text-transform: none; } .popover[class*=tour-] .fa-times { color: #b3b3b3; cursor: pointer; font-size: 16px; padding: 5px; position: absolute; right: 3px; top: 2px; } .popover[class*=tour-] .fa-times:hover { color: #666; } .popover[class*=tour-] .popover-content { border-bottom: 1px solid #d9d9d9; padding: 13px 15px; } .popover[class*=tour-] .fl-builder-tour-next { display: block; float: none; width: 100%; } .popover-navigation button { min-height: 36px; } /* @endgroup Help */ /* @group Shortcodes ------------------------------------------------------ */ .fl-builder-shortcode-mask-wrap { position: relative; } .fl-builder-shortcode-mask { bottom: -1px; left: -1px; position: absolute; right: -1px; top: -1px; z-index: 1; } /* @endgroup Shortcodes */ /* @group Search ------------------------------------------------------------ */ .fl-builder--search { border: 2px solid transparent; position:relative; padding:0; width:54px; transition-property: width; transition-delay: .1s; transition-duration: .15s; } .fl-builder--search.is-expanded { border: 2px solid #00A0D0; } .fl-builder--search input[type="text"], .fl-builder--search input[type="text"]:focus { background-color:transparent; border: none !important; box-sizing: border-box; width:100%; font-size:16px; text-align: center; } .fl-builder--search:before { display: flex; position: absolute; top:0; left:0; align-items: center; justify-content: center; content: "\f002"; font: normal normal normal 14px/1 Font Awesome\ 5 Free; text-align: center; width: 100%; height:100%; position: absolute; pointer-events: none; color: rgba(128,128,128,0.6); font-size: 17px; opacity:1; transition-property: opacity; transition-duration: .15s; } .fl-builder--search.is-expanded:before, .fl-builder--search.has-text:before { opacity:0; } .fl-builder--search input::-webkit-input-placeholder { color: rgba(128,128,128,0) !important; transition: color .25s; } .fl-builder--search input:focus::-webkit-input-placeholder { color: rgba(128,128,128,0.4) !important; } .fl-builder--search .search-label { cursor: text; } .fl-builder--search .search-clear { display: none; padding: 10px 10px 10px 30px; color: #a7a7a7; font-size: 12px; position: absolute; right: 0; top: 0; background-color: #eff1f2; background: linear-gradient(to left, #e4e7ea, #e4e7ea 75%, rgba(228, 231, 234, 0) ); } .fl-builder--search:hover .search-clear { color: #888888; background-color: #eff1f2; background: linear-gradient(to left, #dadfe5, #dadfe5 75%, rgba(218, 223, 229, 0) ); } .fl-builder--search.has-text .search-clear { display:inline-block; } .fl-builder--search.is-expanded { width: 246px; } .fl-builder--search.is-expanded input { display: inline-block; } /* @endgroup Search */ /* @group Main Menu ------------------------------------------------------ */ @keyframes fl-builder-show-menu-item { from { transform: translateY(10px) scale(.8); opacity:0; } to { transform: translateX(0px) translateY(0px) scale(1); opacity:1; } } .fl-builder--main-menu-panel { display:none; box-sizing: border-box; position: fixed; top:calc(48px + 10px); left: 10px; width: 360px; color: #222; max-height: calc(100% - 66px); border-radius: 4px; background: #ffffff; border: 2px solid #D5DADD; border-top: 3px solid #00a0d2; box-shadow: 0px 15px 45px 8px rgba(0, 0, 0, 0.04); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important; font-size: 14px !important; /* Prevent select */ -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently not supported by any browser */ z-index: 10000009; pointer-events: auto; } .fl-builder--main-menu-panel.is-showing { display:flex; } .fl-builder--main-menu-panel:before, .fl-theme-builder-preview-select-open .fl-theme-builder-preview-select-items:before { bottom: 100%; right: 6px; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border: solid; border-color: rgba(255, 255, 255, 0); border-bottom-color: #00a0d2; border-width: 13px; margin-left: -13px; } .fl-builder--main-menu-panel-views { flex: 1 1 100%; overflow: auto; } .fl-builder--main-menu-panel-mask { display:none; position: fixed; top:0; left:0; right:0; bottom:0; z-index: 1000119; } .fl-builder--main-menu-panel .fl-builder--tabs { padding-left:20px; padding-top: 15px; } .fl-builder--main-menu-panel-view { display:none; } .fl-builder--main-menu-panel-view.is-showing { display:block; } .fl-builder--main-menu-panel-view-title { font-size: 24px; font-weight: 600; padding: 25px 22px 0; line-height: 1; white-space: nowrap; } .fl-builder--main-menu-panel-view-title .title-accessory { float:right; color: #b1b1b1; } .fl-builder--main-menu-panel-view-title .title-accessory > i { font-size: 20px !important; width: 25px !important; } .fl-builder--main-menu-panel-view-title .title-accessory > i:hover { color: #222222; } .fl-builder--main-menu-panel-view-title .pop-view { padding: 10px; padding-right: 10px; margin-left: -10px; opacity: .5; font-size: 25px; font-weight: 400; cursor: pointer; background: transparent; outline: none; border: none; color: inherit; } .fl-builder--main-menu-panel-view-title .pop-view:focus { outline:none; top:0; background: #E5EAED !important; } .fl-builder--menu-item:before { display:block; content: ""; float:none; clear:both; } .fl-builder--menu-item { color: inherit; text-align: left; box-sizing: border-box; display: block; padding: 10px 15px; margin:0 10px; width: calc(100% - 20px); background: transparent; border: none; border-radius: 4px; font-size:14px; line-height: 1.1; cursor: pointer; opacity:1; } .fl-builder--menu-item:hover { background: #eaf1f8; border:none; text-decoration: none; color: #000000; } .fl-builder--selector-menu .fl-builder--menu-item:hover { background:white; } .fl-builder--menu-item-accessory { float:right; text-align: center; display: inline-block; min-width: 40px; font-size: 14px; } .fl-builder--menu-item-accessory.view-arrow { font-size: 18px; } .fl-builder--menu { padding:0; margin:20px 0; } .fl-builder--menu hr { margin: 8px 0; background-color: #e6eaed !important; height: 2px; border: none; } .fl-builder--menu .fl-builder-video-wrap { padding: 0px 10px 10px; } /* @endgroup Main Menu */ /* @group Revisions ------------------------------------------------------ */ /* Revisions items */ .fl-revision-list-item { display: flex; } .fl-revision-list-item-text { padding-left: 15px; } .fl-revision-list-item-date { padding-bottom: 5px; } /* Revision actions */ .fl-builder--revision-actions { display:none; position: fixed; top: 4px; left: 4px; z-index: 100008; padding: 4px 4px 6px; justify-content: center; background:white; border-radius: 4px; } .fl-builder--revision-actions * { margin-right: 5px; } .fl-builder--revision-actions *:last-child { margin: 0; } /* No revisions message */ .fl-builder--menu-item[data-event="noRevisionsMessage"]:hover { background: transparent; box-shadow: none; cursor: default; } .fl-no-revisions-message-title { font-weight: bold; margin-bottom: 10px; } .fl-no-revisions-message-text { line-height: 22px; } /* @endgroup Revisions */ /* @group Modules ------------------------------------------------------ */ .fl-builder-module-placeholder-message { border: 1px dashed #ccc; overflow: hidden; padding: 20px; text-align: center; text-overflow: ellipsis; white-space: nowrap; } /* @endgroup Modules */ /* @group Misc ------------------------------------------------------ */ .fl-field-connections-menu { z-index: 999999;; } .fl-field-connections-toggle { right: -30px !important; } /* @endgroup Misc */ /* @group 2.0 Compat Rules to ensure compatibility with v2.0. ------------------------------------------------------ */ .uabb-live-preview-button, .pp-preview-button, .fl-builder-pp-add-template-button, .fl-builder-add-ultimate-rows-button, .fl-builder-add-ultimate-presets-button { display: none !important; } /* @endgroup 2.0 Compat */ /* @group jQuery UI */ /* Resizable ------------------------------------------------------ */ .ui-resizable { position: relative; } .ui-resizable-handle { position: absolute; font-size: 0.1px; display: block; -ms-touch-action: none; touch-action: none; background: transparent; transition-property: background; transition-duration: .15s; } .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: -4px; bottom: -4px; } .ui-resizable-sw { cursor: sw-resize; width: 12px; height: 12px; left: -4px; bottom: -4px; } .ui-resizable-nw { cursor: nw-resize; width: 12px; height: 12px; left: -4px; top: -4px; } .ui-resizable-ne { cursor: ne-resize; width: 12px; height: 12px; right: -4px; top: -4px; } .fl-builder-resizable-iframe-fix { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000000; } .fl-lightbox .ui-resizable-handle:hover, .fl-lightbox .ui-resizable-handle:active, .fl-builder-panel .ui-resizable-handle:hover, .fl-builder-panel .ui-resizable-handle:active { background: #00a0d2; } .fl-lightbox .ui-resizable-n, .fl-lightbox .ui-resizable-s, .fl-builder-panel .ui-resizable-n, .fl-builder-panel .ui-resizable-s { height: 6px; } .fl-lightbox .ui-resizable-n, .fl-builder-panel .ui-resizable-n { top: -3px; } .fl-lightbox .ui-resizable-s, .fl-builder-panel .ui-resizable-s { bottom: -3px; } .fl-lightbox .ui-resizable-e, .fl-lightbox .ui-resizable-w, .fl-builder-panel .ui-resizable-e, .fl-builder-panel .ui-resizable-w { width: 6px; } .fl-lightbox .ui-resizable-e, .fl-builder-panel .ui-resizable-e { right: -3px; } .fl-lightbox .ui-resizable-w, .fl-builder-panel .ui-resizable-w { left: -3px; } .fl-lightbox .ui-resizable-ne, .fl-lightbox .ui-resizable-nw, .fl-lightbox .ui-resizable-se, .fl-lightbox .ui-resizable-sw { background: transparent; border: 6px solid transparent; } .fl-lightbox .ui-resizable-ne:hover, .fl-lightbox .ui-resizable-nw:hover, .fl-lightbox .ui-resizable-se:hover, .fl-lightbox .ui-resizable-sw:hover, .fl-lightbox .ui-resizable-ne:active, .fl-lightbox .ui-resizable-nw:active, .fl-lightbox .ui-resizable-se:active, .fl-lightbox .ui-resizable-sw:active { background:transparent; border-color: #00a0d2; } .fl-lightbox .ui-resizable-ne { border-bottom:none; border-left:none; border-top-right-radius: 4px; } .fl-lightbox .ui-resizable-nw { border-bottom:none; border-right:none; border-top-left-radius: 4px; } .fl-lightbox .ui-resizable-se { border-top:none; border-left:none; border-bottom-right-radius: 4px; } .fl-lightbox .ui-resizable-sw { border-top:none; border-right:none; border-bottom-left-radius: 4px; } /* @endgroup jQuery UI */ .fl-builder-ui-keyboard-shortcuts { display:none; position: fixed; top:0; left:0; bottom:0; right:0; z-index: 999999; justify-content: center; align-items: center; background: rgba(50, 50, 50, 0.88); font-size: 15px; line-height: 1.3; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important; user-select: none; } .fl-builder-ui-keyboard-shortcuts.is-showing { display: flex; } .fl-builder-ui-keyboard-shortcuts-content { box-sizing: border-box; width: 500px; background: #f5f7f9; border-radius: 4px; padding: 30px 0 0; box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.15); } .fl-builder-ui-keyboard-shortcut-item { display: flex; flex-direction: row; align-items: center; padding:12px 40px; } .fl-builder-ui-keyboard-shortcut-item:nth-child(even) { background: #eef2f5; } .fl-builder-ui-shortcut-keycode { margin-left: auto; text-transform:uppercase; letter-spacing: 2px; } .fl-builder-ui-keyboard-shortcust-footer { display: flex; flex-direction: row; justify-content: center; padding: 10px; } .dismiss-shortcut-ui { padding:10px; border-radius:4px; background:white; color: black; border:none; font-size: 14px; border: 2px solid white; } .dismiss-shortcut-ui:hover { top:0; color: black; background: #eef2f5; border: 2px solid #eef2f5; } .dismiss-shortcut-ui:focus { top:0; color: black; background: #eef2f5; border: 2px solid #eef2f5; }