/***
 *  BetterFramework is BetterStudio framework for themes and plugins.
 *
 *  ______      _   _             ______                                           _
 *  | ___ \    | | | |            |  ___|                                         | |
 *  | |_/ / ___| |_| |_ ___ _ __  | |_ _ __ __ _ _ __ ___   _____      _____  _ __| | __
 *  | ___ \/ _ \ __| __/ _ \ '__| |  _| '__/ _` | '_ ` _ \ / _ \ \ /\ / / _ \| '__| |/ /
 *  | |_/ /  __/ |_| ||  __/ |    | | | | | (_| | | | | | |  __/\ V  V / (_) | |  |   <
 *  \____/ \___|\__|\__\___|_|    \_| |_|  \__,_|_| |_| |_|\___| \_/\_/ \___/|_|  |_|\_\
 *
 *  Copyright © 2017 Better Studio
 *
 *
 *  Our portfolio is here: https://betterstudio.com/
 *
 *  \--> BetterStudio, 2017 <--/
 */

/*

1. =>Base
    1.1. =>Main Helpers
    1.2. =>Buttons
    1.3. =>Columns
    1.4. =>General Classes

2. =>General Fields
    2.1. =>Section
    2.2. =>Heading
    2.3. =>Color
    2.4. =>Image Radio Option
    2.5. =>Media Image
    2.6. =>Background Image
    2.7. =>Sorter
    2.8. =>Ajax Select
    2.9. =>Social Counter Sorter
    2.10. =>Image Select
    2.11. =>Icon Select
    2.12. =>Typography
    2.13. =>Social Share Sorter
    2.14. =>Repeater Item
    2.15. =>Border
    2.16. =>Info
    2.17. =>Switch
    2.18. =>Fields Group
    2.19. =>Media
    2.20. =>Code Editor
    2.21. =>Custom Checkbox/Radio Field
    2.22. =>Term Select Field Style
    2.23. =>Selector Modal
    2.24. =>Pre Defined Styles Modal
    2.25. =>Popup Select
    2.26. =>Color Picker

3. =>Admin Panel
    3.1. =>Section
    3.2. =>Panel
    3.3. =>Panel Header
    3.4. =>Panel Main
    3.5. =>Panel Nav
    3.6. =>Panel Content
    3.7. =>Panel Footer
    3.8. =>Typography
    3.9 =>Panel Loading

4. =>Widgets
    4.1. =>General style
    4.2. =>Section
    4.3. =>Ajax Select

5. =>Taxonomies

6. =>Visual Composer
    6.1. =>Color Picker
    6.2. =>Image Radio
    6.3. =>Ajax Select
    6.4. =>Icon Radio
    6.5. =>Heading
    6.6. =>Editor ShortCode
    6.7. =>VC Media Image
    6.8. =>VC Info
    6.9. =>Switch
    6.10. =>Select
    6.11. =>Column

7. =>Menus
    7.1. =>Mega Menu Field
    7.2. =>Menu Badge Field
    7.3. =>WPNav Menu
    7.4. =>Heading
    7.5. =>Color Picker
    7.6. =>Checkbox

8. =>Meta Box
    8.1. =>Section
    8.2. =>Tabs
    8.3. =>Heading


9. =>Font Manager
    9.1. =>Fields

10. =>User Metabox


11. =>Admin Menus

12. =>Notice System

13. =>Last Not Refactored Codes

14. =>TinyMCE Add-On

15. =>KingComposer

16. =>Elementor

17. =>Gutenberg

*/

/**
 * 1.1. =>Main Helpers
 **************************************************************/
.bf-clearfix:before,
.bf-clearfix:after {
    content: "";
    display: table;
}

.bf-clearfix:after {
    clear: both;
}

.bf-clearfix {
    zoom: 1;
}

.bf-clear-right {
    clear: right !important;
}

.bf-clear-left {
    clear: left !important;
}

.clr {
    clear: both;
}

/*rtl:raw:
.rtl {
    text-align: right;
    direction: rtl;
}
*/

.ltr {
    text-align: left;
    direction: ltr;
}

.limit-line {
    overflow: hidden;
    white-space: nowrap;
}

.ellipsis {
    text-overflow: ellipsis;
}

/*rtl:raw:
.rtl .bf-flip-img-rtl img,
.rtl img.bf-flip-img-rtl {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}
*/

/**
 * 1.2. =>Buttons
 **************************************************************/
.bf-button {
    border-radius: 0;
    line-height: normal;
    line-height: 32px;
    display: inline-block;
    border: 1px solid #E2DDDB;
    background: #F5F5F5;
    padding: 0 14px;
    cursor: pointer;
    font-weight: bold;
    color: #4D4D4D;
    outline: none;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    font-size: 13px;
    text-decoration: none;
}

.bf-button:hover {
    border: 1px solid #C0C0C0;
    background: #F0F0F0;
    color: #383838;
    box-shadow: 0 1px 0 rgba(0, 0, 0, .05);
}

.bf-button.bf-main-button {
    background-color: #2d9ec7;
    border-color: #0074a2;
    color: #fff;
}

.bf-button.bf-main-button:hover {
    background: #288baf;
    border-color: #00435f;
}

.bf-button .fa,
.bf-button .dashicons {
    margin-right: 5px;
}

.bf-button .dashicons {
    margin-top: 5px;
}

.bf-button.large {
    height: 42px;
    margin: 0;
    padding: 0 15px 2px;
    font-size: 18px;
    font-weight: 300;
    line-height: 42px;
}

.bf-button.large-2x {
    height: 52px;
    margin: 0;
    padding: 0 20px 2px;
    font-size: 18px;
    font-weight: 300;
    line-height: 52px;
}

.bf-button i[class^="bsai-"] {
    font-size: 16px;
    margin-right: 4px;
    display: inline-block;
}

/**
 * 1.3. =>Columns
 **************************************************************/
.bf-column {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bf-columns-1 .bf-column {
    width: 100%;
    float: none;
}

/* 2 Column */
.bf-columns-2 .bf-column {
    width: 50%;
    float: left;
}

.bf-columns-2 .bf-column:nth-child(odd) {
    padding-right: 13px;
    clear: left;
}

.bf-columns-2 .bf-column:nth-child(even) {
    padding-left: 13px;
}

/* 3 Column */
.bf-columns-3 .bf-column {
    width: 33.3333%;
    float: left;
}

.bf-columns-3 .bf-column:nth-child( 3n-1 ) {
    padding: 0 6px;
}

.bf-columns-3 .bf-column:nth-child( 3n-2 ) {
    padding-right: 12px;
    clear: left;
}

.bf-columns-3 .bf-column:nth-child( 3n+3  ) {
    padding-left: 12px;
}

/* 4 Column */
.bf-columns-4 .bf-column {
    width: 25%;
    float: left;
}

.bf-columns-4 .bf-column:nth-child(4n-3) {
    padding-left: 0;
    padding-right: 12px;
    clear: left;
}

.bf-columns-4 .bf-column:nth-child(4n+2) {
    padding-left: 6px;
    padding-right: 6px;
}

.bf-columns-4 .bf-column:nth-child(4n+3) {
    padding-left: 6px;
    padding-right: 6px;
}

.bf-columns-4 .bf-column:nth-child(4n+4) {
    padding-right: 0;
    padding-left: 12px;
}

/**
 * 1.4. =>General Classes
 **************************************************************/
.bf-items-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
    align-items: center;
    grid-gap: 10px;
}
.bf-item-container {
    background: rgb(252, 252, 252);
    box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
    border: 1px solid #ddd;
    font-family: "Open Sans", Helvetica, sans-serif;
    font-size: 15px;
    color: #3b3b3b;
    position: relative;
    overflow: hidden;
}

.bssm-item .bf-item-container {
    margin: 0;
}

.bf-item-container figure {
    display: block;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid rgba(220, 220, 220, 0.53);
}

.bf-item-container figure img {
    width: 100%;
    display: block;
}

.bf-item-footer {
    background: #FCFCFC;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #fcfcfc;
}

.bf-item-footer .highlight-section {
    z-index: 69;
    max-width: 100%;
    background: rgba(244, 244, 244, .7);
    border: 1px solid rgba(0, 0, 0, .05);
    border-width: 0 0 0 1px;
}

