/*

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

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

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

7. =>Menus
    7.1. =>Mega Menu Field
    7.2. =>Menu Badge Field
    7.3. =>Heading
    7.4. =>Color Picker
    7.5. =>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

9. =>Last Not Refactored Codes

*/

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

.clr{
	clear: both;
}
.rtl{
    text-align: right;
    direction: rtl;
}
.ltr{
    text-align: left;
    direction: ltr;
}
.limit-line {
    overflow: hidden;
    white-space: nowrap;
}
.ellipsis { text-overflow: ellipsis; }


/**
 * 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;
}


/**
 * 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;
}


/**
 * 2. =>General Fields
 **************************************************************/
/***** Field Prefix or Suffix ******/
.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;
}


/**
 * 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-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
 **************************************************************/
.bf-section-container .bf-section-heading {
    margin: 20px -20px;
}
.bf-section-container .bf-section-heading .bf-section-heading-title{
    background-color: #F5F5F5;
    border: 1px solid #D3D3D3;
    position: relative;
    height: 50px;
    line-height: 50px;
    font-size: 15px;
    color: #222222;
    font-weight: bold;
    display: block;
    padding: 0 20px;
}
.bf-section-container .bf-section-heading .bf-section-heading-title h3{
    margin: 0;
    font-size: 15px;
}
.bf-section-container .bf-section-heading .bf-section-heading-desc{
    margin-top: 15px;
    padding: 0 20px;
    color: #999;
}


/**
 * 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
 **************************************************************/
.bf-section-container .bf-controls-image_radio-option input[type=radio]{
    display: none;
}
.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 .bf-media-image-preview{
}
.bf-section-container .bf-section-media_image-option .bf-media-image-preview{

}


