.switch_options { width: 100px; position: relative; height: 30px; background: #D4D4D4; overflow: hidden; } .switch_options span { width: 50px; position: absolute; left: 0; top: 0; height: 100%; text-align: center; line-height: 30px; color: rgba(0,0,0,0); z-index: 2; font-weight: 700; } .switch_options span.switch_disable { right: 0; left: auto; } .switch_options span.selected { color: #fff; } .switch_options span::before { position: absolute; display: block; content: ""; height: 100%; width: 100%; z-index: -1; } .switch_options span.switch_enable::before{ background: #0085BA; left: -50px; } .switch_options span.switch_enable.selected::before{ left: 0px; } .switch_options span.switch_disable::before{ background: #7D7D7D; right: -50px; } .switch_options span.switch_disable.selected::before{ right: 0px; } .switch_options span, .switch_options span.selected::before, .switch_options span::before, .switch_options span.selected{ -webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s } .total-accordion-section-title, .customize-control { background: #FBFBFB; padding: 12px; border-left: 5px solid #0085BA; border-radius: 5px 0 0 5px; box-shadow: -1px 4px 5px 1px rgba(0,0,0,0.1); width: 90%; } .total-selected-icon { background: #FBFBFB; text-align: center; padding: 8px; box-shadow: -1px 4px 5px 1px rgba(0,0,0,0.1); position: relative; } .total-selected-icon .fa{ font-size: 24px; } .total-icon-list { display: none; padding: 20px 0 0; overflow: hidden; max-height: 200px; overflow-y: auto; } .total-icon-list li { width: 25%; float: left; text-align: center; margin-bottom: 15px; } .total-icon-list li .fa { font-size: 20px; } .total-selected-icon > span { position: absolute; right: 10px; } .gallery-screenshot { overflow: hidden; } .gallery-screenshot .screen-thumb { width: 50%; float: left; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 7px; margin: 20px 0; } .gallery-screenshot .screen-thumb:nth-child(2n+1) { clear: both } .customize-control-title { margin-bottom: 15px; margin-top: 10px; } /*customize icons styling from here*/ .customize-pane-parent li .accordion-section-title:before { font-size: 14px; margin-right: 5px; vertical-align: middle; display: inline-block; font-family: "FontAwesome"; color: #555d66; line-height: 1.4; height: 21px; font-weight: 400; } .customize-pane-parent li:hover .accordion-section-title:before { color: #0073aa; background: #f3f3f5; border-left-color: #0073aa; } .customize-pane-parent li#accordion-panel-nav_menus .accordion-section-title:before { content: "\f0c9"; } .customize-pane-parent li#accordion-panel-buzz_agency_theme_color_setups .accordion-section-title:before { content: "\f0e4"; } .customize-pane-parent li#accordion-panel-buzz_agency_homepage_setups .accordion-section-title:before { content: "\f015"; } .customize-pane-parent li#accordion-panel-buzz_agency_general_panel .accordion-section-title:before { content: "\f013"; } .customize-pane-parent li#accordion-section-custom_css .accordion-section-title:before { content: "\f040"; } .customize-pane-parent li#accordion-panel-woocommerce .accordion-section-title:before { content: "\f07a"; } .customize-pane-parent li#accordion-panel-widgets .accordion-section-title:before { content: "\f1ea"; } .customize-pane-parent li#accordion-panel-buzz_agency_font_family .accordion-section-title:before { content: "\f031"; } .customize-pane-parent li#accordion-panel-buzz_agency_archive_section .accordion-section-title:before { content: "\f187"; } .customize-pane-parent li#accordion-panel-buzz_agency_homepage_about_setups .accordion-section-title:before { content: "\f05a"; } .customize-pane-parent li#accordion-panel-buzz_agency_homepage_service_setups .accordion-section-title:before { content: "\f2b5"; } .customize-pane-parent li#accordion-panel-buzz_agency_homepage_footer_setups .accordion-section-title:before { content: "\f160"; } .customize-pane-parent li#accordion-panel-buzz_agency_heading_setups .accordion-section-title:before { content: "\f1ec"; } .customize-pane-parent li#accordion-panel-buzz_agency_default_setups .accordion-section-title:before { content: "\f085"; } /** * Repeater Custom Control Style */ .customize-control-repeater .customize-control-title{ width: 96%; background: #787878; padding: 5px; border-radius: 2px; color: #fff; } .repeater-field-control{ background: #FFF; margin-bottom: 12px; display: block; } .repeater-footer{ margin-top: 15px; text-align: right; } .repeater-field-control:first-child .repeater-footer{ display: none; } .repeater-field-title{ padding: 13px 15px; line-height: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin: 0; font-size: 1em; border: 1px solid #e5e5e5; cursor: move; position: relative; border-bottom: 0; } .repeater-field-title:after { content: "\f142"; font: 400 20px/1 dashicons; position: absolute; right: 0; top: 0; padding: 1px 2px 1px 0; margin-top: 10px; margin-right: 10px; -webkit-border-radius: 50%; border-radius: 50%; cursor: pointer; } .repeater-field-control.expanded .repeater-field-title:after{ content: "\f140"; } .repeater-fields{ padding: 0 10px 10px; border-top: none; line-height: 16px; border: 1px solid #e5e5e5; box-shadow: 0 1px 1px rgba(0,0,0,.04); display: none; } .repeater-fields .customize-control-title{ margin-top: 10px; } .repeater-field-control.expanded .repeater-fields{ display: block; } .add-control-field { float: right; } .add-control-field:before { content: "\f132"; display: inline-block; position: relative; left: -2px; top: -1px; font: 400 18px/1 dashicons; vertical-align: middle; } .fields textarea{ width: 100%; min-height: 100px; } .fields select{ width: 100%; min-width: none; } .type-checkbox{ margin-top: 10px; } .type-checkbox label{ line-height: 20px; display: block; margin-left: 24px; padding-top: 6px; } .type-checkbox input[type=checkbox]{ margin-right: 8px; margin-left: -24px; } .type-selector .selector-labels{ margin: 0 -5px; } .type-selector .selector-labels label{ display: inline-block; padding: 10px 5px 0; position: relative; max-width: 50%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .type-selector .selector-labels label img{ vertical-align: middle; } .type-selector .selector-labels label.selector-selected:after{ content: ""; height: 35px; width: 35px; right: 0; top: 0; position: absolute; background: url(assets/images/selected.png) no-repeat right top; } .type-radio .radio-labels label{ display: block; padding: 5px 0; } .onoffswitch { position: relative; width: 100px; margin-right: 15px; overflow: hidden; cursor: pointer; } .onoffswitch-inner { width: 200%; margin-left: -100%; -moz-transition: margin .3s ease-in 0s; -webkit-transition: margin .3s ease-in 0s; -o-transition: margin .3s ease-in 0s; transition: margin .3s ease-in 0s } .onoffswitch-inner > div { float: left; position: relative; width: 50%; height: 24px; padding: 0; line-height: 24px; font-size: 12px; color: #fff; font-weight: 700; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box } .onoffswitch-inner .onoffswitch-active { background-color: #d4d4d4; color: #FFF } .onoffswitch-inner .onoffswitch-inactive { background-color: #d4d4d4; color: #FFF; text-align: right } .onoffswitch-switch { width: 50px; margin: 0; text-align: center; border: 0 solid #999; border-radius: 0; position: absolute; top: 0; bottom: 0 } .onoffswitch-active .onoffswitch-switch { background: #0073aa; left: 0 } .onoffswitch-inactive .onoffswitch-switch { background: #7D7D7D; right: 0 } .switch-on .onoffswitch-inner { margin-left: 0 } .customize-control-fields { padding: 5px; display: block; font-size: 14px; line-height: 24px; font-weight: 500; } .customize-control input[type=number] { width: 40%; } /** =============================================== Icon Picker ================================ **/ .icon-list { height: 200px; display: block; overflow-y: scroll; background: #fff; border: 1px solid #CCCCCC; width: 100%; } ul.icon-list li { display: block; float: left; padding: 14px; height: 19px; width: 19px; font-size: 19px; text-align: center; border-radius: 50%; } ul.icon-list li:hover { cursor: pointer; } .selected-icon span { margin-left: 10px; } .selected-icon { background: #0e90ad; padding: 10px; color: #fff; margin-bottom: 10px; font-size: 18px; } ul.icon-list.clearfix li { display: inline-block; font-size: 20px; } .repeater-field-control.expanded .repeater-fields{ overflow: hidden; }