.bf-item-title {
    text-align: left;
    color: #3b3b3b;
    position: absolute;
    font-weight: 600;
    padding: 12px 0 12px 12px;
    font-size: 15px;
    line-height: 28px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bf-item-buttons {
    display: block;
    float: right;
    padding: 0;
    margin: 0;
}

.bf-item-buttons a {
    margin: 0 12px 0 0;
    white-space: nowrap;
}

.bf-item-buttons a:last-child {
    margin-right: 0;
}

.bf-item-buttons > span {
    float: right;
    position: relative;
    z-index: 99;
    padding: 12px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bf-item-buttons > span:last-child {
    margin-left: 0;
}

.bf-btn-primary,
.bf-btn-secondary {
    background: #00a0d2;
    color: #fff;
    border: 1px solid #0073aa;

    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    text-decoration: none;
    padding: 3px 9px;
    font-weight: 600;
    vertical-align: middle;

    font-size: 14px;
    display: inline-block;
}

.bf-btn-primary:hover {
    color: #fff;
    background-color: #28abd2;
    border-color: #1f8eb4;
}

.bf-btn-secondary {
    color: #555;
    border: 1px solid #cccccc;
    background: #f7f7f7;
    vertical-align: top;
}

.bf-btn-secondary.bf-btn-dark {
    background-color: #eee;
    border-color: #cfcfcf;
    color: #3d3d3d;

    box-shadow: none;
}

.bf-btn-secondary.bf-btn-dark:hover {
    background-color: #e9e9e9;
    border-color: #c5c5c5;
}

.bf-item-container.not-active {
    height: 314px;
}

.bf-item-container.not-active .bf-item-footer .bf-item-title {
    position: relative;
    display: block;
    padding: 9px 0 2px;
    text-align: center;
}

.bf-item-container.not-active .bf-item-footer .active-error {
    display: block;
    text-align: center;
    color: #f13838;
    font-size: 12px;
    font-weight: 700;
}

/**
 * 2. =>General Fields
 **************************************************************/
/***** Field Prefix or Suffix ******/
.edit-post-sidebar .bf-section-container .bf-section {
    padding: 0;
}

.block-editor .bf-heading h3 {
    margin-top: 1em;
    margin-bottom: 0.3em;
}
.bf-field-with-suffix,
.bf-field-with-prefix {
    position: relative;
    display: inline-block;
}

.bf-field-with-prefix input[type=text],
.bf-field-with-suffix input[type=text] {
    max-width: 160px !important;
    display: inline-block !important;
}

.bf-field-with-suffix.bf-field-with-prefix input[type=text] {
    padding-right: 10px !important;
    padding-left: 10px !important;
}

.bf-field-with-prefix,
.bf-field-with-suffix {
    width: 100%;
}

.bf-field-with-prefix span,
.bf-field-with-suffix span {
    display: inline-block;
    cursor: pointer;
    vertical-align: middle;
    font-size: 13px;
    z-index: 6;
    height: 32px;
    line-height: 32px;
    border: 1px solid #d6d6d6;
    color: #7C7C7C;
    background-color: #fff;
    padding: 0 10px;
    font-style: normal;
}

.bf-field-with-prefix span.bf-prefix {
    margin-right: -5px;
    border-right: none;
}

.bf-field-with-suffix span.bf-suffix {
    margin-left: -5px;
    border-left: none;
}

/* text helpers */
.bf-text-right {
    text-align: right;
}

.bf-text-left {
    text-align: left;
}

.bf-explain code {
    padding: 1px 5px;
    margin: 0 1px;
    background: #efefef;
    border: 1px solid #bfbfbf;
    font-size: 12px;
    border-radius: 2px;
    color: #676767;
    white-space: nowrap;
}

/**
 * 2.1. =>Section
 **************************************************************/

.bf-section img {
    max-width: 100%;
    max-height: 300px;
}

.bf-section.full-width select {
    width: 100%;
}

.bf-section-container {
    padding-right: 20px;
    padding-left: 20px;
}

.bf-section-container .bf-section {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #F4F3F3;
}

.bf-section-container:last-child .bf-section {
    border-bottom: none;
}

.bf-section.disable {
    opacity: 0.5;
}

.bf-section-container.highlight-hover {
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.bf-section-container.highlight-hover:hover {
    background-color: #FFFEE7;

}

.bf-section-container .bf-section.full-with-both > .bf-controls,
.bf-section-container .bf-section.full-with-controls > .bf-controls {
    float: none !important;
    width: 100% !important;
    clear: both !important;
}

.bf-section-container .bf-section.full-with-both > .bf-explain,
.bf-section-container .bf-section.full-with-both > .bf-heading,
.bf-section-container .bf-section.full-with-heading > .bf-heading {
    float: none !important;
    width: 100% !important;
    padding-right: 0 !important;
}

.bf-section-container .bf-section.full-with-both > .bf-controls input[type=text],
.bf-section-container .bf-section.full-with-both > .bf-controls .bf-select-option-container {
    max-width: 100%;
}

.bf-section-container .bf-section .input-desc {
    font-size: 12px;
    color: #b4b4b4;
    margin-top: 3px;
}

/**
 * 2.2. =>Heading
 **************************************************************/
/* style 1 */
.bf-section-container .bf-section-heading.style-1 {
    margin: 20px -20px 5px;
}

.bf-group-inner .bf-section-container .bf-section-heading.style-1 {
    margin: 20px 0 5px;
}

.bf-section-container .bf-section-heading.style-1 .bf-section-heading-title {
    background-color: #F5F5F5;
    border: 1px solid #D3D3D3;
    position: relative;
    height: 42px;
    line-height: 42px;
    font-size: 15px;
    color: #222222;
    font-weight: bold;
    display: block;
    padding: 0 20px;
    margin-bottom: 0;
}

.bf-section-container .bf-section-heading.style-1 .bf-section-heading-title h3 {
    margin: 0;
    font-size: 15px;
}

.bf-section-container .bf-section-heading.style-1 .bf-section-heading-desc {
    margin-top: 15px;
    padding: 0 20px;
    color: #999;
}

/* style 2 */
.bf-section-container .bf-section-heading.style-2 {
    margin: 5px -20px -5px;
    position: relative;
}

.bf-group-inner .bf-section-container .bf-section-heading.style-2 {
    margin: -10px 0 0;
    background: #fff;
    padding-top: 20px;
    padding-bottom: 10px;
}

.bf-section-container .bf-section-heading.style-2 .bf-section-heading-title {
    position: relative;
    height: 42px;
    line-height: 42px;
    font-size: 15px;
    color: #222222;
    font-weight: bold;
    display: block;
    padding: 0 15px;
    margin-bottom: 0;
    text-align: center;
}

.bf-section-container .bf-section-heading.style-2 .bf-section-heading-title h3 {
    margin: 0;
    font-size: 20px;
    display: inline-block;
    padding: 0 20px;
    background: #fff;
    z-index: 1;
    position: relative;
}

.bf-section-container .bf-section-heading.style-2 .bf-section-heading-title:after {
    content: '';
    display: block;
    height: 3px;
    position: relative;
    top: -50%;
    margin-top: -1.5px;
    left: 0;
    right: 0;
    background: #e2e2e2;
    clear: none;
    z-index: 0;
}

.bf-section-container .bf-section-heading.style-2 .bf-section-heading-desc {
    margin-top: 15px;
    padding: 0 20px;
    color: #999;
    text-align: center;
}

/**
 * 2.3. =>Color
 **************************************************************/
.colorpicker {
    z-index: 999999; /* For conflict on VC and other sections */
}

.bf-section-container .bf-controls-color-option {
    position: relative;
    display: inline-block;
}

.bf-section-container .bf-color-picker {
    width: 130px;
    height: 34px;
    box-shadow: none;
    outline: none;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
    padding: 5px 10px;
}

.bf-section-container .bf-color-picker:focus {
    box-shadow: none;
}

.bf-section-container .bf-color-picker-container {
    position: relative;
    width: 132px;
}

.bf-section-container .bf-color-picker-preview {
    width: 24px;
    height: 24px;
    display: inline-block;
    position: absolute;
    right: 5px;
    top: 5px;
    z-index: 1;
}

/**
 * 2.4. =>Image Radio Option
 **************************************************************/
.customize-control-image_radio input[type=radio],
.bf-controls-image_radio-option input[type=radio]{
    display: none;
}
.bf-section-container .bf-controls-image_radio-option input[type=radio] {
    display: none;
}

.bf-section-container.style-floated-left .bf-image-radio-option,
.bf-section-container .style-floated-left .bf-image-radio-option {
    float: left;
    margin-right: 6px;
    margin-bottom: 12px;
}

.bf-section-container .bf-image-radio-option .item-label {
    margin: 5px 0;
    text-align: center;
    font-size: 10px;
}

.bf-section-container .bf-image-radio-option.checked .item-label {
    font-weight: bold;
}

.bf-section-container .bf-image-radio-option img {
    border: 1px solid #e2e2e2;
}

.bf-section-container .bf-image-radio-option.checked img {
    border: 1px solid #0074a2;
}

/**
 * 2.5. =>Media Image
 **************************************************************/
.bf-section-container .bf-section-media_image-option .bf-media-image-upload-btn,
.bf-section-container .bf-section-media_image-option .bf-media-image-remove-btn {
    margin-bottom: 15px;
}

.bf-section-container .bf-section-media_image-option .bf-media-image-remove-btn {
    margin-left: 10px;
}

.bf-section-container .bf-section-media_image-option input[type=text] + .bf-media-image-preview {
    margin-top: 17px;
}

.bf-section-container .bf-section-media_image-option input[type=text] + .bf-media-image-preview:empty {
    margin-top: 0;
}

/**
 * 2.6. =>Background Image
 **************************************************************/
.wpb_edit_form_elements .bf-section-container .bf-background-image-remove-btn,
.bf-section-container .bf-background-image-remove-btn {
    margin-left: 10px;
}

.wpb_edit_form_elements .bf-section-container .bf-background-image-uploader-select,
.bf-section-container .bf-background-image-uploader-select {
    margin: 10px 0;
    width: 100%;
}

.bf-section-container .bf-controls-background_image-option .bf-button {
    margin-bottom: 20px;
}

.bf-section-container .bf-controls-background_image-option .bf-background-image-uploader-select-container {
    margin-bottom: 20px;
}

.bf-section-container .bf-controls-background_image-option .bf-background-image-uploader-select-container.hidden:before,
.bf-section-container .bf-controls-background_image-option .bf-background-image-uploader-select-container.hidden {
    display: none;
}

.better-custom-field-background_image .bf-background-image-preview img {
    max-width: 100%;
}

/**
 * 2.7. =>Sorter
 **************************************************************/
.bf-section-container .ui-slider {
    height: 5px;
    background-color: #FFFFFF;
    position: relative;
    margin: 40px 0 15px;
    border: 1px solid #D9D9D9;
}

.bf-section-container .ui-slider .ui-slider-range {
    height: 5px;
    background-color: #BDECFF;
    position: relative;
    margin: -1px;
    border: 1px solid #2E9DC8;
}

.bf-section-container .ui-slider .ui-slider-range:after {
    content: '';
    width: 12px;
    height: 12px;
    display: inline-block;
    position: absolute;
    right: -7px;
    top: 50%;
    background-color: #FFFFFF;
    border-radius: 50%;
    margin-top: -7px;
    border: 1px solid #2E9DC8;
    cursor: pointer;
}

.bf-section-container .ui-slider .ui-slider-handle {
    position: absolute;
    left: 0 !important;
    top: -28px;
    color: #696969;
    text-decoration: none;
    outline: none;
}

/**
 * 2.8. =>Ajax Select
 **************************************************************/
.bf-ajax_select-field-container {
    position: relative;
}

.bf-ajax_select-field-container input {
    background-color: #fff;
    line-height: 34px;
    border: 1px solid #d9d9d9;
    padding: 0px 36px 0 15px;
    box-shadow: none;
    margin: 0;
}

.bf-ajax_select-field-container span.bf-search-loader {
    position: absolute;
    right: 1px;
    top: 1px;
    border-left: 1px solid #d9d9d9;
    background-color: #fff;
    width: 34px;
    height: 34px;
    text-align: center;
    line-height: 34px;
    color: #7C7C7C;
    font-size: 12px;
    font-weight: bold;
    z-index: 10;
}

.bf-ajax_select-field-container input[type=text] {
    height: 36px !important;
}

.bf-ajax_select-field-container span.bf-search-loader.loader .fa:before {
    content: '\f021';
    -webkit-animation: spin 1.15s linear infinite;
    -moz-animation: spin 1.15s linear infinite;
    animation: spin 1.15s linear infinite;
}

.bf-ajax-suggest-search-results {
    display: none;
    position: absolute;
    top: 36px;
    left: 0px;
    z-index: 99;
    background: rgb(255, 255, 255);
    border: 1px solid rgb(206, 206, 206);
    width: 100%;
    max-height: 310px;
    overflow: auto;
    font-size: 13px;
    margin: -1px 0 0 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bf-ajax-suggest-search-results > li {
    height: 35px;
    line-height: 35px;
    border-bottom: 1px solid #F8F8F8;
    margin-bottom: 0;
    cursor: copy;
    padding: 0 10px;
}

.bf-ajax-suggest-search-results > li .del {
    display: none;
}

.bf-ajax-suggest-search-results > li:last-child {
    border-bottom: none;
}

.bf-ajax-suggest-search-results > li:hover {
    background-color: #fdffe6;
}

.bf-ajax-suggest-controls {
    padding: 0px;
    margin: 0;
}

.bf-ajax-suggest-controls > li {
    height: 27px;
    line-height: 27px;
    background: #F5F5F5;
    display: inline-block;
    padding: 0 8px 0 8px;
    margin: 9px 9px 9px 0;
    border: 1px solid #D0D0D0;
    cursor: pointer;
    vertical-align: middle;
    font-size: 13px;
    position: relative;
    -webkit-transition: border .3s ease;
    -moz-transition: border .3s ease;
    -o-transition: border .3s ease;
    transition: border .3s ease;
}

.bf-ajax-suggest-controls > li:hover {
    border: 1px solid #bababa;
}

.bf-ajax-suggest-controls > .ui-state-highlight {
    background-color: whiteSmoke;
    width: 90px;
    border: 1px solid #E2E2E2;
}

.bf-ajax-suggest-controls > li .del {
    margin-left: 8px;
    color: #D80000;
    font-weight: bold;
}

.bf-ajax-suggest-input {
    width: 100%;
}

/**
 * 2.9. =>Social Counter Sorter
 **************************************************************/
.bf-section-container.vc-input .bf-vc-sorter-list,
.better-social-counter-sorter .bf-sorter-list {
    margin: 3px 0;
}

.bf-section-container.vc-input .bf-vc-sorter-list li,
.better-social-counter-sorter .bf-sorter-list li {
    background-color: #ffffff;
    border: 1px dashed #e6e6e6;
    color: #d2d2d2;
    padding: 4px 7px;
    cursor: move;
    position: relative;
    min-height: 17px;
    font-size: 13px;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.bf-section-container.vc-input .bf-vc-sorter-list li input {
    margin: -5px 2px 0 5px;
}

.bf-section-container.vc-input .bf-vc-sorter-list li:after,
.better-social-counter-sorter .bf-sorter-list li:after {
    position: absolute;
    right: 7px;
    top: 4px;
    content: 'Disable';
    font-style: italic;
    color: #e0e0e0;
}

.bf-section-container.vc-input .bf-vc-sorter-list li.active-item,
.better-social-counter-sorter .bf-sorter-list li.active-item {
    background-color: #F7F7F7;
    border: 1px solid #CDCDCD;
    color: #8C8C8C;
}

.bf-section-container.vc-input .bf-vc-sorter-list li.placeholder-item,
.better-social-counter-sorter .bf-sorter-list li.placeholder-item {
    background-color: rgb(248, 246, 241);
    border-color: #f8b356;
}

.bf-section-container.vc-input .bf-vc-sorter-list li.placeholder-item:after,
.better-social-counter-sorter .bf-sorter-list li.placeholder-item:after {
    content: '';
}

.bf-section-container.vc-input .bf-vc-sorter-list li.active-item:after,
.better-social-counter-sorter .bf-sorter-list li.active-item:after {
    content: '';
}

.bf-section-container.vc-input .bf-vc-sorter-list li.disable-item label,
.bf-section-container.vc-input .bf-vc-sorter-list li.disable-item input,
.bf-section-container.vc-input .bf-vc-sorter-list li.disable-item,
.better-social-counter-sorter .bf-sorter-list li.disable-item label,
.better-social-counter-sorter .bf-sorter-list li.disable-item input,
.better-social-counter-sorter .bf-sorter-list li.disable-item {
    cursor: not-allowed;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.bf-section-container.vc-input .input-desc {
    margin-top: 5px;
    font-size: 13px;
    color: #a0a0a0;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item {
    color: #fff;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-facebook {
    background-color: #4a639f;
    border-color: #4a639f;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-twitter {
    background-color: #59c8ff;
    border-color: #59c8ff;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-gplus,
.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-google {
    background-color: #D73D32;
    border-color: #D73D32;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-dribbble {
    background-color: #ea4c89;
    border-color: #ea4c89;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-delicious {
    background-color: #4a79ff;
    border-color: #4a79ff;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-soundcloud {
    background-color: #F50;
    border-color: #F50;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-github {
    background-color: #666666;
    border-color: #666666;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-behance {
    background-color: #3b63fc;
    border-color: #3b63fc;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-youtube {
    background-color: #cc181e;
    border-color: #cc181e;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-vimeo {
    background-color: #46a3e9;
    border-color: #46a3e9;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-instagram {
    background-color: #517FA4;
    border-color: #517FA4;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-linkedin {
    background-color: #0266a0;
    border-color: #0266a0;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-ok_ru {
    background-color: #ee8208;
    border-color: transparent;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-vk {
    background-color: #4E729A;
    border-color: #4E729A;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-vine {
    background-color: #00bf8f;
    border-color: #00bf8f;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-pinterest {
    background-color: #cb2027;
    border-color: #cb2027;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-flickr {
    background-color: #2f44db;
    border-color: #2f44db;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-steam {
    background-color: #666666;
    border-color: #666666;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-rss {
    background-color: #f97410;
    border-color: #f97410;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-forrst {
    background-color: #3b7140;
    border-color: #3b7140;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-mailchimp {
    background-color: #2c9ab7;
    border-color: #2c9ab7;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-envato {
    background-color: #82B440;
    border-color: #82B440;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-posts {
    background-color: #4397CB;
    border-color: #4397CB;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-comments {
    background-color: #36B672;
    border-color: #36B672;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-members {
    background-color: #CA7641;
    border-color: #CA7641;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-telegram {
    background-color: #179cde;
    border-color: #179cde;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-line {
    background-color: #00c400;
    border-color: #00c400;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-viber {
    background-color: #665cac;
    border-color: #665cac;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-bbm {
    background-color: black;
    border-color: black;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-appstore {
    background-color: black;
    border-color: black;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-android {
    background-color: #68b445;
    border-color: #68b445;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-tumblr {
    background-color: #36465d;
    border-color: #36465d;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-ok_ru {
    background-color: #e27e35;
    border-color: #e27e35;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-linkedin {
    background-color: #0266a0;
    border-color: #0266a0;
}

.better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-snapchat {
    background-color: #fffc00;
    border-color: #fffc00;
    color: #000;
}

/**
 * 2.10. =>Image Select
 **************************************************************/

.bf-section-container .better-select-image {
    margin-bottom: 10px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options,
.bf-section-container .better-select-image.bf-opened {
    box-shadow: 0 0px 13px rgba(51, 51, 51, 0.31);
}

.bf-section-container .better-select-image .select-label {
    padding-right: 8px;
    display: inline-block;
    font-style: italic;
}

.bf-section-container .better-select-image .select-options,
.bf-section-container .better-select-style {
    position: relative;
    width: 100%;
    background-color: #fff;
    display: inline-block;
    height: 36px;
    line-height: 36px;
    border: 1px solid #d9d9d9;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.bf-section-container .better-select-style {
    padding: 3px 13px;
    font-size: 13px;
    line-height: 28px;
}

.bf-section-container .better-select-image.bf-opened .select-options .selected-option {
    background-color: #fafafa;

}

.bf-section-container .better-select-image .select-options:after,
.bf-section-container .better-select-style:after {
    color: #aaa;
    content: '\f107';
    border: 0;
    background: 0 0;
    font-family: 'FontAwesome';
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    font-style: normal;
    color: #7C7C7C;
    speak: none;
    display: block;
    padding: 0;
    text-indent: 0;
    position: absolute;
    right: -1px;
    top: -1px;
    width: 34px;
    height: 34px;
    border: 1px solid #d9d9d9;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-decoration: none !important;
    z-index: 3;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    line-height: 36px;
}

.bf-section-container .better-select-image:hover .select-options,
.bf-section-container .better-select-image.bf-opened .select-options {
    border-color: #C0C0C0;
}

.bf-section-container .better-select-image.bf-opened .select-options {
    z-index: 99;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options {
    border-color: #C0C0C0;
}

.bf-section-container .better-select-image:hover .select-options:after,
.bf-section-container .better-select-image.bf-opened .select-options:after {
    color: #757575;
    border-color: #C0C0C0;
}

.bf-section-container .better-select-image.bf-opened .select-options:after {
    content: '\f106';
}

.bf-section-container .better-select-image .select-options .selected-option {
    display: block;
    font-size: 13px;
    height: 34px;
    line-height: 35px;
    padding: 0 10px;
    background-color: #fff;
    z-index: 2;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.bf-section-container .better-select-image .select-options .better-select-image-options {
    background-color: #fafafa;
    border: 1px solid #999;
    position: absolute;
    top: 34px;
    left: -1px;
    right: -1px;
    padding: 0 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: none;
    z-index: 1;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options {
    display: block;
    cursor: default;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul {
    margin: 15px 0 0 0;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul li {
    margin-bottom: 15px;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 5px;
    border: 1px solid #dddddd;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    text-align: center;
    background-color: #fff;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul li img {
    display: block;
    margin: 0 auto 5px auto;
    /* retina.js fixes for hidden images! */
    width: auto !important;
    height: auto !important;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul li:hover {
    border-color: #c5c5c5;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul li.selected {
    border-color: #0074a2;
}

/* 2 Column Style */
.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-2-column li {
    width: 48%;
    float: left;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-2-column li:nth-child(odd) {
    margin-right: 4px;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-2-column li:nth-child(even) {
    margin-left: 4px;
}

/* 3 Column Style */
.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-3-column li {
    width: 32.43%;
    float: left;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-3-column li:nth-child(3n-1) {
    margin-right: 4px;
    margin-left: 4px;
}

/* 4 Column Style */
.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-4-column li {
    width: 32.43%;
    float: left;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-4-column li {
    margin-right: 4px;
    width: 23.9%;
    float: left;
}

.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-4-column li:nth-child(16),
.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-4-column li:nth-child(8),
.bf-section-container .better-select-image.bf-opened .select-options .better-select-image-options ul.grid-4-column li:nth-child(4) {
    margin-right: 0px;
}

/**
 * 2.11. =>Icon Select
 **************************************************************/
.bf-section-container .bf-icon-modal-handler {
    margin-bottom: 10px;
    position: relative;
    width: 100%;
}

.bf-section-container .bf-icon-modal-handler .select-options {
    margin: 0;
    box-shadow: none;
    width: 100%;
    margin: 0;
    border: 1px solid #d6d6d6;
    color: #333333;
    padding: 3px 13px;
    pearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    border: 1px solid #d9d9d9;
    box-sizing: border-box;
    -webkit-box-sizing: none;
    -moz-box-sizing: none;
    -o-box-sizing: none;
    display: block;
    font-size: 13px;
    outline: none;
    overflow: ellipsis;
    position: relative;
    text-indent: 0.01px;
    text-overflow: '';
    -webkit-text-overflow: none;
    -moz-text-overflow: none;
    -o-text-overflow: none;
    vertical-align: middle;
    z-index: 1;
    height: 34px;
    cursor: pointer;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.bf-section-container .bf-icon-modal-handler .select-options .selected-option {
    line-height: 27px;
}

.bf-section-container .bf-icon-modal-handler .select-options .selected-option .text-muted {
    color: #A9A9A9;
    font-style: italic;
    margin-left: 3px;
    display: inline-block;
}

.bf-section-container .bf-icon-modal-handler .select-options .selected-option .bf-icon {
    margin-right: 4px;
    min-width: 22px;
    height: 22px;
    line-height: 22px;
    display: inline-block;
    vertical-align: middle;
    text-align: left;
}

.bf-section-container .bf-icon-modal-handler .select-options .selected-option .bf-icon img {
    max-height: 75% !important;
    vertical-align: top;
}

.bf-section-container .bf-icon-modal-handler .select-options:before {
    color: #aaa;
    content: "\f002";
    border: 0;
    background: #fff 0 0;
    font-family: 'FontAwesome';
    text-align: center;
    font-size: 12px;
    font-weight: normal;
    color: #7C7C7C;
    speak: none;
    display: block;
    padding: 0;
    text-indent: 0;
    position: absolute;
    right: 0px;
    top: 0px;
    width: 32px;
    height: 32px;
    border-left: 1px solid #d9d9d9;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-decoration: none !important;
    z-index: 3;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    font-style: normal;
    line-height: 32px;
}

.bf-section-container .bf-icon-modal-handler:hover .select-options:before,
.bf-section-container .bf-icon-modal-handler:hover .select-options {
    border-color: #C2C2C2;
}

/**
 * 2.12. =>Typography
 **************************************************************/
.bf-section-container .typography-desc {
    padding-bottom: 20px;
    color: #A8A8A8;
    font-size: 13px;
}

.bf-section-container .chosen-container {
    margin-bottom: 10px;
}

.bf-section-container .typo-field-container {
    width: 50%;
    margin-bottom: 14px;
    padding: 0 10px;
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bf-section-container .typo-field-container:before {
    top: 23px !important;
    right: 10px !important;
}

.bf-section-container .typo-field-container.font-family-container {
    width: 100%;
}

.bf-section-container .typo-field-container label {
    font-size: 13px;
    padding-bottom: 5px;
    display: inline-block;
    font-weight: bold;
}

.bf-section-container .bf-section.bf-section-typography-option .bf-heading {
    width: 100% !important;
    padding: 0 0 10px !important;
}

.bf-section-container .typo-field-container .bf-field-with-prefix input[type=text],
.bf-section-container .typo-field-container .bf-field-with-suffix input[type=text] {
    width: 72.5% !important;
}

.bf-section-container .typo-field-container .bf-field-with-prefix span,
.bf-section-container .typo-field-container .bf-field-with-suffix span {
    width: 20% !important;
    padding: 0 4%;
    text-align: center;
    z-index: 10;
    position: relative;
}

.bf-section-container .typo-field-container .bf-field-with-prefix span {
    border-right: 1px solid #d9d9d9;
}

.bf-section-container .typo-field-container .bf-field-with-suffix span {
    border-left: 1px solid #d9d9d9;
}

.bf-section-container .typo-enable-container {
    margin-bottom: 10px;
}

.bf-section-container .bf-controls-typography-option .bf-color-picker-container {
    width: 100% !important;
}

.bf-section-container .load-preview-texts {
    padding: 0 20px;
    width: 120px;
    display: block;
    margin: 25px auto 0 auto;
    background-color: #f4f4f4;
    font-size: 13px;
    text-align: center;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    color: #8e8e8e;
    border-radius: 5px;
}

.bf-section-container .load-preview-texts:hover {
    color: #525252;
}

.bf-section-container .typography-preview {
    display: none;
    color: #333;
    font-size: 16px;
    -webkit-font-smoothing: all;
    font-smoothing: all;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
}

.bf-section-container .typography-preview .preview-text {
    display: none;
}

.bf-section-container .typography-preview .preview-text.current {
    display: block;
    line-height: 1.34;
}

.bf-section-container .typography-preview .preview-tab {
    padding: 0;
    margin: 0 0 15px 0;
    border-bottom: 1px solid #bababa;
}

.bf-section-container .typography-preview .preview-tab .tab {
    padding: 0;
    margin: 0;
    float: left;
    margin-bottom: -1px;
}

.bf-section-container .typography-preview .preview-tab .tab a {
    padding: 0 10px;
    height: 34px;
    line-height: 34px;
    border: 1px solid #d3d3d3;
    border-bottom: none;
    border-right: none;
    font-size: 13px;
    font-weight: bold;
    color: #8d8d8d;
    text-decoration: none;
    display: block;
    background-color: #fafafa;
    outline: none;
    box-shadow: none;
}

.bf-section-container .typography-preview .preview-tab .tab.current {
    margin-bottom: -1px;
}

.bf-section-container .typography-preview .preview-tab .tab.current a {
    color: #333;
    padding-bottom: 1px;
    border-color: #a8a8a8 !important;
    background-color: #fff;
}

.bf-section-container .typography-preview .preview-tab .tab:last-child a {
    border-right: 1px solid #d3d3d3;
}

.bf-section-container .typography-preview .preview-tab .tab:first-child a {
}

.bf-section-typography-option.have-enable-field .typo-fields-container,
.bf-section-typography-option.have-enable-field .bf-explain {
    position: relative;
}

.bf-section-typography-option.have-enable-field.disable-field .enable-disable,
.bf-section-typography-option.have-enable-field.disable-field .bf-explain:before {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.65);
    display: block;
    content: "";
    z-index: 99;
}

.typo-field-container .chosen-container .chosen-results li.group-result {
    display: list-item;
    font-weight: 700;
    cursor: default;
    background: #2D9EC7;
    border: 1px solid #0074A2;
    color: #fff;
    padding: 8px 11px;
    font-size: 13px;
    margin-top: 10px;
}

.typo-field-container .chosen-single {
    border-radius: 0px;
    background: #fff;
    margin: 0;
    box-shadow: none;
    width: 100%;
    margin: 0;
    border: 1px solid #d6d6d6;
    color: #333333;
    padding: 3px 13px;
    pearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    border: 1px solid #d9d9d9;
    box-sizing: border-box;
    -webkit-box-sizing: none;
    -moz-box-sizing: none;
    -o-box-sizing: none;
    display: block;
    font-size: 13px;
    outline: none;
    overflow: ellipsis;
    position: relative;
    text-indent: 0.01px;
    text-overflow: '';
    -webkit-text-overflow: none;
    -moz-text-overflow: none;
    -o-text-overflow: none;
    vertical-align: middle;
    z-index: 1;
    height: 34px;
}

.typo-field-container .chosen-container-single .chosen-single div {
    border-left: 1px solid #D6D6D6;
    padding: 0 7px;

    min-width: 35px;
    box-sizing: border-box;
}

.typo-field-container .chosen-container-single.chosen-rtl .chosen-single div {
    border-left: none;
    border-right: 1px solid #D6D6D6;
    left: 0;
}

.typo-field-container .chosen-container-single .chosen-single div b {
    background-position: 5px 6px;
}

.typo-field-container .chosen-container-single.chosen-with-drop .chosen-single div b {
    background-position: -13px 6px;
}

.typo-field-container .chosen-rtl .chosen-search input[type=text] {
    height: 28px !important;
}

.typo-field-container .bs-color-picker-wrapper .wp-color-result {
    height: 32px;
}

.typo-field-container .bs-color-picker-wrapper .wp-color-result:after {
    line-height: 32px;
}

/**
 * 2.13. =>Social Share Sorter
 **************************************************************/
.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list,
.bf-section-container .bf-sorter-list {
    margin: 3px 0;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li,
.bf-section-container .bf-sorter-list li {
    background-color: #ffffff;
    color: #d2d2d2;
    padding: 0 12px;
    cursor: move;
    position: relative;
    font-size: 13px;
    min-height: 28px;
    line-height: 28px;
    margin-right: 10px;
    min-width: 130px;
    max-width: 230px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: none;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li {
    width: 200px;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.active-item {
    border: none;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.active-item:after {
    content: '';
    display: none;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li,
.bf-section-container .bf-sorter-list li {
    background-color: #bababa;
    color: #5c5c5c;
    -webkit-transition: background-color .3s ease;
    -moz-transition: background-color .3s ease;
    -o-transition: background-color .3s ease;
    transition: background-color .3s ease;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li .bf-icon,
.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li .fa,
.bf-section-container .bf-sorter-list li .bf-icon,
.bf-section-container .bf-sorter-list li .fa {
    margin-right: 5px;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item,
.bf-section-container .bf-sorter-list li.checked-item {
    color: #fff;
    background: #2D9DCD;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-facebook,
.bf-section-container .bf-sorter-list li.checked-item.item-facebook {
    background-color: #4a639f;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-facebook:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-facebook:hover {
    background-color: #5271b3;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-wordpress,
.bf-section-container .bf-sorter-list li.checked-item.item-wordpress {
    background-color: #0073aa;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-wordpress:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-wordpress:hover {
    background-color: #1083aa;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-disqus,
.bf-section-container .bf-sorter-list li.checked-item.item-disqus {
    background-color: #2e9fff;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-disqus:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-disqus:hover {
    background-color: #3eafff;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-twitter,
.bf-section-container .bf-sorter-list li.checked-item.item-twitter {
    background-color: #59c8ff;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-twitter:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-twitter:hover {
    background-color: #58d1ff;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-google_plus,
.bf-section-container .bf-sorter-list li.checked-item.item-google_plus {
    background-color: #D73D32;
}

.bf-section-container.vc-input.bf-sorter-list li.checked-item#bf-sorter-group-item-sites-google_plus:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-google_plus:hover {
    background-color: #e64035;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-pinterest,
.bf-section-container .bf-sorter-list li.checked-item.item-pinterest {
    background-color: #cb2027;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-pinterest:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-pinterest:hover {
    background-color: #e32229;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-linkedin,
.bf-section-container .bf-sorter-list li.checked-item.item-linkedin {
    background-color: #0266a0;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-linkedin:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-linkedin:hover {
    background-color: #027ec1;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-tumblr,
.bf-section-container .bf-sorter-list li.checked-item.item-tumblr {
    background-color: #3e5a70;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-tumblr:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-tumblr:hover {
    background-color: #426283;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-email,
.bf-section-container .bf-sorter-list li.checked-item.item-email {
    background-color: #0c151c;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-email:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-email:hover {
    background-color: #152430;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-print,
.bf-section-container .bf-sorter-list li.checked-item.item-print {
    background-color: #0c151c;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-print:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-print:hover {
    background-color: #152430;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-telegram,
.bf-section-container .bf-sorter-list li.checked-item.item-telegram {
    background-color: #179cde;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-telegram:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-telegram:hover {
    background-color: #179cde;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-whatsapp,
.bf-section-container .bf-sorter-list li.checked-item.item-whatsapp {
    background-color: #00ca65;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-whatsapp:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-whatsapp:hover {
    background-color: #00b65b;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-line,
.bf-section-container .bf-sorter-list li.checked-item.item-line {
    background-color: #00b900;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-line:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-line:hover {
    background-color: #008900;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-facebook-messenger,
.bf-section-container .bf-sorter-list li.checked-item.item-facebook-messenger {
    background-color: #448AFF;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-facebook-messenger:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-facebook-messenger:hover {
    background-color: #448AFF;
}

.bf-section-container .bf-sorter-list li.item-line .bsfi-line {
    font-size: 18px;
}

.bf-section-container .bf-sorter-list li.item-line .bsfi-bbm:before,
.bf-section-container .bf-sorter-list li.item-line .bsfi-viber:before,
.bf-section-container .bf-sorter-list li.item-line .bsfi-line:before {
    vertical-align: middle;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-bbm,
.bf-section-container .bf-sorter-list li.checked-item.item-bbm {
    background-color: #0e0e0e;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-bbm:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-bbm:hover {
    background-color: #373737;
}

.bf-section-container .bf-sorter-list li.item-bbm .fa.fa-bbm {
    font-size: 18px;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-viber,
.bf-section-container .bf-sorter-list li.checked-item.item-viber {
    background-color: #5d54a4;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-viber:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-viber:hover {
    background-color: #424181;
}

.bf-section-container .bf-sorter-list li.item-viber .fa.fa-viber {
    font-size: 18px;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-reddit,
.bf-section-container .bf-sorter-list li.checked-item.item-reddit {
    background-color: #dc3c01;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-reddit:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-reddit:hover {
    background-color: #c43501;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-stumbleupon,
.bf-section-container .bf-sorter-list li.checked-item.item-stumbleupon {
    background-color: #ee4813;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-stumbleupon:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-stumbleupon:hover {
    background-color: #c13b10;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-vk,
.bf-section-container .bf-sorter-list li.checked-item.item-vk {
    background-color: #4c75a3;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-vk:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-vk:hover {
    background-color: #415f84;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-ok-ru,
.bf-section-container .bf-sorter-list li.checked-item.item-ok-ru {
    background-color: #cb6e04;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-ok-ru:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-ok-ru:hover {
    background-color: #b55c04;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-digg,
.bf-section-container .bf-sorter-list li.checked-item.item-digg {
    background-color: #000;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li.checked-item#bf-sorter-group-item-sites-digg:hover,
.bf-section-container .bf-sorter-list li.checked-item.item-digg:hover {
    background-color: #121212;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.placeholder-item,
.bf-section-container .bf-sorter-list li.placeholder-item {
    background-color: rgb(226, 226, 226);
    border: 1px dashed #a8a8a8;
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li.placeholder-item:after,
.bf-section-container .bf-sorter-list li.placeholder-item:after {
    content: '';
}

.bf-section-container.vc-input.bs-theme-social-share-sorter li input,
.bf-section-container .bf-sorter-list li input {
    margin-right: 10px;
    outline: none;
}

/**
 * 2.14. =>Repeater Item
 **************************************************************/
.bf-repeater-item {
    position: relative;
    background-color: #F5F5F5;
    border: 1px solid #E2DDDB;
    margin-bottom: 15px;
}

.bf-section-repeater-option > .bf-explain {
    margin-bottom: 15px;
}

.bf-repeater-item .bf-remove-repeater-item-btn {
    float: right;
    font-size: 11px;
    color: #a00;
    cursor: pointer;
}

.bf-repeater-item .bf-remove-repeater-item-btn:hover {
    color: red;
}

.bf-repeater-item .bf-remove-repeater-item-btn .dashicons {
    font-size: 15px;
    line-height: 15px;
    vertical-align: middle;
}

.bf-repeater-item .bf-remove-repeater-item-btn .dashicons:before {
    content: "\f182";

}

/* repeator item container */
.bf-repeater-item .repeater-item-container {
    padding: 17px;
    background-color: #FFF;
}

.bf-repeater-item .repeater-item-container .bf-section:last-child {
    margin-bottom: 0;
}

/* repeator item title */
.bf-repeater-item .bf-repeater-item-title {
    position: relative;
    height: 40px;
    padding: 0 55px 0 15px;
    line-height: 40px;
    border-bottom: 1px solid #E2DDDB;
    font-weight: bold;
}

.bf-repeater-item .bf-repeater-item-title h5 {
    margin: 0;
    font-weight: bold;
    font-size: .83em;
    display: block;
    line-height: 40px;
    color: #444;
}

/* repeater item handle */
.bf-repeater-item .bf-repeater-item-title .handle-repeater-item {
    float: right;
    height: 40px;
    width: 40px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    position: absolute;
    right: -1px;
    top: -1px;
    border: 1px solid #E2DDDB;
}

.bf-repeater-item .bf-repeater-item-title .handle-repeater-item:before {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    padding: 9px 10px;
    top: 0;
    position: relative;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-decoration: none !important;
    content: "\f068";
}

.bf-repeater-item .bf-repeater-item-title .handle-repeater-item.bf-closed:before {
    content: "\f067";
}

/**
 * 2.15. =>Border
 **************************************************************/
.bf-section-container .single-border {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}

.bf-section-container .single-border:last-child {
    margin-bottom: 0;
    border-bottom: none;
}

.bf-section-container .single-border .border-label {
    min-width: 100px;
    font-size: 13px;
    display: inline-block;
    color: #7C7C7C;
}

.bf-section-container .single-border input[type=text] {
    width: 37px;
    vertical-align: middle;
}

.bf-section-container .single-border select {
    width: 90px;
}

.bf-section-container .single-border input.bf-color-picker {
    width: 100px;
}

.bf-section-container .single-border .bf-field-with-suffix {
    margin-bottom: 0;
}

.bf-section-container .single-border .bf-color-picker-preview {
    top: 7px;
}

.bf-section-container .border-preview {

}

.bf-section-container .border-preview .preview-box {
    width: 120px;
    height: 110px;
    display: block;
    margin: 15px auto;
    border: 1px solid #eee;
}

/**
 * 2.16. =>Info
 **************************************************************/
.bf-section-container .bf-section-info {
    background-color: #eee;
    border: 1px solid #e0e0e0;
    margin-top: 10px;
}

.bf-section-container .bf-section-info .bf-section-info-title {
    padding: 15px 20px;
    background-color: #e8e8e8;
    border-bottom: 1px solid #e0e0e0;
}

.bf-section-container .bf-section-info .bf-section-info-title h3 {
    padding: 0 !important;
    margin: 0 !important;
    font-size: 13px !important;
    border: none;
}

.bf-section-container .bf-section-info .bf-section-info-title .fa {
    margin-right: 3px;
}

.bf-section-container .bf-section-info .bf-controls-info-option {
    padding: 20px;
}

.bf-section-container .bf-section-info .info-value {
    font-size: 13px;
}

.bf-section-container .bf-section-info .info-value img {
    max-width: 100%;
    height: auto;
}

.bf-section-container .bf-section-info .info-value p {
    margin: 0 0 7px 0;
}

.bf-section-container .bf-section-info .info-value ul {
    list-style: disc;
    padding-left: 20px;
    margin: 0 0 10px 0;
}

.bf-section-container .bf-section-info .info-value ol {
    list-style: decimal;
    padding-left: 20px;
    margin: 0 0 10px 0;
}

.bf-section-container .bf-section-info .info-value a {
    text-decoration: underline;
}

.bf-section-container .bf-section-info.help,
.bf-section-container .bf-section-info.info {
    background-color: #EFFAFF;
    border-color: #bce8f1;
    color: #31708f;
}

.bf-section-container .bf-section-info.help .bf-section-info-title,
.bf-section-container .bf-section-info.info .bf-section-info-title {
    background-color: #E2F5FD;
    border-color: #bce8f1;
    color: #31708f;
}

.bf-section-container .bf-section-info.help .bf-section-info-title h3,
.bf-section-container .bf-section-info.info .bf-section-info-title h3 {
    color: #31708f;
}

.bf-section-container .bf-section-info.warning {
    background-color: #FFFDF4;
    border-color: #F1E0BD;
    color: #8a6d3b;
}

.bf-section-container .bf-section-info.warning .bf-section-info-title {
    background-color: #fcf8e3;
    border-color: #F1E0BD;
    color: #8a6d3b;
}

.bf-section-container .bf-section-info.warning .bf-section-info-title h3 {
    color: #8a6d3b;
}

.bf-section-container .bf-section-info.danger {
    background-color: #FFF4F4;
    border-color: #E9BBC2;
    color: #a94442;
}

.bf-section-container .bf-section-info.danger .bf-section-info-title {
    background-color: #FFE4E4;
    border-color: #ebccd1;
    color: #a94442;
}

.bf-section-container .bf-section-info.danger .bf-section-info-title h3 {
    color: #a94442;
}

/**
 * 2.17. =>Switch
 **************************************************************/
.bf-switch {
    margin: 0;
    color: #fff;
    padding: 2px;
    border: 1px solid #D9D9D9;
    height: 34px;
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 33px;
}

.bf-switch .cb-enable,
.bf-switch .cb-disable,
.bf-switch .cb-enable span,
.bf-switch .cb-disable span {
    display: block;
    float: left;
}

.bf-switch .cb-disable span {
    border-radius: 0 33px 33px 0;
}

.bf-switch .cb-enable span {
    border-radius: 33px 0 0 33px;
}

.bf-switch .cb-enable span,
.bf-switch .cb-disable span {
    line-height: 26px;
    display: block;
    font-style: normal;
    font-weight: bold;
    padding: 0 10px;
    font-size: 13px;
    -webkit-transition: all .15s ease;
    -moz-transition: all .15s ease;
    -o-transition: all .15s ease;
    transition: all .15s ease;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #BEBEBE;
    background-color: #F4F4F4;
    border: 1px solid #ECECEC;
}

.bf-switch .cb-enable span {
    border-right-color: transparent;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.bf-switch .cb-enable:hover span {
    border-color: #A3CDA4;
    color: #64BD65;
    border-right-color: transparent;
}

.bf-switch .cb-disable span {
    border-left-color: transparent;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.bf-switch .cb-disable:hover span {
    border-color: #FF9090;
    color: #FF9090;
    border-left-color: transparent;
}

.bf-switch .cb-disable.selected:hover span,
.bf-switch .cb-disable.selected span {
    color: #FFFFFF;
    background: #FF9090;
    border-color: #F48080;
    text-shadow: 0px 1px 0 #EC7979;
}

.bf-switch .cb-enable.selected:hover span,
.bf-switch .cb-enable.selected span {
    background: #64BD65;
    color: #fff;
    border-color: #55AD56;
    text-shadow: 0px 1px 0 #499D4A;
}

.bf-switch label {
    cursor: pointer;
    padding: 0 !important;
}

.bf-switch input {
    display: none;
}

/**
 * 2.18. =>Fields Group
 **************************************************************/
.fields-group {
    border: 1px solid #D3D3D3;
    margin-bottom: 25px;
    margin-top: 25px;
}

.fields-group:first-child {
    margin-top: 4px;
}

.fields-group .fields-group-title-container {
    background-color: #F5F5F5;
    border-bottom: 1px solid #D3D3D3;
    padding: 0;
    position: relative;
    height: 40px;
    line-height: 40px;
}

.fields-group .fields-group-title-container .fields-group-title {
    font-size: 15px;
    color: #222222;
    font-weight: bold;
    display: block;
    padding: 0 62px 0 20px;
}

.fields-group.collapsible .fields-group-title-container .fields-group-title {
    cursor: pointer;
}

.fields-group.collapsible .fields-group-title-container .collapse-button {
    width: 40px;
    height: 100%;
    line-height: 39px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    color: #7C7C7C;
    display: inline-block;
    padding: 0;
    position: absolute;
    right: -1px;
    top: -1px;
    border: 1px solid #d9d9d9;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    cursor: pointer;
}

.fields-group.collapsible .fields-group-title-container:hover .collapse-button {
    color: #222222;
}

.fields-group.collapsible .bf-group-inner {
    padding-top: 5px;
    padding-bottom: 5px;
}

.fields-group.collapsible .bf-group-desc {
    padding: 15px 20px;
    color: #939393;
    font-size: 13px;
}

.bf-group-inner .fields-group {
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 15px;
}

/* Blue Style */
.fields-group.blue {
    border-color: #bce8f1;
}

.fields-group.blue .fields-group-title-container .fields-group-title {
    color: #31708f;
}

.fields-group.blue .fields-group-title-container {
    background-color: #E2F5FD;
    border-color: #bce8f1;
}

/* Green Style */
.fields-group.green {
    border-color: #8BE8A9;
}

.fields-group.green .fields-group-title-container .fields-group-title {
    color: #409D5E;
}

.fields-group.green .fields-group-title-container {
    background-color: #C5F7D5;
    border-color: #8BE8A9;
}

.fields-group.bf-widgets .fields-group-title-container {
    height: 40px;
    line-height: 40px;
}

.fields-group.bf-widgets .fields-group-title-container .fields-group-title {
    font-size: 13px;
}

.fields-group.bf-widgets .fields-group-title-container .collapse-button {
    line-height: 41px;
}

.fields-group.bf-widgets .bf-group-inner {
    padding: 5px 15px;
}

.fields-group.bf-widgets .bf-group-inner .bf-section-container:last-child .bf-explain {
    margin-bottom: 10px;
}

/**
 * 2.19. =>Media
 **************************************************************/
.bf-section-container .bf-section.bf-section-media-option .bf-controls input[type=text] {
    width: 65%;
    float: left;
}

.bf-section-container .bf-section.bf-section-media-option .bf-controls .bf-media-upload-btn {
    float: right;
    text-align: center;
}

/**
 * 2.20. =>Code Editor
 **************************************************************/
.bf-editor {
    margin: 0 0 10px;
}

.ace_editor {
    direction: ltr;
    text-align: left;
}

/**
 *   2.21. =>Custom Checkbox/Radio Field
 **************************************************************/
.bf-checkbox-multi-state,
.bf-radio-field {
    width: 18px;
    height: 18px;
    border: 1px solid #d0d0d0;
    overflow: hidden;
    background: #fff;
    margin: 0 5px 0 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    cursor: pointer;
}

.bf-checkbox-multi-state > span,
.bf-radio-field > span {
    display: none;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: 18px;
    line-height: 18px;
    height: 18px;
    text-align: center;
}

.bf-checkbox-multi-state .fa,
.bf-radio-field .fa {
    font-size: 15px;
    display: inline-block;
}

.bf-checkbox-multi-state[data-current-state="active"] .fa,
.bf-checkbox-multi-state[data-current-state="active"] + .label,
.bf-radio-field .active .fa,
.bf-radio-field .active + .label {
    color: #459d45;
}

.bf-radio-field [data-current-state="deactivate"] .fa,
.bf-checkbox-multi-state[data-current-state="deactivate"] + .label {
    color: #e74141;
}

.bf-checkbox-multi-state[data-current-state="active"] + .label,
.bf-radio-field .active + .label {
    font-family: 'Open Sans';
    font-size: 14px;
    font-weight: 600;
}

.bf-radio-field {
    border-radius: 10px;
}

.bf-radio-field .fa {
    font-size: 12px;
    color: #444;
    width: 10px;
    height: 10px;
    line-height: 12px;
    text-align: center;
    position: absolute;
    top: 50%;
    margin-top: -6px;
    left: 50%;
    margin-left: -6px;
    background: #444;
    border-radius: 50%;
    overflow: hidden;
}

.bf-radio-toggle {
    cursor: pointer;
}

/**
 *   2.22. =>Term Select Field Style
 **************************************************************/
.bf-field-term-select-help {
    padding: 6px 10px;
    text-align: left;
    color: #969696;
    font-size: 13px;
    font-style: italic;
}

.bf-field-term-select-help .active-state {
    color: #459d45;
}

.bf-field-term-select-help .deactivate-state {
    color: #e74141;
}

.bf-field-term-select-help .bf-checkbox-multi-state {
    margin: 0 0 0 9px;
}

.bf-field-term-select-wrapper.loading {
    text-align: center;
}

.bf-field-term-select-wrapper {
    border: 1px solid #dcdcdc;
    padding: 3px 10px 0px 0;
    background: #fbfbfb;
    max-height: 190px;
    overflow-y: scroll;
}

.bf-field-term-select-wrapper ul,
.bf-field-term-select-wrapper li {
    list-style: none;
    position: relative;
}

.bf-field-term-select-wrapper li {
    margin-bottom: 11px;
}

.bf-field-term-select-wrapper li:before {
    content: ' ';
    height: 1px;
    background: #cecece;
    position: absolute;
    left: -22px;
    top: 7px;
    width: 13px;
}

.bf-field-term-select-wrapper li li:last-child:after {
    content: ' ';
    height: 100%;
    background: #fbfbfb;
    position: absolute;
    left: -32px;
    top: 8px;
    width: 20px;
}

.bf-field-term-select-wrapper ul {
    border-left: 1px solid #CECECC;
    padding: 0 0 0 22px;
}

.bf-field-term-select-wrapper > ul {
    border-width: 0;
}

.bf-field-term-select-wrapper ul ul {
    margin-left: 9px;
    padding-top: 6px;
}

.bf-field-term-select-wrapper li .label {
    color: #444;
}

.bf-field-term-select-wrapper .bf-make-term-primary,
.bf-field-term-select-wrapper .bf-excluded-term {
    font-style: italic;
    color: #3c3c3c;
    font-size: 13px;
    margin-left: 15px;
    position: relative;
    opacity: 0.8;
}

.bf-field-term-select-wrapper .bf-excluded-term {
    opacity: 0.6;
}

.bf-field-term-select-wrapper .bf-make-term-primary:before,
.bf-field-term-select-wrapper .bf-excluded-term:before {
    margin-right: 10px;
    content: ' ';
    height: 1px;
    width: 20px;
    background: #cecece;
    display: inline-block;
    position: relative;
    top: -4px;
}

.bf-field-term-select-wrapper span.label .bf-make-term-primary {
    display: none;
}

.bf-field-term-select-wrapper.bf-field-term-show-primary-label
span.label[data-status="active"] .bf-make-term-primary {
    display: inline-block;
}

.bf-field-term-select-deferred {
    min-height: 150px;
}

/**
* 2.23. =>Selector Modal
 **************************************************************/
.bssm-list {
    list-style: none;
    padding: 20px;
    font-family: Open Sans;

    max-height: 540px;
    overflow-y: auto;
    position: relative;

    font-size: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 20px;
    row-gap: 20px;
}

.bssm-item {
    margin: 0;
}

.one-column .bssm-list{
    grid-template-columns: 1fr;
}

.two-column .bssm-list{
    grid-template-columns: repeat(2, 1fr);
}

.three-column .bssm-list{
    grid-template-columns: repeat(3, 1fr);
}

.four-column .bssm-list{
    grid-template-columns: repeat(4, 1fr);
}

.bssm-style-1 .bssm-item {
    padding: 0;
    margin: 0;
    background: #fff;
    border: 1px solid #cecece;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;

    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;

    -webkit-box-shadow: 0 1px 1px -1px rgba(0, 0, 0, .1);
    box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);

    position: relative;

    cursor: pointer;
}

.bssm-item .bf-item-badges {
    position: absolute;
    top: 0;
    right: 0;
    line-height: 0;
}

.bssm-item .bf-item-badge {
    background: #d54e21;
    display: inline-block;
    padding: 2px 5px;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    border: 1px solid #d4d4d4;
    border-width: 0 0 1px 1px;
    line-height: 1.6;
}

.bssm-style-1 .bssm-item.bssm-selected,
.bssm-style-1 .bssm-item:not(.bssm-selected):hover {
    border: 1px solid #4c954f;
}

.bssm-style-1 .bssm-selected:before {
    content: '\f00c';
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    color: #fff;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    background: #5ca65f;
    border-radius: 0 0 0px 3px;
    padding: 7px;
    -webkit-font-smoothing: antialiased;
    font-size: 12px;
    -moz-osx-font-smoothing: grayscale;
}

.bssm-style-1 .bssm-preview {
    color: #212121;
    font-weight: normal;
    font-size: 22px;
    padding: 13px 13px;
    height: 106px;
    overflow: hidden;
    line-height: 26px;
}

.bssm-style-1 .bssm-info {
    background: #f9f9f9;
    border-top: 1px solid #ddd;
    padding: 13px 13px;
    -webkit-border-radius: 0 0 3px 3px;
    -moz-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
    text-align: left;
    line-height: 0;
}

.bssm-style-1 .bssm-info,
.bssm-style-1 .bssm-info > span {
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}

.bssm-selected .bssm-info {
    background: #5ca65f;
    color: #fff;
    border-color: #4c954f;
}

.bssm-style-1 .bssm-item:hover .bssm-info {
    color: #4c954f;
    border-color: #4c954f;
}

.bssm-style-1 .bssm-info > .bssm-name {
    color: #424242;
    font-size: 14px;
    display: block;
    line-height: 14px;
    height: 18px;
    width: 150px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-bottom: 3px;
    font-weight: 600;
}

.bssm-style-1 .bssm-info > .bssm-type {
    color: #ababab;
    font-size: 11px;
    line-height: 11px;
    display: inline-block;
}

.bssm-style-1 .bssm-info > .bssm-styles {
    color: #ababab;
    font-size: 11px;
    line-height: 11px;
    float: right;
}

.bssm-style-1 .bssm-item:hover .bssm-name,
.bssm-style-1 .bssm-item:hover .bssm-type,
.bssm-style-1 .bssm-item:hover .bssm-styles {
    color: #4c954f !important;
}

.bssm-style-1 .bssm-item.bssm-selected .bssm-name,
.bssm-style-1 .bssm-item.bssm-selected .bssm-type,
.bssm-style-1 .bssm-item.bssm-selected .bssm-styles {
    color: #fff !important;
}

.bssm-content {
    background: #eee;
    margin-right: 260px;
    height: 540px;
}

.bs-modal.no-sidebar .bssm-content {
    margin-right: 0;
}

.bs-modal.no-sidebar .bssm-sidebar {
    display: none;
}

.bs-selector-modal .bs-modal-header-wrapper {
    color: #4d4d4d;
    border-bottom: 1px solid #d8d8d8;
}

.bs-selector-modal .bs-modal-header-wrapper:after {
    display: none;
}

.bs-selector-modal .bs-modal-heade {
    height: 50px;
}

.bs-selector-modal .bs-modal-body {
    overflow: hidden;
    padding: 0;
    position: relative;
}

/**
* 2.24. =>Pre Defined Styles Modal
 **************************************************************/
.pds-modal .bf-btn-secondary {
    font-size: 13px;
}

.pds-modal .bf-btn-secondary.disabled,
.pds-modal .bf-btn-secondary[disabled] {
    color: #bbb;
    border-color: #ddd;
    pointer-events: none;
}

.pds-modal .bf-btn-primary {
    font-size: 13px;
    font-weight: normal;
}

.pds-modal .bf-btn-primary.disabled {
    pointer-events: none;
}

.pds-modal .bf-item-title {
    padding: 9px 0 9px 12px;
    font-size: 14px;
}

.pds-modal .bf-item-buttons > span {
    padding: 9px;
}

.pds-modal .bs-modal-header-wrapper:after {
    display: none;
}

.pds-modal .bs-modal-body {
    background: #eee;
    line-height: 1.66;
}

.pds-modal .bs-modal-bottom {
    background: #fff;
    border-width: 0;
}

.pds-modal .bs-modal-title {
    font-size: 15px;
}

.pds-modal .pdsm-notice {
    width: 50%;
    font-weight: bold;
    margin-top: 10px;
    /* clear: both; */
}

.pds-modal .bs-modal-image-caption {
    font-size: 15px;
    margin-top: 10px;
}

.pds-confirm-modal .bs-modal-body {
    line-height: 1.66;
}

/**
* 2.24. =>Pre Defined Styles Modal
 **************************************************************/
.select-popup-field {
    background: #fff;
    border: 1px solid #dedede;
    max-width: 370px;
    position: relative;
}

.select-popup-selected-image {
    width: 145px;
    max-width: 100%;
    float: left;
    position: relative;
    line-height: 0;
}

.select-popup-selected-image:before {
    position: absolute;
    height: 100%;
    right: 0;
    top: 0;

    width: 1px;
    background: #dbdbdb;
    content: ' ';
}

.select-popup-selected-image img {
    max-width: 100%;
    max-height: 130px;
    image-rendering: pixelated;
}

.select-popup-selected-info {
    float: left;
}

.select-popup-selected-image,
.select-popup-selected-info {
    padding: 6px;
    box-sizing: border-box;
}

.select-popup-field .button {
    box-shadow: none;
    background: #2D9ECE;
    border-color: #0074a2;
    color: #fff;
    font-weight: 500;

    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.select-popup-field .button:hover {
    background: #288baf;
    border-color: #00435f;
    color: #fff;
}

.select-popup-field .button:focus {
    outline: none;
}

.select-popup-field .active-item-text {
    color: #9d9d9d;
    font-size: 13px;
    font-weight: 300;
    margin-bottom: 10px;
}

.select-popup-field .active-item-label {
    color: #383838;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 15px;
}

/**
* Selector Modal Sidebar
*/
.bssm-sidebar {
    width: 260px;
    border-left: 1px solid #cecece;
    position: absolute;
    right: 0;
    top: 0;
    padding: 25px 20px;
    height: 100%;
    background: #fff;
    color: #353535;
    overflow-y: scroll;
}

.bssm-sidebar .title {
    color: #353535;
    font-size: 14px;
    display: block;
    position: relative;
    margin: 0 0 13px;
}

.bssm-sidebar .title span {
    background: #fff;
    padding-right: 12px;
    position: relative;
    z-index: 12;
}

.bssm-sidebar .title:after {
    content: ' ';
    width: 100%;
    height: 1px;
    background: #ebebeb;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 9;
}

.bssm-search {
    position: relative;
    display: inline-block;
    width: 100%;
    margin-bottom: 20px;
}

.bssm-search .fa {
    position: absolute;
    right: 14px;
    top: 10px;

    content: '\f002';

    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #bdbdbd;
}

.active.bssm-search .fa {
    cursor: pointer;
}

.bssm-search-input {
    border: 1px solid #c9c9c9;
    -webkit-box-shadow: inset 0 0 2px 0 #000;
    -moz-box-shadow: inset 0 0 2px 0 #000;
    box-shadow: inset 0 0 2px 0 #000;
    padding: 0 30px 0 18px;
    line-height: 28px;
    position: relative;
    font-size: 13px;
    border-radius: 23px;
    color: #858585;
    outline: none;
    width: 100%;
}

.bssm-search-input:active, .bssm-search-input:focus {
    border-color: #4c954f !important;
    box-shadow: none !important;
    -webkit-box-shadow: 0 0 2px rgba(76, 149, 79, 0.8) !important;
    box-shadow: 0 0 2px rgba(76, 149, 79, 0.8) !important;
}

.bssm-filter .bssm-categories,
.bssm-filter .bssm-types {
    margin-bottom: 25px;
}

.bssm-filter-items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.bssm-filter-items .bf-checkbox-multi-state {
    display: inline-block;
}

.bs-selector-modal .bf-checkbox-multi-state[data-current-state="active"] .fa,
.bs-selector-modal .bf-checkbox-multi-state[data-current-state="active"] + .label {
    color: #353535;
    margin-left: 1px;
}

.bssm-filter li {
    position: relative;
    margin-bottom: 11px;
    line-height: 20px;
}

.bssm-filter li .name {
    vertical-align: middle;
    display: inline-block;
}

.bssm-filter .length {
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    font-size: 12px;
    color: #a9a9a9;
}

.bssm-button {
    background: #5ca65f;
    color: #fff;
    border: 1px solid #4c954f;
    -webkit-border-radius: 19px;
    -moz-border-radius: 19px;
    border-radius: 19px;
    display: inline-block;
    line-height: 34px;
    padding: 0 20px;
    cursor: pointer;
    text-decoration: none;
    font-size: 13px;
}

.bssm-button.disabled {
    background: #e4e4e4;
    border-color: #DEDEE1;
    pointer-events: none;
    color: #909090;
}

.bssm-button:hover {
    background: #4f9852;
}

.bssm-button:hover {
    color: #fff;
    border-color: #509052;
}

.bssm-button:active {
    outline: none;
}

.bssm-button .fa {
    vertical-align: top;
    line-height: 34px;
    margin-right: 5px;
}

.bssm-sidebar-footer {
    position: absolute;
    bottom: 26px;
    text-align: center;
    display: block;
    right: -10px;
    left: -10px;
}

/*
    Upload Font Modal Style
*/
.bs-font-upload-modal .bs-modal-body {
    background: #eee;
}

.bs-font-upload-modal .input {
    display: block;

    background: #fff;
    color: #828282;
    border: 1px solid #d3d3d3;

    -webkit-border-radius: 19px;
    -moz-border-radius: 19px;
    border-radius: 19px;

    line-height: 32px;
    padding: 0 15px;

    width: 100%;
    outline: none;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}

.bs-font-upload-modal .input:focus,
.bs-font-upload-modal .input:active {
    border-color: #4c954f !important;
    box-shadow: none !important;
}

.bs-font-upload-modal label {
    font-weight: bold;
    margin-bottom: 5px;
    display: block;
}

.bs-font-upload-modal .font-woff2,
.bs-font-upload-modal .font-woff,
.bs-font-upload-modal .font-ttf,
.bs-font-upload-modal .font-svg,
.bs-font-upload-modal .font-otf,
.bs-font-upload-modal .font-eot {
    margin-top: 16px;
    width: 50%;
    float: left;
}

.bs-font-upload-modal .input-section {
    position: relative;
}

.bs-font-upload-modal .input-section .bssm-button {
    position: absolute;
    top: 0;
    right: -10px;
    height: 100%;

    border-top-left-radius: 0;
    border-bottom-left-radius: 0;

    padding: 0 15px;
}

.bs-font-upload-modal .input-section.empty .bssm-button {
    background: #e4e4e4;
    border-color: #d5d5d5;
    color: #4a4a4a;
}

.bs-font-upload-modal .bf-choose-fonts {
    margin-bottom: 23px;
}

.bs-font-upload-modal .bf-choose-fonts .input {
    padding-right: 105px;
}

.bs-font-upload-modal .bs-modal-btn-primary {
    display: block;
    text-align: center;
    text-transform: uppercase;
    margin-right: 10px;
    margin-left: 10px;
}

.bs-font-upload-modal .bs-modal-body {
    padding: 20px 10px;
}

/**
 * 2.26. =>Color Picker
 **************************************************************/
.bs-color-picker-wrapper .iris-picker .iris-strip .ui-slider-handle {
    top: auto;
}

.bs-color-picker-wrapper .iris-picker .iris-slider-offset {
    margin: 0;
}

.vc_edit-form-tab .bs-color-picker-wrapper .wp-picker-open + .wp-picker-input-wrap {
    height: 52px;
}

.vc_edit_form_elements .bs-color-picker-wrapper input.wp-color-picker[type=text] {
    padding: 0 10px;
    width: 100% !important;
}

/**
 * 3. =>Admin Panel
 **************************************************************/

#bf-panel input[type=file] {
    background-color: #F5F5F5;
    padding: 5px;
    border: 1px solid #eee;
    max-width: 100%;
}

.bf-controls textarea,
#bf-panel textarea {
    width: 100%;
    min-height: 100px;
}

#bf-panel .button {
    padding: 0 10px 1px;
}

/*.bf-admin-panel.hide-notices div.updated,*/
.bf-admin-panel.hide-notices .update-nag {
    display: none;
}

.bf-admin-panel #bf-panel {
}

.bf-admin-panel .panel-wrapper {
    padding: 0;
    margin-left: -20px;
    position: relative;
}

.bf-page-header.sticky {
    position: fixed;
    top: 28px;
    left: 0;
    z-index: 999;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bf-page-header .reset-sec {
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.bf-page-header.sticky .reset-sec {
    margin-top: -47px;
}

.bf-page-header {
    background-color: #fff;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: height .3s ease, padding-top .3s ease, padding-bottom .3s ease;
}

.bf-page-header .bf-page-header-inner {
    padding: 45px 20px 25px 20px;
    position: relative;
}

.bf-page-header.sticky .bf-page-header-inner {
    padding: 20px 30px 20px 190px;
}

.bf-page-header.sticky .page-title {
    font-size: 30px;
}

.bf-page-header .bf-options-change-notice {
    background: #f10f0f;
    color: #fff;
    white-space: normal;
    padding: 0 5px;
    margin: 0;
    display: inline-block;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    position: absolute;
    bottom: 25px;
    left: 50%;
    height: 20px;
    width: 146px;
    transform: translateX(-50%);
    -webkit-backface-visibility: hidden;
    text-transform: uppercase;
    font-weight: 600;
}

.bf-page-header .bf-options-change-notice:before {
    content: '';
    width: 8px;
    height: 8px;
    background: #fff;
    border-radius: 50%;
    display: inline-block;
    margin-right: 4px;
}

.bf-page-header.sticky .bf-options-change-notice {
    transform: translateX(0%);
    background: transparent;
    color: #f10f0f;
    font-size: 10px;
    bottom: 3px;
}

.bf-page-header.sticky .bf-options-change-notice:before {
    background: #f10f0f;
}

.bf-page-header .page-title {
    margin: 0 0 15px;
    padding: 0;
    font-size: 46px;
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.1;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.bf-page-header .page-desc p {
    margin: 0;
    padding: 0;
    font-size: 21px;
    font-weight: 300;
    line-height: 1.3;
    color: #777;
}

.bf-page-header-wrapper {
    position: relative;
}

.bf-page-header .page-desc {
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.bf-page-header.sticky .page-desc {
    opacity: 0;
    visibility: hidden;
    display: none;
}

.sticky #bf-main {
    margin-top: 210px;
}

/**
 * 3.1. =>Section
 **************************************************************/
.bf-section-container.bf-admin-panel .bf-section .bf-heading {
    width: 50%;
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 20px 0 0;
}

.bf-section-container.bf-admin-panel .bf-section .bf-heading h3 {
    margin: 0 0 8px !important;
    border-bottom: none;
    font-weight: 600 !important;
    padding: 0px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    cursor: default;
    position: relative;
    color: #222222;
}

.bf-section-container.bf-admin-panel .bf-section .bf-heading h3 label {
    cursor: default;
}

.bf-section-container.bf-admin-panel .bf-section .bf-controls {
    width: 50%;
    float: right;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
}

.bf-section-container .bf-section.full-width-controls .bf-explain,
.bf-section-container .bf-section.full-width-controls .bf-heading,
.bf-section-container .bf-section.full-width-controls .bf-controls {
    width: 100% !important;
}

.bf-section-container.bf-admin-panel .bf-section.width-70 .bf-controls {
    width: 70%;
}

.bf-section-container.bf-admin-panel .bf-section.width-70 .bf-heading,
.bf-section-container.bf-admin-panel .bf-section.width-70 .bf-explain {
    width: 30%;
}

.bf-section-container.bf-admin-panel .bf-section.width-60 .bf-controls {
    width: 60%;
}

.bf-section-container.bf-admin-panel .bf-section.width-60 .bf-heading,
.bf-section-container.bf-admin-panel .bf-section.width-60 .bf-explain {
    width: 40%;
}

.bf-section-container.bf-admin-panel .bf-section .bf-explain {
    color: #939393;
    font-size: 13px;
    width: 50%;
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 15px 0 0;
    clear: left;
}

/**
 * 3.2. =>Panel
 **************************************************************/
#bf-panel {
    font-size: 15px;
    position: relative;
}

#bf-panel .fright {
    float: right;
}

#bf-panel .fleft {
    float: left;
}

#bf-panel .group {
    display: none;
}

/**
 * 3.3. =>Panel Header
 **************************************************************/
.bf-header {
    min-height: 70px;
    width: 1060px;
    z-index: 999;
    background-color: #F5F5F5;
    color: #fff;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    border-bottom: 1px solid #C0C0C0;
}

.bf-header .logo-sec {
    float: left;
    position: relative;
    color: #222222;
    padding-top: 26px;
    padding-left: 18px;
}

.bf-header .save-btn-sec {
    padding: 20px;
    float: right;
}

.bf-header .logo-sec {
    display: table;
}

.bf-header .logo {
    padding: 0;
    font-size: 16px;
    margin: 0;
}

.bf-header .logo .version {
    font-size: 7px;
    margin-left: 5px;
    font-weight: normal;
}

.bf-header-wrapper {
    position: relative;
    min-height: 70px;
}

.bf-header.sticky {
    position: fixed;
    top: 28px;
}

/**
 * 3.4. =>Panel Main
 **************************************************************/
#bf-main {
    background: #FFFFFF;
    border: 1px solid #E2E2E2;
    max-width: 1060px;
    margin: 15px auto;
    padding: 20px;
    border-radius: 3px;
}

#bf-panel.panel-without-tab #bf-main {
    max-width: 900px;
}

/**
 * 3.5. =>Panel Nav
 **************************************************************/
#bf-nav {
    width: 25%;
    float: left;
}

#bf-nav > ul {
    margin-top: 0;
    padding-bottom: 20px;
}

#bf-nav.sticky {
    position: fixed;
    top: 102px;
}

#bf-nav > ul > li {
    margin: 0;
}

#bf-nav > ul > li.margin-top-10 {
    margin-top: 10px;
    border-top: 1px solid #E8E8E8;
}

#bf-nav > ul > li.margin-top-20 {
    margin-top: 20px;
    border-top: 1px solid #E8E8E8;
}

#bf-nav > ul > li.margin-top-30 {
    border-top: 1px solid #E8E8E8;
    margin-top: 30px;
}

#bf-nav > ul > li.margin-top-40 {
    margin-top: 40px;
    border-top: 1px solid #E8E8E8;
}

#bf-nav > ul > li.margin-top-50 {
    margin-top: 50px;
    border-top: 1px solid #E8E8E8;
}

#bf-nav > ul > li a {
    position: relative;
    display: block;
    padding: 14px 0 14px 16px;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: #444;
    text-decoration: none;
    outline: none;
    background-color: #F9F9F9;
    border-bottom: 1px solid #E8E8E8;
    -webkit-transition: all .3s ease;
    border-left: 1px solid #E8E8E8;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    box-shadow: none;
}

#bf-nav > ul > li a:hover {
    background-color: #FDFCFC;

}

#bf-nav > ul > li:first-child a {
    border-top: 1px solid #E8E8E8;
}

#bf-nav > ul > li a .bf-icon {
    margin: 0 7px 0 0;
    font-size: 18px;
    vertical-align: middle;
    line-height: 18px;
    display: inline-block;
}

#bf-nav > ul > li a .bf-icon.dashicon {
    margin-top: 0;
    height: auto;
    vertical-align: middle;
    float: none;
}

#bf-nav > ul > li a.active_tab {
    background-color: #fff;
    position: relative;
}

#bf-nav > ul > li.child_active > a:after,
#bf-nav > ul > li a.active_tab:after {
    content: " ";
    right: -1px;
    height: 100%;
    width: 1px;
    position: absolute;
    pointer-events: none;
    top: 0;
    background-color: #fff;
}

#bf-nav > ul > li.child_active > a {
    position: relative;
    background-color: #0074a2;
    color: white;
}

#bf-nav > ul > li > ul.sub-nav > li {
    margin: 0;
}

#bf-nav > ul > li > ul.sub-nav > li a {
    font-size: 13px;
    line-height: 1.2;
    padding: 8px 12px;

}

#bf-nav > ul > li > ul.sub-nav a {
    background-color: #2E2E2E;
}

#bf-nav > ul > li.child_active > ul.sub-nav a.active_tab {
    color: white;
    font-weight: 600;

}

#bf-nav > ul > li.child_active > ul.sub-nav a.active_tab:after {
    display: none;
}

.bf-tab-badge {
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -8px;
    color: #fff;
    background-color: #2D9EC7;
    border-color: #2D9EC7;
    font-size: 9px;
    line-height: 16px;
    height: 16px;
    padding: 0 4px;
}

.bf-tab-badge:after {
    left: -10px;
    border: solid 5px rgba(0, 0, 0, 0);
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-right-color: inherit;
    top: 50%;
    margin-top: -5px;
}

/**
 * 3.6. =>Panel Content
 **************************************************************/
#bf-content {
    padding: 15px;
    width: 75%;
    float: right;
    min-height: 760px;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #E8E8E8;
}

#bf-panel.panel-without-tab #bf-content {
    border: none;
    padding: 20px 0;
    width: 100%;
    float: none;
}

/**
 * 3.7. =>Panel Footer
 **************************************************************/
#bf-panel .bf-footer {
    min-height: 60px;
    background-color: #F5F5F5;
    color: #444;
    border-top: 1px solid #D3D3D3;
}

#bf-panel .bf-footer .reset-sec {
    text-align: center;
    height: 60px;
    width: 220px;
    float: left;
    text-align: center;
}

#bf-panel .bf-footer .btn-sec {
    padding: 15px;
}

/**
 * 3.8. =>Typography
 **************************************************************/

/**
 * 3.9 =>Panel Loading
 **************************************************************/


/**
 * 3.9 =>Panel Loading
 **************************************************************/
.bf-section-container.bf-admin-panel .bf-section-info {
    margin-top: 15px;
    margin-bottom: 15px;
}

/**
 * 3.10 =>Image Select
 **************************************************************/

/**
 * 4. =>Widgets
 **************************************************************/
.bf-section-container.bf-widgets {
    padding: 0;
}

.bf-section-container.bf-widgets + .fields-group {
    margin-top: 10px;
}

.bf-section-container.bf-widgets .widefat input {
    width: 100%;
}

.bf-section-container.bf-widgets .bf-section-checkbox-option.bf-section .bf-heading {
    border-bottom: none;
    margin-bottom: 0;
}

/**
 * 4.1. =>General style
 **************************************************************/
.bf-section-container.bf-widgets .widefat input {
    width: 100%;
}

.bf-section-container.bf-widgets .widefat input[type=radio],
.bf-section-container.bf-widgets .widefat input[type=checkbox] {
    width: auto;
}

/**
 * 4.2. =>Section
 **************************************************************/
.bf-section-container.bf-widgets .bf-section {
    margin: 0;
    padding-top: 10px;
    padding-bottom: 0;
    border-bottom: none;
}

.bf-section-container.bf-widgets .bf-section .bf-heading {
    margin: 0 0 5px;
    padding-bottom: 5px;
}

.bf-section-container.bf-widgets .bf-section .bf-heading h4 {
    margin: 0;
}

.bf-section-container.bf-widgets .bf-section .bf-control {
    margin-bottom: 10px;
}

.bf-section-container.bf-widgets .bf-section .bf-desc {
    font-size: 12px;
    color: #b4b4b4;
    font-style: italic;
}

.bf-section-container.bf-widgets .bf-section-info {
    margin-bottom: 10px;
}

/**
 * 4.3. =>Ajax Select
 **************************************************************/
.bf-section-container.bf-widgets .bf-ajax-suggest-input {
    width: 100%;
}

.bf-section-container.bf-widgets .bf-ajax-suggest-search-results {
    width: 99.2%;
    top: 14px;
}

.bf-section-container.bf-widgets .bf-ajax_select-field-container span.preloader {
    left: initial;
    top: 7px;
    right: 5px;
}

/**
 * 4.4. =>Heading
 **************************************************************/
.bf-section-container.bf-widgets .bf-section.bf-section-heading-option .bf-heading-heading-option {
    padding: 0;
    margin: 0;
}

.bf-section-container.bf-widgets .bf-section.bf-section-heading-option .bf-heading-heading-option h4 {
    padding: 13px 15px;
    border: 1px solid #cccccc;
    background: #e0e0e0;
    font-size: 12px;
}

/**
 * 5. =>Taxonomies
 **************************************************************/
.bf-tax-meta-wrap {
    position: relative;
    min-width: 255px;
    max-width: 1200px;
    border: 1px solid #e5e5e5;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
    background: #fff;
    margin: 20px 0;
}

.bf-tax-meta-wrap .bf-tax-metabox-title h3 {
    font-size: 14px;
    padding: 12px;
    margin: 0;
    line-height: 1.4;
    border-bottom: 1px solid #eee;
    background-color: #fff;
}

/**
 * 6. =>Visual Composer
 **************************************************************/
.bf-section-container.vc-input {
    padding: 8px 0 0 0;
}

.bf-css-edit-switch-container + .wpb_el_type_css_editor:before {
    background: #f1f1f1;
    content: '';
    height: 1px;
    width: 100%;
    display: inline-block;
    margin-bottom: 10px;
}

.bf-css-edit-switch-container {
    float: left !important;
    width: 30% !important;
}

.bf-css-edit-switch-container + .bf-css-edit-switch-container {
    padding-top: 0 !important;
}

.vc_shortcode-param .bf-section-container {
    padding-right: 0;
    padding-left: 0;
}

.vc_shortcode-param.vc_wrapper-param-type-bf_info {
    margin-bottom: 10px;
}

.vc_edit_form_elements .vc_shortcode-param:last-child {
    margin-bottom: 25px;
}

/**
 * 6.1. =>Color Picker
 **************************************************************/
.wpb_edit_form_elements .bf-section-container .bf-controls-color-option {
    position: relative;
}

.wpb_edit_form_elements .bf-section-container .bf-color-picker {
    width: 100px;
    padding: 4px 6px;
}

.wpb_edit_form_elements .bf-section-container .bf-color-picker-preview {
    width: 21px;
    height: 21px;
    display: inline-block;
    position: relative;
    left: -26px;
    top: 5px;
}

/**
 * 6.2. =>Image Radio
 **************************************************************/
.bf-section-container.style-floated-left .vc-bf-image-radio-option {
    float: left;
    margin-right: 10px;
    min-height: 96px;
}

.bf-section-container .vc-bf-image-radio-option .item-label {
    margin: 5px 0;
    text-align: center;
}

.bf-section-container .vc-bf-image-radio-option.checked .item-label {
    font-weight: bold;
}

.bf-section-container .vc-bf-image-radio-option img {
    border: 1px solid #e2e2e2;
}

.bf-section-container .vc-bf-image-radio-option.checked img {
    border: 1px solid #0074a2;
}

/**
 * 6.3. =>Ajax Select
 **************************************************************/
.vc_row-fluid .bf-ajax-suggest-search-results {
    position: relative !important;
    top: initial;
    left: initial;
}

.vc_row-fluid .bf-ajax-suggest-controls {
    margin: 5px 0;
}

.vc_row-fluid .bf-ajax_select-field-container span.preloader {
    left: inherit;
    right: 10px;
    top: 10px;
}

/**
 * 6.5. =>Heading
 **************************************************************/
.vc_wrapper-param-type-bf_heading.vc_shortcode-param .wpb_element_label {
    display: none;
}

.vc_wrapper-param-type-bf_heading .bf-section-container {
    padding: 0;
}

.vc_wrapper-param-type-bf_heading .bf-section-heading .bf-section-heading-title {
    height: 44px !important;
    line-height: 44px !important;
    background: #2B4B80 !important;
    color: #fff !important;
    border: 1px solid #2b4b80 !important;
}

.vc_wrapper-param-type-bf_heading .bf-section-heading .bf-section-heading-title h4 {
    margin: 0;
    padding: 0;
    font-size: 14px;
}

.vc_wrapper-param-type-bf_heading .bf-section-heading {
    margin: 0;
}

.vc_wrapper-param-type-bf_heading {
    margin-top: 15px;
}

.vc_wrapper-param-type-bf_heading:first-child {
    margin-top: 0;
}

/**
 * 6.6. =>Editor ShortCode
 **************************************************************/

.wpb_content_element.bf-vc-field .vc_admin_label label {
    font-weight: bold;
    color: #8B8B8B;
}

/**
 * 6.7. =>VC Media Image
 **************************************************************/
.bf-section-container.vc-input .bf-media-image-remove-btn {
    margin-left: 10px;
}

.bf-section-container.vc-input .bf-media-image-preview {
    margin-top: 15px;
}

/**
 * 6.8. =>VC Info
 **************************************************************/
.wpb_el_type_bf_info.vc_shortcode-param .wpb_element_label {
    display: none;
}

.wpb_el_type_bf_info.vc_shortcode-param .bf-controls-vc-info-option {
    padding: 10px;
}

/**
 * 6.9. =>Switch
 **************************************************************/
.bf-section-container.vc-input .bf-switch input[type=checkbox] {
    display: none;
}

/**
 * 6.10. =>Select
 **************************************************************/
.bf-select-option-container select.bf_select_field {
    padding: 3px 13px;
    height: 34px;
    margin: 0;
}

.bf-section-container .bf-section .bf-controls .bf-select-option-container.multiple select,
.bf-select-option-container.multiple select {
    height: 170px;
    overflow: scroll;
    padding: 15px;
}

.bf-section-container .bf-section .bf-controls .bf-select-option-container.multiple:before,
.bf-select-option-container.multiple:before {
    display: none !important;
}

/**
 * 6.11. =>Column
 **************************************************************/
.bf-vc-third-column {
    float: left !important;
    width: 33% !important;
    margin-bottom: 25px;
}

.bf-vc-third-column select.bf_select_field {
    font-size: 13px;
}

/**
 * 7. =>Menus
 **************************************************************/
.menu-item-settings {
    z-index: initial; /* Hack for z-index problem on child and BF select boxes */
}

.bf-section-container.bf-menus {
    padding: 0 !important;
}

.bf-menu-custom-field {
    margin: 0;
    font-size: 13px;
    font-style: italic;
    height: auto;
    min-height: 80px;
}

.bf-menu-custom-field .better-custom-field-label {
    line-height: 35px;
    min-height: 35px;
    display: inline-block;
}

.better-menu-container {
    float: left;
    margin: 15px 0 0;
}

.better-menu-container .better-menu-box-title {
    margin-bottom: 10px;
}

.better-menu-container .better-menu-fields {
    display: none;
}

.bf-section-container.bf-menus .bf-field-with-prefix span,
.bf-section-container.bf-menus .bf-field-with-suffix span {
    margin-top: -3px;
    margin-left: -2px;
}

/**
 * 7.1. =>Mega Menu Field
 **************************************************************/
.menu-item.menu-item-depth-0 .fields-group#fields-group-mega_menu_heading .bf-field-mega_menu_cat,
.menu-item.menu-item-depth-0 .fields-group#fields-group-mega_menu_heading .bf-field-mega_menu {
    display: block;
}

.menu-item .fields-group#fields-group-mega_menu_heading .bf-field-drop_menu_anim {
    width: 360px;
}

.menu-item.menu-item-depth-0 .fields-group#fields-group-mega_menu_heading .bf-field-drop_menu_anim {
    width: 170px;
}

.menu-item.menu-item-depth-0 .fields-group#fields-group-mega_menu_heading .bf-field-mega_menu_cat {
    width: 180px;
    margin-right: 0;
}

/**
 * 7.2. =>Menu Badge Field
 **************************************************************/
.menu-item.menu-item-depth-0 .bf-field-badge_label.description-thin {
    width: 360px !important;
}

.menu-item.menu-item-depth-0 .bf-field-badge_position {
    display: none;
}

.menu-item .bf-field-badge_position {
    margin-top: 1px;
}

/**
 * 7.3. =>WPNav Menu
 **************************************************************/
.menu-item .bf-section-info {
    background-color: #FFFDF4;
    border: 1px solid #F1E0BD;
    color: #8a6d3b;
    margin-top: 10px;
}

.menu-item .bf-section-info-title {
    background-color: #fcf8e3;
    border-color: #F1E0BD;
    color: #896D3B;
}

.menu-item .bf-section-info-title h3 {
    padding: 0 !important;
    margin: 0 !important;
    font-size: 12px !important;

    background-color: #fcf8e3;
    border-bottom: 1px solid #F1E0BD;
    color: #896D3B;
    padding: 10px 15px !important;
}

.menu-item .bf-section-info-title .fa {
    margin-right: 3px;
}

.menu-item .bf-section-info-message {
    padding: 15px;
}

/**
 * 7.4. =>Heading
 **************************************************************/
.bf-section-container.bf-menus .bf-section-heading .bf-section-heading-title {
    padding: 0;
}

.bf-section-container.bf-menus .bf-section-heading .bf-section-heading-title h3 {
    margin: 0 -15px -2px -15px !important;
    font-size: 15px;
}

.bf-section-container.bf-menus .bf-section-heading {
    margin: 10px 0;
}

.bf-group-inner .bf-section-container.bf-menus .bf-section-heading.style-2 {
    margin: 0;
    padding: 0;
}

/**
 * 7.5. =>Color Picker
 **************************************************************/
.bf-section-container.bf-menus input.bf-color-picker {
    width: 100px;
    padding: 4px 6px;
}

/**
 * 7.6 =>Checkbox
 **************************************************************/
.better-custom-field-checkbox .bf-section-container.bf-menus {
    padding-top: 27px;
}

/**
 * 7.6. =>IconSelect
 **************************************************************/
.bf-section-container.bf-menus .bf-select-icon .select-options .better-select-icon-options {
    width: 390px;
}

/**
 * 7.8. =>Group
 **************************************************************/
.menu-item .fields-group {
    border: 1px solid #dddddd;
    margin-top: 10px;
    margin-bottom: 0;
    width: 390px;
    float: left;
}

.menu-item .fields-group .fields-group-title-container {
    height: 34px;
    line-height: 34px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #dddddd;
}

.menu-item .fields-group .bf-group-inner {
    padding: 15px;
}

.menu-item .fields-group .bf-group-inner .description-wide {
    width: 360px;
}

.menu-item .fields-group .bf-group-inner .description-thin {
    width: 170px;
}

.menu-item .fields-group .fields-group-title-container .fields-group-title {
    font-size: 12px;
    padding: 0 62px 0 16px;
    font-weight: 600;
}

.menu-item .fields-group.collapsible .fields-group-title-container .collapse-button {
    width: 40px;
    line-height: 34px;
    border: 1px solid #dddddd;
}

.menu-item .fields-group .bf-group-inner .bf-group-desc {
    padding: 7px 0;
}

.menu-item .bf-background-image-preview {
    margin-top: 15px;
}

.bf-section-container.bf-menus .bf-field-with-prefix input[type=text],
.bf-section-container.bf-menus .bf-field-with-suffix input[type=text] {
    width: 65%;
}

/**
 * 7.9. =>Color
 **************************************************************/
.bf-section-container.bf-menus input[type=text] {
    width: 100%;
    height: 34px;
}

.bf-section-container.bf-menus .bf-color-picker-container {
    width: 100%;
}

.bf-section-container.bf-menus .bf-color-picker {
    width: 100%;
}

.bf-section-container.bf-menus .bf-color-picker-preview {
    top: 6px;
}

/**
 * 7.10. =>Background Image
 **************************************************************/

.bf-menu-custom-field.better-custom-field-background_image .bf-button {
    margin-bottom: 12px;
}

/**
 * 8. =>Meta Box
 **************************************************************/

/**
 * 8.1. =>Section
 **************************************************************/

.bf-section-container.bf-metabox .bf-section .bf-heading {
    width: 34%;
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 20px 0 0;
}

.bf-section-container.bf-metabox .bf-section .bf-heading h3 {
    margin: 0 0 8px !important;
    border-bottom: none;
    font-weight: 600 !important;
    padding: 0px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    cursor: default;
    position: relative;
    color: #222222;
    -webkit-user-select: initial;
    -moz-user-select: initial;
    -ms-user-select: initial;
    user-select: initial;
}

.bf-section-container.bf-metabox .bf-section .bf-heading label {
    cursor: default;
}

.bf-section-container.bf-metabox .bf-section .bf-heading h3:before {

}

.bf-section-container.bf-metabox .bf-section.no-desc .bf-controls,
.bf-section-container.bf-metabox .bf-section .bf-controls {
    width: 66%;
    float: right;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
}

.bf-section-container.bf-metabox .bf-section .bf-explain {
    color: #939393;
    font-size: 13px;
    width: 34%;
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 15px 0 0;
    clear: left;
}

.bf-section-tree-select select,
.bf-select-option-container select,
.bf-section-container .bf-section .bf-controls textarea,
.bf-section-container .bf-section .bf-controls input[type=text],
.bf-section-container.bf-menus .bf-select-option-container select,
.bf-section-container .bf-section .bf-controls select,
.bf-section-container .bf-section .bf-controls .select-placeholder {
    margin: 0;
    box-shadow: none;
    width: 100%;
    margin: 0;
    border: 1px solid #d6d6d6;
    color: #333333;
    padding: 3px 13px;
    pearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    border: 1px solid #d9d9d9;
    box-sizing: border-box;
    -webkit-box-sizing: none;
    -moz-box-sizing: none;
    -o-box-sizing: none;
    display: block;
    font-size: 13px;
    outline: none;
    overflow: ellipsis;
    position: relative;
    text-indent: 0.01px;
    text-overflow: '';
    -webkit-text-overflow: none;
    -moz-text-overflow: none;
    -o-text-overflow: none;
    vertical-align: middle;
    z-index: 1;
    height: 34px;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    border-radius: 0;
}

.bf-section-container .bf-section .bf-controls input[type=text],
.bf-section-container .bf-select-option-container,
.bf-section-container .bf-ajax_select-field-container {
    max-width: 370px;
}

.bf-section-container .bf-controls-term_select-option {
    max-width: 370px;
    float: left !important;
}

.bf-section-tree-select:hover select,
.bf-select-option-container:hover select,
.bf-section-container .bf-section .bf-controls textarea:hover,
.bf-section-container .bf-section .bf-controls input[type=text]:hover,
.bf-section-container .bf-section .bf-controls select:hover,
.bf-section-container .bf-section .bf-controls .select-placeholder:hover {
    border-color: #C2C2C2;
}

.bf-section-container .bf-section .bf-controls select,
.bf-section-container .bf-section .bf-controls .select-placeholder {
    cursor: pointer;
}

.bf-section-container .bf-section .bf-controls .select-placeholder {
    line-height: 27px;
    vertical-align: top;
}

.bf-section-container .bf-section .bf-controls textarea {
    padding: 5px;
}

.bf-section-container .bf-section .bf-controls textarea:focus,
.bf-section-container .bf-section .bf-controls.bf-controls-text-option input[type=text]:focus {
    border-color: #C2C2C2;
    box-shadow: none;
}

.bf-section-tree-select .components-base-control__field,
.bf-section-container .bf-controls-background_image-option .bf-background-image-uploader-select-container,
.bf-section-container .bf-select-option-container {
    position: relative;
}

.bf-section-container .bf-controls-background_image-option .bf-background-image-uploader-select-container:before,
.bf-section-tree-select .components-base-control__field:before,
.bf-section-container .bf-select-option-container:before {
    position: absolute;
    right: 0;
    top: 0;
    width: 34px;
    height: 34px;
    line-height: 34px;
    border: 1px solid #d6d6d6;
    display: inline-block;
    content: '\f107';
    background-color: #fff;
    font-family: 'FontAwesome';
    text-align: center;
    font-size: 14px;
    color: #7C7C7C;
    z-index: 2;
    pointer-events: none;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    box-sizing: border-box;
}

.bf-section-container .bf-controls-background_image-option .bf-background-image-uploader-select-container:hover:before,
.bf-section-container .bf-select-option-container:hover:before {
    border-color: #C2C2C2;
}

.bf-section-container.dir-ltr .bf-section .bf-controls.bf-controls-text-option input[type=text] {
    text-align: left;
    direction: ltr;
}

.bf-section-container.dir-rtl .bf-section .bf-controls.bf-controls-text-option input[type=text] {
    text-align: right;
    direction: rtl;
}

.bf-section-container.dir-ltr .bf-section .bf-controls textarea,
.bf-section-container.dir-ltr .bf-section .bf-controls select,
.bf-section-container.dir-ltr .bf-section .bf-controls .select-placeholder {
    text-align: left;
    direction: ltr;
}

.bf-section-container.dir-rtl .bf-section .bf-controls textarea,
.bf-section-container.dir-rtl .bf-section .bf-controls select,
.bf-section-container.dir-rtl .bf-section .bf-controls .select-placeholder {
    text-align: right;
    direction: rtl;
}

.bf-section-container .bf-section .bf-controls textarea.bf-invalid-value,
.bf-section-container .bf-section .bf-controls input[type=text].bf-invalid-value {
    box-shadow: inset 0 0 3px rgba(255, 0, 0, 0.37);
    border: 1px solid #ffa4a4;
}

/**
 * 8.2. =>Tabs
 **************************************************************/

.postbox-container .postbox .inside.tabbed-metabox {
    margin: 0 !important;
    padding: 0 !important;
}

.bf-metabox-wrap.tabbed-metabox {
    background: #f5f5f5;
}

.bf-metabox-tabs {
    margin: 0;
    padding: 0;
    width: 20%;
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.bf-metabox-tabs li,
.bf-metabox-tabs ul {
    margin: 0;
    padding: 0;
}

.bf-metabox-tabs li {
    background: #f5f5f5;
}

.bf-metabox-tabs > ul > li.margin-top-10 {
    margin-top: 10px;
    border-top: 1px solid #E8E8E8;
}

.bf-metabox-tabs > ul > li.margin-top-20 {
    margin-top: 20px;
    border-top: 1px solid #E8E8E8;
}

.bf-metabox-tabs > ul > li.margin-top-30 {
    border-top: 1px solid #E8E8E8;
    margin-top: 30px;
}

.bf-metabox-tabs > ul > li.margin-top-40 {
    margin-top: 40px;
    border-top: 1px solid #E8E8E8;
}

.bf-metabox-tabs > ul > li.margin-top-50 {
    margin-top: 50px;
    border-top: 1px solid #E8E8E8;
}

.bf-metabox-tabs .bf-tab-item-a {
    cursor: pointer;
    display: block;
    font-size: 13px;
    color: #303030;
    text-decoration: none;
    font-weight: bold;
    padding: 13px;
    border-bottom: 1px solid #e2dddb;
    outline: none;
    position: relative;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    box-shadow: none;
}

.bf-metabox-tabs .bf-tab-item-a .tab-icon {
    margin-right: 6px;
    font-size: 17px;
}

.bf-metabox-tabs .bf-tab-item-a.active_tab:hover,
.bf-metabox-tabs .bf-tab-item-a.active_tab {
    background-color: #fff;
}

.bf-metabox-tabs .bf-tab-item-a:hover {
    background-color: #FDFCFC;
}

.bf-metabox-tabs .bf-tab-item-a.active_tab:after {
    content: '';
    height: 100%;
    width: 1px;
    background: #fff;
    display: inline-block;
    position: absolute;
    right: -1px;
    top: 0;
}

.bf-metabox-container.bf-with-tabs {
    width: 80%;
    float: right;
    background-color: #fff;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 15px 15px;
    border-left: 1px solid #e2dddb;
}

.bf-metabox-container.bf-with-tabs .group {
    display: none;
    min-height: inherit;
}

/**
 * 8.3. =>Heading
 **************************************************************/

/**
 * 9. =>Font Manager
 **************************************************************/
.bf-section-container.better-font-stack-name {
    width: 46%;
    float: left;
    padding-left: 2%;
    padding-right: 2%;
}

.bf-section-container.better-font-stack-stack {
    width: 46%;
    float: right;
    padding-right: 2%;
    padding-left: 2%;
}

/**
 * 9.1. =>Fields
 **************************************************************/
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-otf .bf-controls,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-eot .bf-controls,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-svg .bf-controls,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-ttf .bf-controls,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff2 .bf-controls,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff .bf-controls {
    position: relative;
}

.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-otf .bf-controls input[type=text],
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-eot .bf-controls input[type=text],
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-svg .bf-controls input[type=text],
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-ttf .bf-controls input[type=text],
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff .bf-controls input[type=text] {
    width: 100%;
}

.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-otf .bf-controls .bf-media-upload-btn,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-eot .bf-controls .bf-media-upload-btn,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-svg .bf-controls .bf-media-upload-btn,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-ttf .bf-controls .bf-media-upload-btn,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff2 .bf-controls .bf-media-upload-btn,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff .bf-controls .bf-media-upload-btn {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}

.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-ttf,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-eot {
    width: 40%;
    float: left;
}

.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-otf,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-svg,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff2 {
    width: 40%;
    float: right;
}

.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-otf .bf-section,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff2 .bf-section,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-woff .bf-section,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-ttf .bf-section,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-svg .bf-section,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-eot .bf-section {
    padding-top: 0;
}


/**
 * 10. =>User Metabox
 **************************************************************/
.bf-user-meta-wrap {
    position: relative;
    min-width: 255px;
    max-width: 1200px;
    border: 1px solid #e5e5e5;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
    background: #fff;
    margin: 20px 0;
}

.bf-user-meta-wrap .bf-user-metabox-title h3 {
    font-size: 14px;
    padding: 10px 12px;
    margin: 0 !important;
    line-height: 1.4;
    border-bottom: 1px solid #eee;
    background-color: #fff;
}

/**
 * 11. =>Admin Menus
 **************************************************************/

/**
 * 12. =>Notice System
 **************************************************************/

/***
    Notice Styles
**/
.bf-notice {
    background: #fff;
    -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
    margin: 5px 0 2px;
    padding: 1px 12px;
    position: relative;
    z-index: 10;
    overflow: hidden;
    font-size: 14px;
    line-height: 1.62;
    display: block;
}

.bf-notice *,
.bf-notice {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.bf-notice-wrapper {
    position: relative;
    overflow: hidden;
    margin-top: 10px;
    clear: both;
    max-height: 200px;
    transition: max-height .3s ease;
}

.bf-notice-container {
    display: table-row;
}

.bf-notice-text-container {
    display: table-cell;
    background: #fff;
    vertical-align: top;
    width: 100%;
    padding-left: 12px;
}

.bf-notice-text {
    max-height: 150px;
    overflow: hidden;
    padding-bottom: 10px;
}

.bf-notice-text:last-child {
    margin-bottom: 0;
}

.bf-notice p {
    margin: 0.5em 0;
    padding: 2px;
}

.bf-notice p:last-child {
    margin-bottom: 0;
}

.bf-notice.bf-notice-has-thumbnail {
    padding: 0;
}

.bf-notice.bf-notice-dismissible {
    padding-right: 40px;
}

.bf-notice .bf-notice-thumbnail {
    vertical-align: middle;
    padding: 0 7px;
    display: table-cell;
    min-height: 36px;
    height: 100%;
}

.bf-notice .bf-notice-thumbnail img {
    vertical-align: middle;
}

.bf-notice-success .bf-notice-thumbnail {
    background: #46b450;
}

.bf-notice-success .title {
    color: #268b30;
}

.bf-notice-no-thumbnail.bf-notice-success {
    border-left: 4px solid #46b450;
}

.bf-notice-warning .bf-notice-thumbnail {
    background: #e2a400;
}

.bf-notice-warning .title {
    color: #e2a400;
}

.bf-notice-no-thumbnail.bf-notice-warning {
    border-left: 4px solid #e2a400;
}

.bf-notice-danger .bf-notice-thumbnail {
    background: #dc3232;
}

.bf-notice-danger .title {
    color: #c82322;
}

.bf-notice-no-thumbnail.bf-notice-danger {
    border-left: 4px solid #dc3232;
}

.bf-notice-dismiss {
    position: absolute;
    top: 0;
    right: 1px;
    border: none;
    margin: 0;
    padding: 9px;
    background: none;
    color: #b4b9be;
    cursor: pointer;
    outline: none !important;
}

.bf-notice-dismiss:before {
    background: none;
    color: #b4b9be;
    content: "\f153";
    display: block;
    font: normal 16px/20px dashicons;
    height: 20px;
    text-align: center;
    width: 20px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.bf-notice-wrapper + .panel-wrapper,
.bf-admin-page.bf-admin-page-template-minimal-1 .bf-notice-wrapper + .bf-admin-page-wrap {
    margin-top: 15px;
}

.bf-notice .detail {
    font-size: 13px;
    line-height: 1.4;
    color: #3f3f3f;
}

.bf-notice-text-container.bf-close .detail {
    opacity: 0.85;
}

.bf-notice .detail li {
    list-style: disc outside none;
    margin-left: 22px;
}

.bf-notice-text-container {
    position: relative;
}

.bf-notice-message-collapse {
    background: #fff;
    position: absolute;
    width: 100%;
    bottom: 0;

    padding: 10px 2px;
}

/**************************************************************
 * 13. =>Last Not Refactored Codes
 **************************************************************/

/***** Fields ******/

/*-------------------------------------------------------------------------------------------*/
/* bf Meta Box styles */
/*-------------------------------------------------------------------------------------------*/

.ui-slider {
    height: 5px;
    background-color: #DBDBDB;
    position: relative;
}

.ui-slider .ui-slider-range {
    height: 5px;
    background-color: #1E92C0;
    position: relative;
}

.ui-slider .ui-slider-range:after {
    content: '';
    width: 14px;
    height: 14px;
    display: inline-block;
    position: absolute;
    right: -7px;
    top: 50%;
    background-color: #0074A2;
    border-radius: 50%;
    margin-top: -7px;
}

/**************************************************************
 * 14. =>TinyMCE Add-On
 **************************************************************/

#es-modal .bs-modal-header-wrapper:after {
    display: none;
}

#es-modal .bs-modal-body {
    padding: 0;
}

#es-modal .tinymce-addon-fields .group {
    padding: 0 20px 20px;
}

#es-modal .bs-modal-header-wrapper {
    background: #00a0d2;
    color: #fcfdff;
}

#es-modal .bs-modal-header-wrapper .bs-modal-header {
    color: #ecf0f9;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    font-weight: normal;
}

#es-modal .tabs-wrapper {
    background: #00a0d2;
    padding: 0 20px;
}

#es-modal .tabs-wrapper ul {
    margin: 0;
}

#es-modal .tabs-wrapper li {
    display: inline-block;
    margin: 0 10px 0 0;
    padding: 10px;
}

#es-modal .tabs-wrapper li:last-child {
    margin-right: 0;
}

#es-modal .tabs-wrapper a {
    color: #fcfdff;
    text-decoration: none;
}

#es-modal .tabs-wrapper .active-tab {
    background: #fff;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
}

#es-modal .tabs-wrapper .active-tab a {
    color: #222;
}

#es-modal .tabs-wrapper .active-tab a:focus,
#es-modal .tabs-wrapper .active-tab a:active {
    outline: none !important;
    box-shadow: none;
}

#es-modal .bs-close-modal {
    border-color: #F9D9DB;
    background-color: transparent;
    color: #f7e2e3;
}

/**************************************************************
 * 15. =>KingComposer
 **************************************************************/
/*Make it show_on option friendly*/
.m-p-body .kc-param-row {
    min-height: 0 !important;
}

.m-p-body .kc-param-row.kc-param-row select {
    width: 100%;
    max-width: 100%;
}

.m-p-body .bf-background-image-uploader-select-container:before,
.m-p-body .bf-select-option-container:before {
    height: 33px;
}

/* override king composer styles*/
.icons-list.icons-list.icons-list i {
    width: auto;
    margin: 7px 0 0;
    display: block;
    font-size: 14px;
    background: transparent;
}

/**************************************************************
 * 16. =>Elementor
 **************************************************************/

.elementor-editor-active .wp-picker-container.wp-picker-active {
    left: 0 !important;
    right: 0 !important;
}

.elementor-editor-active .bs-color-picker-wrapper .wp-picker-container .wp-color-result .color-alpha {
    margin: 0;
}

/**************************************************************
 * 17. =>Gutenberg
 **************************************************************/

body.gutenberg-editor-page .edit-post-layout__metaboxes:not(:empty),
body.block-editor-page .edit-post-layout__metaboxes:not(:empty) {
    background: #f1f1f1;
    padding-top: 25px;
    padding-bottom: 25px;
}

body.gutenberg-editor-page #normal-sortables .postbox ,
body.block-editor-page #normal-sortables .postbox {
    border: 1px solid #e5e5e5;
    background: #fff;
    margin-bottom: 25px;
}

body.gutenberg-editor-page #normal-sortables .postbox:last-child ,
body.block-editor-page #normal-sortables .postbox:last-child {
    margin-bottom: 0;
}

body.gutenberg-editor-page .edit-post-meta-boxes-area #poststuff h2.hndle ,
body.block-editor-page .edit-post-meta-boxes-area #poststuff h2.hndle {
    color: #191e23
}

.block-editor-page .edit-post-sidebar .bf-section-container>.bf-section:not(.bf-section-bf-repeater) ,
.block-editor-page .edit-post-sidebar .bf-section-container>.bf-section.bf-section-bf-repeater>.bf-heading {
    padding: 0 20px;
}
.block-editor-page .edit-post-sidebar .bf-section-container>.bf-section.bf-section-bf-repeater .bf-clone-repeater-item {
    margin: -5px auto 10px;
    display: block;
}

.gutenberg-editor-page .edit-post-sidebar .bf-section-container ,
.block-editor-page .edit-post-sidebar .bf-section-container {
    padding-right: 0;
    padding-left: 0;
}

.gutenberg-editor-page .edit-post-sidebar .bf-explain ,
.block-editor-page .edit-post-sidebar .bf-explain {
    margin-top: 9px;
    font-style: italic;
    opacity: 0.6;
}

.gutenberg-editor-page .edit-post-sidebar .bf-explain:empty ,
.block-editor-page .edit-post-sidebar .bf-explain:empty {
    display: none;
}

.gutenberg-editor-page .edit-post-sidebar .bf-section:hover > .bf-explain ,
.block-editor-page .edit-post-sidebar .bf-section:hover > .bf-explain {
    opacity: 0.9;
}

.gutenberg-editor-page .edit-post-sidebar .bf-heading h3 ,
.block-editor-page .edit-post-sidebar .bf-heading h3 {
    margin-bottom: 5px;
}

.gutenberg-editor-page .edit-post-sidebar .bf-section-container .bf-section{
    padding-top: 15px;
    padding-bottom: 15px;
}

.gutenberg-editor-page .edit-post-sidebar .bf-repeater-item > .bf-section-container .bf-section ,
.block-editor-page .edit-post-sidebar .bf-repeater-item > .bf-section-container .bf-section {
    padding-bottom: 0;
}

.gutenberg-editor-page .edit-post-sidebar .bf-repeater-item > .bf-section-container:last-child .bf-section ,
.block-editor-page .edit-post-sidebar .bf-repeater-item > .bf-section-container:last-child .bf-section {
    padding-bottom: 10px;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-selected-image,
.block-editor-page .edit-post-sidebar .select-popup-selected-image,
.gutenberg-editor-page .edit-post-sidebar .select-popup-selected-info ,
.block-editor-page .edit-post-sidebar .select-popup-selected-info {
    padding: 11px;
    box-sizing: border-box;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-selected-image ,
.block-editor-page .edit-post-sidebar .select-popup-selected-image {
    width: auto;
    max-width: inherit;
    float: none;
    line-height: 0;
    text-align: center;
    border-bottom: 1px solid #dedede;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-selected-image:before ,
.block-editor-page .edit-post-sidebar .select-popup-selected-image:before {
    display: none;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-selected-info ,
.block-editor-page .edit-post-sidebar .select-popup-selected-info {
    float: none;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-field ,
.block-editor-page .edit-post-sidebar .select-popup-field {
    max-width: 250px;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-field .active-item-label ,
.block-editor-page .edit-post-sidebar .select-popup-field .active-item-label {
    float: left;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-field .button ,
.block-editor-page .edit-post-sidebar .select-popup-field .button {
    float: right;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-field .active-item-text ,
.block-editor-page .edit-post-sidebar .select-popup-field .active-item-text {
    margin-bottom: 0;
}

.gutenberg-editor-page .edit-post-sidebar .select-popup-field .active-item-label ,
.block-editor-page .edit-post-sidebar .select-popup-field .active-item-label {
    margin-bottom: 6px;
}

.gutenberg-editor-page .edit-post-sidebar .bf-repeater-item ,
.block-editor-page .edit-post-sidebar .bf-repeater-item {
    padding-left: 10px;
    padding-right: 10px;
    margin-left: -3px;
    margin-right: -3px;
}

.gutenberg-editor-page .edit-post-sidebar .bf-section-bf-image-radio .bf-image-radio-option > label ,
.block-editor-page .edit-post-sidebar .bf-section-bf-image-radio .bf-image-radio-option > label {
    display: none;
}

.editor-block-types-list__item[class*="better-studio"] .editor-block-icon {
    width: 50px;
}

.editor-block-types-list__item[class*="better-studio"] .editor-block-icon .block-editor__container img {
    height: auto;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.components-panel .bf-section-container {
    padding-right: 0;
    padding-left: 0;
}