/**
 * 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 .better-social-counter-sorter{

}

.bf-section-container.vc-input .bf-vc-sorter-list,
.bf-section-container .better-social-counter-sorter .bf-sorter-list{
    margin: 3px 0;
}
.bf-section-container.vc-input .bf-vc-sorter-list li,
.bf-section-container .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,
.bf-section-container .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,
.bf-section-container .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,
.bf-section-container .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,
.bf-section-container .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,
.bf-section-container .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 ,
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.disable-item label,
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.disable-item input,
.bf-section-container .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;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item{
    color: #fff;
}

.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-facebook{
    background-color: #4a639f;
    border-color: #4a639f;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-twitter{
    background-color: #59c8ff;
    border-color: #59c8ff;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-google{
    background-color: #D73D32;
    border-color: #D73D32;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-dribbble{
    background-color: #ea4c89;
    border-color: #ea4c89;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-delicious{
    background-color: #4a79ff;
    border-color: #4a79ff;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-soundcloud{
    background-color: #F50;
    border-color: #F50;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-github{
    background-color: #666666;
    border-color: #666666;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-behance{
    background-color: #3b63fc;
    border-color: #3b63fc;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-youtube{
    background-color: #cc181e;
    border-color: #cc181e;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-vimeo{
    background-color: #46a3e9;
    border-color: #46a3e9;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-instagram{
    background-color: #517FA4;
    border-color: #517FA4;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-linkedin{
    background-color: #0266a0;
    border-color: #0266a0;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-vk{
    background-color: #4E729A;
    border-color: #4E729A;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-vine{
    background-color: #00bf8f;
    border-color: #00bf8f;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-pinterest{
    background-color: #cb2027;
    border-color: #cb2027;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-flickr{
    background-color: #2f44db;
    border-color: #2f44db;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-steam{
    background-color: #666666;
    border-color: #666666;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-rss{
    background-color: #f97410;
    border-color: #f97410;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-forrst{
    background-color: #3b7140;
    border-color: #3b7140;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-mailchimp{
    background-color: #2c9ab7;
    border-color: #2c9ab7;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-envato{
    background-color: #82B440;
    border-color: #82B440;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-posts{
    background-color: #4397CB;
    border-color: #4397CB;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-comments{
    background-color: #36B672;
    border-color: #36B672;
}
.bf-section-container .better-social-counter-sorter .bf-sorter-list li.active-item.checked-item.item-members{
    background-color: #CA7641;
    border-color: #CA7641;
}


/**
 * 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.opened .select-options .better-select-image-options,
.bf-section-container .better-select-image.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{
    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-image.opened .select-options .selected-option{
    background-color: #fafafa;

}
.bf-section-container .better-select-image .select-options: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;
}
.bf-section-container .better-select-image:hover .select-options,
.bf-section-container .better-select-image.opened .select-options{
    border-color: #C0C0C0;
}
.bf-section-container .better-select-image.opened .select-options{
    z-index: 99;
}
.bf-section-container .better-select-image.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.opened .select-options:after{
    color: #757575;
    border-color: #C0C0C0;
}
.bf-section-container .better-select-image.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.opened .select-options .better-select-image-options{
    display: block;
    cursor: default;
}
.bf-section-container .better-select-image.opened .select-options .better-select-image-options ul{
    margin: 15px 0 0 0;
}
.bf-section-container .better-select-image.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.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.opened .select-options .better-select-image-options ul li:hover{
    border-color: #c5c5c5;
}
.bf-section-container .better-select-image.opened .select-options .better-select-image-options ul li.selected{
    border-color: #0074a2;
}

/* 2 Column Style */
.bf-section-container .better-select-image.opened .select-options .better-select-image-options ul.grid-2-column li{
    width: 48%;
    float: left;
}
.bf-section-container .better-select-image.opened .select-options .better-select-image-options ul.grid-2-column li:nth-child(odd){
    margin-right: 4px;
}
.bf-section-container .better-select-image.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.opened .select-options .better-select-image-options ul.grid-3-column li{
    width: 32.43%;
    float: left;
}
.bf-section-container .better-select-image.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.opened .select-options .better-select-image-options ul.grid-4-column li{
    width: 32.43%;
    float: left;
}
.bf-section-container .better-select-image.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.opened .select-options .better-select-image-options ul.grid-4-column li:nth-child(16),
.bf-section-container .better-select-image.opened .select-options .better-select-image-options ul.grid-4-column li:nth-child(8),
.bf-section-container .better-select-image.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;
}
.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;
}
.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;
}
.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 .bs-theme-social-share-sorter .bf-sorter-list{
    margin: 3px 0;
}
.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-vc-sorter-list li,
.bf-section-container .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .fa,
.bf-section-container .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .bf-sorter-list li.checked-item{
    color: #fff;
}
.bf-section-container.vc-input.bs-theme-social-share-sorter li.checked-item#bf-sorter-group-item-sites-facebook,
.bf-section-container .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .bf-sorter-list li.checked-item.item-facebook:hover{ background-color: #5271b3; }
.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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .bf-sorter-list li.checked-item.item-google_plus{ background-color: #D73D32; }
.bf-section-container.vc-input.bs-theme-social-share-sorter .bf-sorter-list li.checked-item#bf-sorter-group-item-sites-google_plus:hover,
.bf-section-container .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .bf-sorter-list li.checked-item.item-email:hover{ background-color: #152430; }
.bf-section-container .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .bf-sorter-list li.checked-item.item-telegram:hover{ 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-whatsapp:hover,
.bf-section-container .bs-theme-social-share-sorter .bf-sorter-list li.checked-item.item-whatsapp{ background-color: #00ca65; }

.bf-section-container.vc-input.bs-theme-social-share-sorter li.placeholder-item,
.bf-section-container .bs-theme-social-share-sorter .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 .bs-theme-social-share-sorter .bf-sorter-list li.placeholder-item:after{
    content: '';
}
.bf-section-container.vc-input.bs-theme-social-share-sorter li input,
.bf-section-container .bs-theme-social-share-sorter .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;
}

/* 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.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;
}
.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-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;
}

/* 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;
}



/**
 * 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;
}

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

#bf-panel input[type=file]{
    background-color: #F5F5F5;
    padding: 5px;
    border: 1px solid #eee;
}
.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;
}
#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
 **************************************************************/
#bf-panel .bf-loading{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #636363;
    background-color: rgba(0, 0, 0, 0.41);
    display: none;
    z-index: 9999999;
}
#bf-panel .bf-loading .loader{
    width: 300px;
    height: 180px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -90px;
    margin-left: -150px;
    text-align: center;
}
#bf-panel .bf-loading.not-loaded,
#bf-panel .bf-loading.loaded,
#bf-panel .bf-loading.in-loading{
    display: block;
}
#bf-panel .bf-loading.in-loading .loader{
    color: white;
}
#bf-panel .bf-loading.loaded .loader{
    color: #27c55a;
}
#bf-panel .bf-loading.not-loaded .loader{
    color: #ff0000;
}
#bf-panel .bf-loading .loader .loader-icon{
    font-size: 30px;
    -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 .2s ease;
    opacity: 0;
    border-radius: 10px;
    background-color: #333;
    background-color: rgba(51, 51, 51, 0.86);
    width: 60px;
    height: 60px;
    line-height: 60px;
    margin-top: 20px;
    display: none;
    position: absolute;
    left: 50%;
    margin-left: -30px;
}
#bf-panel .bf-loading .loader .loader-icon .dashicons,
#bf-panel .bf-loading .loader .loader-icon .dashicons-before:before {
    font-size: 55px;
    line-height: 60px;
    width: 60px;
    height: 60px;
    text-align: center;
}
#bf-panel .bf-loading.in-loading .loader .loader-icon.in-loading-icon,
#bf-panel .bf-loading.in-loading.loader .loader-icon.in-loading-icon{
    opacity: 1;
    display: inline-block;
}
#bf-panel .bf-loading.in-loading .loader .loader-icon.in-loading-icon .dashicons,
#bf-panel .bf-loading.in-loading .loader .loader-icon.in-loading-icon .dashicons-before:before{
    -webkit-animation:spin 1.15s linear infinite;
    -moz-animation:spin 1.15s linear infinite;
    animation:spin 1.15s linear infinite;
    font-size: 30px;
}
#bf-panel .bf-loading.loaded .loader .loader-icon.loaded-icon{
    opacity: 1;
    display: inline-block;
    font-size: 50px;
}
#bf-panel .bf-loading.loaded .loader .loader-icon.loaded .dashicons,
#bf-panel .bf-loading.loaded .loader .loader-icon.loaded .dashicons-before:before{
    width: 57px;
}
#bf-panel .bf-loading.not-loaded .loader .loader-icon.not-loaded-icon{
    opacity: 1;
    display: inline-block;
}
#bf-panel .bf-loading.not-loaded .loader .loader-icon.not-loaded-icon .dashicons,
#bf-panel .bf-loading.not-loaded .loader .loader-icon.not-loaded-icon .dashicons-before:before{
    font-size: 50px;
    line-height: 62px;
}
#bf-panel .bf-loading .loader .message{
    display: none;
    color: #ff0000;
    font-size: 12px;
    line-height: 24px;
    min-width: 100px;
    max-width: 300px;
    left: auto;
    right: auto;
    text-align: center;
    background-color: #333;
    background-color: rgba(51, 51, 51, 0.86);
    border-radius: 5px;
    padding: 4px 20px;
    margin-top: 90px;
}
#bf-panel .bf-loading.with-message .loader .message{
    display: inline-block;
}
#bf-panel .bf-loading.loaded .loader .message{
    color: #27c55a;
}
#bf-panel .bf-loading.in-loading .loader .message{
    color: #fff;
}



@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }


/**
 * 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 .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;
}


/**
 * 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;
}


/**
 * 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;
}
.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;
    line-height: 44px;
    background: #2B4B80;
    color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
}
.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;
}



/**
 * 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 .fields-group#fields-group-mega_menu_heading .bf-field-mega_menu_cat,
.menu-item .fields-group#fields-group-mega_menu_heading .bf-field-mega_menu{
    display: none;
}
.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. =>Heading
 **************************************************************/
.bf-section-container.bf-menus .bf-section-heading .bf-section-heading-title{
}
.bf-section-container.bf-menus .bf-section-heading .bf-section-heading-title h3{
    margin: 0 0 -2px 0px !important;
    font-size: 13px;
}
.bf-section-container.bf-menus .bf-section-heading {
    margin: 10px 0;
}

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


/**
 * 7.5. =>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-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 {
    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;
}
.bf-section-container .bf-section .bf-controls input[type=text],
.bf-section-container .bf-select-option-container{
    max-width: 370px;
}
.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 {
    border-color: #C2C2C2;
}
.bf-section-container .bf-section .bf-controls select {
    cursor: pointer;
}
.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-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-container .bf-select-option-container:before{
    position: absolute;
    right: 0;
    top: 0;
    width: 32px;
    height: 32px;
    line-height: 32px;
    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;
}
.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 {
    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 {
    text-align: right;
    direction: rtl;
}

/**
 * 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-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: 55%;
}
.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-woff{
    width: 44%;
    float: left;
}
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-svg{
    clear: left;
}
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-eot,
.bf-repeater-item .repeater-item-container .bf-section-container.better-custom-fonts-ttf{
    width: 44%;
    float: right;
}
.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 10px 2px 0;
    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;
}
.bf-notice-container {
    display: table-row;
}
.bf-notice-text {
    display: table-cell;
    background: #fff;
    vertical-align: top;
    width:100%;
}
.bf-notice p {
    margin: 0.5em 0;
    padding: 2px;
}
.bf-notice.bf-notice-has-thumbnail {
    padding: 0;
}

.bf-notice.bf-notice-dismissible {
    padding-right: 40px;
}
.bf-notice .bf-notice-thumbnail {
    float: left;
    vertical-align: middle;
    padding: 0 7px;
    margin-right: 12px;
    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-no-thumbnail.bf-notice-success {
    border-left: 4px solid #46b450;
}
.bf-notice-warning .bf-notice-thumbnail {
    background: #ffb900;
}
.bf-notice-no-thumbnail.bf-notice-warning {
    border-left:4px solid #ffb900;
}
.bf-notice-danger .bf-notice-thumbnail {
    background: #dc3232;
}
.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;
}


/**************************************************************
 * 9. =>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;
}