@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
.wbfd-progress-bar
{
    background: url("../images/progress-bar-loader.gif") no-repeat;
    width:128px;
    height:15px;
    display: none;
    margin: 15px auto;
}
.admin-design-container
{
    width: 100%;
    height: 100%;
    padding: 20px;
}
.wbfd_designer_sub_container

{

    width:90%;

    margin-left: 80px;

}

.wbfd_designer_container

{

    /*margin:20px auto;

    width: 90%;*/

    margin-left: -160px;
	width: 1273px;

}

.wbfd_design_popup

{

    width:100%;

    margin-top:10px;

}

.wbfd_overlay

{

    background: none repeat scroll 0 0 #000000;

    bottom: 0;

    left: 0;

    opacity: 0.7;

    position: fixed;

    right: 0;

    top: 0;

    z-index:99999;

    display: none;

}

.wbfd_design_popup_content

{

    width:1200px;

    height:638px;

    position: absolute;

    top: 50%;

    left: 57%;

    margin-left: -400px;

    margin-top: -319px;

    border: 1px solid #0091CD;

    background-color: #e1e1e1;

    display: none;

    z-index:999999;

}

.wbfd_close_popup

{

    background: url("../images/close_icon.png") no-repeat;

    width:20px;

    height:20px;

    position:absolute;

    right: -10px;

    top: -10px;

    cursor: pointer;

}

.wbfd_div_1

{
    width:550px;
    float: left;
    height: 260px;
    overflow: auto;
    position: relative;
}

.wbfd_div_2

{
    width:35%;
    border: 1px solid #E1E1E1;
    float: left;
    margin-left:30px;
    position:relative;
    height: 260px;
    overflow: auto;
}

.wbfd_div_1_frontend

{

    width:818px;

    height:577px;

   /* border: 1px solid #e4e4e4;*/

    float: left;

    overflow: auto;
	

}


.wbfd_div_2_frontend

{

    width:307px;

    min-height:460px;

    border: 1px solid #e4e4e4;

    float: left;

    margin-left:20px;

    position:relative;
	margin-top:20px;

}

.wbfd_clear

{

    clear: both;

}

.canvas_container

{
    margin: 0px auto;
    width:100%;
}

.wbfd_bg_icon_area

{

    width:100%;

    text-align: center;

    margin-top: 10px;

    position:relative;

}

.wbfd_front_bg

{
    height:70px;
    display: inline-block;
    text-align: center;
    vertical-align: top;
    padding:5px;
    border-radius: 4px;
}

.wbfd_back_bg

{
    height:70px;
    display: inline-block;
    text-align: center;
    vertical-align: top;
    padding:5px;
    border-radius: 4px;
}

.wbfd_front_bg img,.wbfd_back_bg img

{
    width: 100%;
    cursor: pointer;
    height: 100%;

}

.wbfd_front_bg:hover,.wbfd_back_bg:hover

{
    border: 1px solid #e1e1e1;
}

.wbfd_custom_bg_upload, .wbfd_custom_logo_upload, .wbfd_undo_reset_btn{
    margin-bottom: 15px;
}

.wbfd_bg_admin_uploader
{
    background: url("../images/background.png") no-repeat;
    width:102px;
    height:30px;
    cursor:pointer;
}

.wbfd_bg_front,.wbfd_bg_back

{
    display: inline-block;
    vertical-align:top;
    margin-top:8px;
}

.wbfd_loading

{
    background: url("../images/ajax-loader.gif") no-repeat;
    width:16px;
    height:11px;
    position: absolute;
    top:70px;
    display: none;
}

.wbfd_logo_admin_uploader

{
    background: url("../images/logo.png") no-repeat;
    width:102px;
    height:30px;
    cursor: pointer;
}
.wbfd_undo_reset_btn
{
    text-align: center;
}
.wbfd_loading_logo

{
    background: url("../images/ajax-loader.gif") no-repeat;
    width:16px;
    height:11px;
    display:none;
    margin: 0px auto;
}

.wbfd_undo_design

{
    /* background: url("../images/undo.png") no-repeat;
    width:40px;
    height:30px;
    display:inline-block; */
    cursor: pointer;
    /* vertical-align: middle; */
}

.wbfd_reset_design

{
    /* background: url("../images/reset.png") no-repeat;
    width:40px;
    height:30px;
    display:inline-block; */
    cursor: pointer;
    /* vertical-align: middle; */
}

.uploader-msg
{
    color: #2ea2cc;
    display: inline-block;
    font-size: 12px;
    font-style: italic;
    vertical-align: middle;
}

.wbfd_text_area_admin

{
    width:100%;
    margin: 20px 0px;
    /*height:270px;*/
    overflow: auto; 
}

.wbfd_text_area_frontend

{
    width:100%;
    margin: 20px 0px;
    min-height:270px;
}

.wbfd_text_div

{
    width: 100%;
    margin:10px 0px 10px 25px;
}



.wbfd_textarea_box textarea

{

    width:86%;

    height:35px;

    border: 1px solid #e4e4e4;

    resize: none;

    margin-top: 8px;

    padding: 5px;
    font-size: 14px;
    outline: none;
}

.wbfd_button_div

{

    width: 100%;

    display: block;

}

.wbfd_add_text

{

    background: url("../images/add-text.png") no-repeat;

    width:102px;

    height:30px;

    cursor: pointer;

    margin: 5px auto;

}

.wbfd_update_text

{

    background: url("../images/update.png") no-repeat;

    width:102px;

    height:30px;

    cursor: pointer;

    display: none;

    float: left;

    margin-left:35px;

}

.wbfd_remove_text

{

    background: url("../images/remove.png") no-repeat;

    width:102px;

    height:30px;

    cursor: pointer;

    display: none;

    float: left;

    margin-left:5px;

}

.wbfd_normal_text_control

{

    width:100%;

    display: block;

}

.wbfd_text_size

{

    margin: 15px 0px 15px 25px;

}

.wbfd_size_text

{

    display: inline-block;

    margin-right: 10px;

}

.wbfd_text_increase

{

    /* background: url("../images/big_text.png") no-repeat;

    width:12px;

    height:12px; */
    cursor: pointer;
    line-height: 22px;
    margin-top: -2px;
}

.wbfd_text_increase:hover2

{

    background: url("../images/big_text_hover.png") no-repeat;

    cursor: pointer;

}

.wbfd_text_deincrease

{

    /* background: url("../images/small_text.png") no-repeat;

    width:12px;

    height:12px; */
    cursor: pointer;
    margin-top: -2px;
    line-height: 22px;
}

.wbfd_text_deincrease:hover2

{

    background: url("../images/small_text_hover.png") no-repeat;

    cursor: pointer;

}

.wbfd_text_align

{

    margin: 15px 0px 15px 25px;

}

.wbfd_text_size_control .wbfd-size-increase-box{
    line-height: 22px;
    padding: 0px 5px;
    margin-top: -2px;
}

.wbfd_align_text

{

    display: inline-block;

}

.wbfd_text_align_left

{

   background: url("../images/text_align_left.png") no-repeat;

   width:12px;

   height:12px;

   display: none; 

   margin-right:5px;

}

.wbfd_text_align_left:hover2

{

    background: url("../images/text_align_left_hover.png") no-repeat;

    cursor: pointer;

}

.wbfd_text_align_center

{

   background: url("../images/text_align_center.png") no-repeat;

   width:12px;

   height:12px;

   display: none;

   margin-right:5px;

}

.wbfd_text_align_center:hover2

{

    background: url("../images/text_align_center_hover.png") no-repeat;

    cursor: pointer;

}

.wbfd_text_align_right

{

   /* background: url("../images/text_align_right.png") no-repeat;

   width:12px;

   height:12px; */

   display: none; 

}

.wbfd_text_align_right:hover2

{

    background: url("../images/text_align_right_hover.png") no-repeat;

    cursor: pointer;

}

.wbfd_text_color_control,.wbfd_text_fontFamily_control,.wbfd_text_style_control,.wbfd_text_stroke_control,.wbfd_text_stroke_width_control,.wbfd_limit_radius,.wtd_limit_spacing,.wbfd_text_reverse_aignment

{

    display:block;

}

.wbfd_text_color,.wbfd_text_font,.wbfd_text_style,.wbfd_text_stroke,.wbfd_text_stroke_width,.wbfd_limit_radius,.wtd_limit_spacing,.wbfd_text_reverse_aignment

{

    margin:15px 0px 15px 25px;

}

.wbfd_color_text,.wbfd_font_text,.wbfd_text_font_list,.wbfd_style_text,.wbfd_stroke_text,.wbfd_stroke_color_box,.wbfd_stroke_width_text,.wbfd_stroke_width_range,.wbfd_change_curved_text_radius_title,.wbfd_change_radius_range,.wbfd_change_curved_text_spacing_title,.wbfd_change_spacing_range,.wbfd_change_curved_direction_title,.wbfd_change_reverse, .wbfd_locking_control, .wbfd_layer_control, .wbfd_listing_control

{

    display:inline-block;

}

.wbfd_text_color_box

{

    display: inline-block;

}

.wbfd_stroke_width_text

{

    vertical-align: top;

    margin-top:18px;

}

.wbfd_text_color_box input[type="color"]

{

    width:125px;

    margin-left: 18px;

}

.wbfd_stroke_color_box input[type="color"]

{

    width:125px;

    margin-left: 5px;

}

.wbfd_text_font_list select

{

    width:130px;

    margin-left:22px;

    height:25px;

}

.wbfd_text_style_bold

{
   /* background: url("../images/bold.png") no-repeat;
   width:12px;
   height:12px; */
   /* display: inline-block; */
   cursor: pointer;

}

.wbfd_text_style_bold:hover2

{
    background: url("../images/bold_hover.png") no-repeat;
    cursor: pointer;
}

.wbfd_text_style_italic

{
   /* background: url("../images/italic.png") no-repeat;
   width:12px;
   height:12px; */
   /* display: inline-block; */
   cursor: pointer;
}

.wbfd_text_style_italic:hover2

{
    background: url("../images/italic_hover.png") no-repeat;
    cursor: pointer;
}

.wbfd_text_style_underline

{
   /* background: url("../images/underline.png") no-repeat;
   width:12px;
   height:12px; */
   /* display: inline-block; */
   cursor: pointer;
}

.wbfd_text_style_underline:hover2

{

    background: url("../images/underline_hover.png") no-repeat;

    cursor: pointer;

}

.wbfd_text_remove_icon

{
   /* background: url("../images/trash.png") no-repeat;
   width:12px;
   height:12px; */
   cursor: pointer;
}

.wbfd_text_remove_icon:hover2

{
    background: url("../images/trash_hover.png") no-repeat;
    cursor: pointer;
}

.wbfd_logo_remove

{

   background: url("../images/trash.png") no-repeat;

   width:12px;

   height:12px;

   display:none;

   margin-right:5px;

   vertical-align: top;

   margin-top:7px;

}

.wbfd_logo_remove:hover2

{

    background: url("../images/trash_hover.png") no-repeat;

    cursor: pointer;

}

/*.wbfd_stroke_width_range input[type=range],.wbfd_change_radius_range input[type=range],.wbfd_change_spacing_range input[type=range]

{

    -webkit-appearance: none;

    margin: 18px 0;

    width: 100%;

}

.wbfd_stroke_width_range input[type=range]:focus,.wbfd_change_radius_range input[type=range]:focus,.wbfd_change_spacing_range input[type=range]:focus   

{

    outline: none;

}

.wbfd_stroke_width_range input[type=range]::-webkit-slider-runnable-track,.wbfd_change_radius_range input[type=range]::-webkit-slider-runnable-track,.wbfd_change_spacing_range input[type=range]::-webkit-slider-runnable-track  

{

    width: 100%;

    height: 8.4px;

    cursor: pointer;

    animate: 0.2s;

    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;

    background: #3071a9;

    border-radius: 1.3px;

    border: 0.2px solid #010101;

}

.wbfd_stroke_width_range input[type=range]::-webkit-slider-thumb,.wbfd_change_radius_range input[type=range]::-webkit-slider-thumb,.wbfd_change_spacing_range input[type=range]::-webkit-slider-thumb  

{

    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;

    border: 1px solid #000000;

    height:34px;

    width: 10px;

    border-radius: 3px;

    background: #ffffff;

    cursor: pointer;

    -webkit-appearance: none;

    margin-top: -14px;

}

.wbfd_stroke_width_range input[type=range]:focus::-webkit-slider-runnable-track,.wbfd_change_radius_range input[type=range]:focus::-webkit-slider-runnable-track,.wbfd_change_spacing_range input[type=range]:focus::-webkit-slider-runnable-track  

{

    background: #367ebd;

}

.wbfd_stroke_width_range input[type=range]::-moz-range-track,.wbfd_change_radius_range input[type=range]::-moz-range-track,.wbfd_change_spacing_range input[type=range]::-moz-range-track  

{

    width: 100%;

    height: 8.4px;

    cursor: pointer;

    animate: 0.2s;

    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;

    background: #3071a9;

    border-radius: 1.3px;

    border: 0.2px solid #010101;

}

.wbfd_stroke_width_range input[type=range]::-moz-range-thumb,.wbfd_change_radius_range input[type=range]::-moz-range-thumb,.wbfd_change_spacing_range input[type=range]::-moz-range-thumb 

{

    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;

    border: 1px solid #000000;

    height:34px;

    width: 10px;

    border-radius: 3px;

    background: #ffffff;

    cursor: pointer;

}

.wbfd_stroke_width_range input[type=range]::-ms-track,.wbfd_change_radius_range input[type=range]::-ms-track,.wbfd_change_spacing_range input[type=range]::-ms-track  

{

    width: 100%;

    height: 8.4px;

    cursor: pointer;

    animate: 0.2s;

    background: transparent;

    border-color: transparent;

    border-width: 16px 0;

    color: transparent;

}

.wbfd_stroke_width_range input[type=range]::-ms-fill-lower,.wbfd_change_radius_range input[type=range]::-ms-fill-lower,.wbfd_change_spacing_range input[type=range]::-ms-fill-lower  

{

    background: #2a6495;

    border: 0.2px solid #010101;

    border-radius: 2.6px;

    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;

}

.wbfd_stroke_width_range input[type=range]::-ms-fill-upper,.wbfd_change_radius_range input[type=range]::-ms-fill-upper,.wbfd_change_spacing_range input[type=range]::-ms-fill-upper  

{

    background: #3071a9;

    border: 0.2px solid #010101;

    border-radius: 2.6px;

    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;

}

.wbfd_stroke_width_range input[type=range]::-ms-thumb,.wbfd_change_radius_range input[type=range]::-ms-thumb,.wbfd_change_spacing_range input[type=range]::-ms-thumb  

{

    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;

    border: 1px solid #000000;

    height:34px;

    width: 10px;

    border-radius: 3px;

    background: #ffffff;

    cursor: pointer;

}

.wbfd_stroke_width_range input[type=range]:focus::-ms-fill-lower,.wbfd_change_radius_range input[type=range]:focus::-ms-fill-lower,.wbfd_change_spacing_range input[type=range]:focus::-ms-fill-lower  

{

    background: #3071a9;

}

.wbfd_stroke_width_range input[type=range]:focus::-ms-fill-upper,.wbfd_change_radius_range input[type=range]:focus::-ms-fill-upper,.wbfd_change_spacing_range input[type=range]:focus::-ms-fill-upper 

{

    background: #367ebd;

}*/

.wbfd_div_curved

{

    display: none;

}

.wbfd_save_design

{

   background: url("../images/save-design.png") no-repeat;

   width:102px;

   height:30px;

   cursor:pointer;

   display:inline-block;

}

.wbfd_add_admin_more_text

{
    cursor: pointer;
    background: #0587E5;
    border-radius: 4px;
    width: 100%;
    text-align: center;
    font-size: 12px;
    color: #FFFFFF;
    padding: 7px 0px;
    font-weight: bold;
}

.wbfd_add_more_text
{
    margin-bottom: 20px;
}

.wbfd_add_more_text_frontend

{

   background: url("../images/more-text-frontend.png") no-repeat;

   width:102px;

   height:30px;

   cursor:pointer;

   display:inline-block;

}

/*.wbfd_design_add_to_cart

{
   background: url("../images/add-to-cart.png") no-repeat;
   width:102px;
   height:30px;
   cursor:pointer;
   float: right;
   margin-right: 80px;
   margin-top: 10px;
}*/

.wbfd_loading_save_design

{

    background: url("../images/ajax-loader.gif") no-repeat;

    width:16px;

    height:11px;

    display:none;

    margin-left: 5px;

    vertical-align:top;

    margin-top:9px;

}

/*.wbfd_change_curved_text_radius_title

{

    margin-top:18px;

}*/

/*.wbfd_change_curved_text_spacing_title

{

    margin-top:18px;

}*/

.wbfd_change_radius_range

{

    margin-left:35px;

}

.wbfd_change_spacing_range

{

    margin-left: 28px;

}

.wbfd_change_reverse label:first-child

{

    margin-left:15px;

}

.wbfd_option_content

{

    width:170px;

    height: 220px;

    border-bottom: 1px solid #0091CD;

    border-right:1px solid #0091CD;

    border-top: 1px solid #0091CD;

    position: absolute;

    bottom: 0px;

    left:389px;

    background-color:#f1f1f1;

    display: none;

}

.wbfd_option_area

{

/*    width:100%;

    text-align: center;*/

/*    height: 100%;

    overflow: auto;

    padding: 10px;*/

    margin-left:58px;

    margin-top: 10px;

}

.wbfd_design_option

{

   background: url("../images/option.png") no-repeat;

   width:73px;

   height:30px;

   cursor:pointer;

   display:inline-block;

}

.wbfd_save_by_user

{

   background: url("../images/new-save.png") no-repeat;

   width:102px;

   height:30px;

   cursor:pointer;

   display:inline-block;

}

.wbfd_qty_price_panel

{

    width: 100%;

    display: none;

    margin: 15px 0px;

    text-align: center;

}

.wbfd_qty_price_panel div

{

    display:none;

    margin-left: 15px;

    font-weight: bold;

}

.wbfd_qty input[type="text"]

{

    width: 40px;

    height: 25px;

    border: 1px solid #e4e4e4 !important;

}

.wbfd_price

{

    min-width: 100px;

}

.wbfd_option_all

{

    width:auto;

    height:auto;

}

.wbfd_option_all select

{

  height:25px;

  font-size:13px;

  width:130px;

/*  border-radius: 4px;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  border: 1px solid #868383;*/

  color: #555555;

  font-weight: normal;

/*  background-color: #ededed;*/

  text-align: center;

  margin-left:10px;

}

.wbfd_option_header

{

  font-size: 14px;

  font-weight: bold;

  padding: 10px 0;

  text-decoration: underline;

}

.wbfd_option_title

{

    display:inline-block;

}

dt.variation-design, dd.variation-design, dt.variation-wbfd_custom_price, dd.variation-wbfd_custom_price

{

    display: none !important;

}

#wbfdToDisplayCustomImage

{

  width:830px;

  min-height:418px;

  background: none repeat scroll 0 0 #F1F1F1;

  border:3px solid #3B5998;

  position:fixed;

  z-index: 999999 !important;

  top: 50%;

  left: 50%;

  margin-top: -209px;

  margin-left: -415px;

  display:none;

}

#wbfd_custom_img_content

{

  margin-left:160px;

  width:345px;

}

#wbfd_custom_img_content img

{

  height: 450px;

  margin-left:250px !important;

}

.wbfd_overlay

{

  background: none repeat scroll 0 0 #000000;

  bottom: 0;

  left: 0;

  opacity: 0.7;

  position: fixed;

  right: 0;

  top: 0;

  z-index:99999;

  display: none;

}

#wcp_custom_img_content

{

  text-align: center;

}

#wcp_custom_img_content div:nth-child(2)

{

    margin-left: 5px;

}

#wcp_custom_img_content div

{

    margin-top: 50px;

}

.wbfd_msg_content,.wbfd_success_msg_content

{

    width: 500px;

    height:250px;

    background: none repeat scroll 0 0 #F1F1F1;

    border:1px solid #2EA2CC;

    position:fixed;

    z-index: 999999 !important;

    top: 50%;

    left: 50%;

    margin-top: -125px;

    margin-left: -250px;

    display:none;

}

.wbfd_msg_header

{

    background: #2EA2CC;

    padding: 10px;

    color: #FFFFFF;

    font-size: 14px;

}

.wbfd_close_msg_content

{

   background: url("../images/close-button.png") no-repeat;

   width:10px;

   height:11px;

   cursor:pointer;

   position: absolute;

   right: 5px;

   top: 13px;

}

.wbfd_msg_content p,.wbfd_success_msg_content p

{

    margin: 20px;

}



/* input type range*/



input[type=range] {

    /*removes default webkit styles*/

    -webkit-appearance: none;

    

    /*fix for FF unable to apply focus style bug */

    border: 1px solid #FFFFFF !important;

    width:100%;

    cursor: pointer;

    

    /*required for proper track sizing in FF*/

}

input[type=range]::-webkit-slider-runnable-track {

    /*width: 300px;*/

    height: 5px;

    background: #ddd;

    border: none;

    border-radius: 3px;

}

input[type=range]::-webkit-slider-thumb {

    -webkit-appearance: none;

    border: none;

    height: 16px;

    width: 16px;

    border-radius: 50%;

    /*background: goldenrod;*/

    background: #38454F;

    margin-top: -4px;

}

input[type=range]:focus {

    outline: none;

}

input[type=range]:focus::-webkit-slider-runnable-track {

    background: #ccc;

}



input[type=range]::-moz-range-track {

    /*width: 300px;*/

    height: 5px;

    background: #ddd;

    border: none;

    border-radius: 3px;

}

input[type=range]::-moz-range-thumb {

    border: none;

    height: 16px;

    width: 16px;

    border-radius: 50%;

    /*background: goldenrod;*/

    background: #38454F;

}



/*hide the outline behind the border*/

input[type=range]:-moz-focusring{

    outline: 1px solid white;

    outline-offset: -1px;

}



input[type=range]::-ms-track {

    /*width: 300px;*/

    height: 5px;

    

    /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */

    background: transparent;

    

    /*leave room for the larger thumb to overflow with a transparent border */

    border-color: transparent;

    border-width: 6px 0;



    /*remove default tick marks*/

    color: transparent;

}

input[type=range]::-ms-fill-lower {

    background: #777;

    border-radius: 10px;

}

input[type=range]::-ms-fill-upper {

    background: #ddd;

    border-radius: 10px;

}

input[type=range]::-ms-thumb {

    border: none;

    height: 16px;

    width: 16px;

    border-radius: 50%;

    /*background: goldenrod;*/

    background: #38454F;

}

input[type=range]:focus::-ms-fill-lower {

    background: #888;

}

input[type=range]:focus::-ms-fill-upper {

    background: #ccc;

}



/* end type range*/



.wbfd_control_panel

{
    /*border: 1px solid #0091cd;*/
    display: block;
    margin: 0px auto 15px;
    /*padding: 10px;*/
    text-align: center;
    /*width: 100%;*/
}

.wbfd_text_size_control,.wbfd_text_align_control,.wbfd_text_color_control,.wbfd_text_font_control,.wbfd_text_style_control,.wbfd_text_remove

{
    /* display:inline-block; */
    /*margin-right: 15px;*/
    /*margin-bottom: 5px;*/
    /* vertical-align: middle; */
}

.wbfd_text_size_control

{

    /*margin-left: 5px;*/

}

.wbfd_text_font_control select, .txt_color

{
    width: 70px;
    height: 22px;
    font-size: 12px;
    text-align: center;
    border: 1px solid #7E869E40;
    border-radius: 4px;
}

.wbfd-mt-3{
    margin-top: 3px;
}

.wbfd_all_control

{
    display: none;
}

.back_side,.show_back_title

{
    display: none;
}

.side_name

{
    text-align: left;
}

.side_name h3

{
    font-size: 16px !important;
}
.wbfd-progress
{
    background: url("../../images/icon-progress.gif") no-repeat;
    width:50px;
    height:50px;
    position:absolute;
    top:50%;
    left:50%;
    margin-left: -25px;
    margin-top:-25px;
    display: none;
    z-index: 1001;
}
.wbfd-overlay 
{
    background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
    display:none;
}

.variation-panel-main
{
    width:100%;
    /* margin: 20px auto; */
    /* max-height:160px; */
    min-height:80px;
    overflow: auto;
    border: 1px solid #DEE1E8 !important;
    border-radius: 4px;
    padding: 14px 0;
    margin-bottom: 20px;
}
.variation-panel-main .option-labels
{
    font-size: 14px;
    margin-bottom: 5px;
    color: #000;
    font-family: "Inter", sans-serif !important;
    font-weight: 700;
}
.variation-panel-main select
{
    padding: 5px;
    height: 35px;
    background: #fff none repeat scroll 0 0;
    border: 1px solid #DEE1E8;
    border-radius: 4px;
    color: #000000A6;
    font-size: 14px;
    margin: 0 0 10px;
    width: 100%;
    outline: medium none;
    font-family: "Inter", sans-serif !important;
}

.variation-panel-main .selector-wrapper
{
    width: 86%;
    margin: 0px auto;
}

.swatch-selector-wrapper input[type="radio"] {
    display: none;
}

.swatch-selector-wrapper label {
    display: inline-block;
    padding: 6px 12px;
    font-family: "Inter", sans-serif !important;
    font-size: 14px;
    cursor: pointer;
    font-weight: 400;
    border: 1px solid #DEE1E8;
    margin-bottom: 0;
    color: #000;
    border-radius: 4px;
}

.swatch-selector-wrapper input[type="radio"]:checked+label {
    background-color: #DEE1E8;
}

.variation-panel-main .swatch-selector-wrapper{
    width: 86%;
    margin: 0px auto;
    margin-bottom: 10px;
}

.variation-panel-main .swatch-selector-wrapper .option-values{
    gap:10px;
}

.wbfd-side-selection
{
    display: block;
}
.wbfd-side-selection .side-name
{
    display: inline-block;
    margin: 10px 10px 0px 20px;
}

.wbfd-side-selection .side-name span
{
    margin-left:5px;
    font-size: 12px;
}
.wbfd_control_panel_main
{
    border: 1px solid #DEE1E8 !important;
    border-radius: 4px;
    margin-bottom: 20px;
}

.wbfd_add_element_area{
    margin-top: 25px;
}

.canvas-container{
    margin:0px auto;
}

.wbfd_content_main{
    width:85%;
    margin:0px auto;
}

.wbfd-lock
{
    /* background: url("../images/lock.png") no-repeat;
    width:12px;
    height:12px; */
    cursor: pointer;
}

.product-price-input{
    margin-left: auto;
}

.product-price-input .product-price{
    font-family: "Inter", sans-serif !important;
    font-weight: 700;
    font-size: 16px;
    color: #000000;
}

.wbfd-lock-big
{
    background: url("../images/lock_20.png") no-repeat;
    width:20px;
    height:20px;
    cursor: pointer;
}

.wbfd-unlock
{
    /* background: url("../images/unlock.png") no-repeat;
    width:12px;
    height:12px; */
    cursor: pointer;
}

.wbfd-unlock-big
{
    background: url("../images/unlock_20.png") no-repeat;
    width:20px;
    height:20px;
    display:inline-block;
    cursor: pointer;
}
.wbfd-bring-to-front
{
    /* background: url("../images/bring-forward-14.png") no-repeat;
    width:14px;
    height:14px; */
    /* display:inline-block; */
    cursor: pointer;
}

.wbfd-bring-to-front-big
{
    background: url("../images/bring-forward23.png") no-repeat;
    width:23px;
    height:23px;
    cursor: pointer;
}


.wbfd-bring-to-back
{
    /* background: url("../images/send-backward-14.png") no-repeat;
    width:14px;
    height:14px; */
    /* display:inline-block; */
    cursor: pointer;
}

.wbfd-bring-to-back-big
{
    background: url("../images/send-backward23.png") no-repeat;
    width:23px;
    height:23px;
    cursor: pointer;
}
.wbfd-redo
{
    /* background: url("../images/redo.png") no-repeat;
    width:12px;
    height:12px;
    display:inline-block; */
    cursor: pointer;
}
.wbfd-undo
{
    /* background: url("../images/undo.png") no-repeat;
    width:12px;
    height:12px;
    display:inline-block; */
    cursor: pointer;
}
.wbfd-align-left, .wbfd-align-left-on-canvas
{
    /* background: url("../images/align-left.png") no-repeat;
    width:12px;
    height:12px; */
    cursor: pointer;
}
.wbfd-align-center, .wbfd-align-center-on-canvas
{
    /* background: url("../images/align-center.png") no-repeat;
    width:12px;
    height:12px; */
    cursor: pointer;
}
.wbfd-align-right, .wbfd-align-right-on-canvas
{
    /* background: url("../images/align-right.png") no-repeat;
    width:12px;
    height:12px; */
    cursor: pointer;
}

.wbfd-advanced-control
{
    width:100%;
    padding:5px 0px;
    display:block;
    text-align: center;
    margin-bottom: 10px;
}

.wbfd-advanced-control .advanced-menu
{
    vertical-align: middle;
    margin: 0px 1px;
}
.wbfd-advanced-control .lock-system, .layering-system, .undo-redo-system, .alignment-system
{
    display:inline-block;
    vertical-align: middle;
    text-align: center;
    border: 1px solid #e1e1e1;
    padding: 2px 0 4px;
    margin-right: 6px;
}
.wbfd-advanced-control .lock-system, .layering-systemm .undo-redo-system
{
    width:6%;
}
/* .wbfd-advanced-control .alignment-system
{
    width:8.5%;
} */

.wbfd-flex{
    display: flex;
    flex-wrap: wrap;
}

.wbfd-control-list-content{
    gap: 15px;
}

/* .wbfd-control-list-holder .wbfd-control-list-content:last-child{
    margin-top: 10px;
    padding: 10px 10px 0px 10px;
    margin-bottom:10px;
} */

.wbfd-control-list-holder{
    width: 86%;
    margin: 0px auto;
    border-left: 1px solid #e4e4e4;
    border-bottom: 1px solid #e4e4e4;
    border-right: 1px solid #e4e4e4;
    margin-top: -10px;
}

.wbfd-logo-selection{
    border: 1px solid #0587E5;  
}

.wbfd_add_to_cart_panel{
    text-align: center;
}

.wbfd-ml-auto{
    margin-left: auto;
}

.wbfd-size-increase-box input[type="text"], .quantity-show-box input[type="text"]{
    width: 27px;
    height: 20px;
    border: 1px solid #e4e4e4;
    font-size: 12px;
    text-align: center;
}

.wbfd_text_size_control, .quantity-price-box-wrapper{
    background: #DEE1E8;
    border: 1px solid #7E869E40;
    height: 22px;
    border-radius: 4px;
    padding: 0px 5px;
}

.quantity-price-box-wrapper{
    width: 90px;
    height: 35px;
    padding: 0px;
    margin-left: 10px;
}

.quantity-price-box{
    border: 1px solid #DEE1E8;
    border-radius: 4px;
    padding: 13px 0px;
    margin-bottom: 20px;
}

.quantity-price-box-inner{
    width: 86%; 
    margin:0px auto;
    align-items: center;
}

.quantity-input{
    display: flex;
    align-items: center;
}

.quantity-input label{
    font-family: "Inter", sans-serif !important;
    font-weight: 700;
    font-size: 14px;
    color: #000000;
    margin-bottom: 0;
}

.quantity-show-box input[type="text"]{
    width: 34px;
    height: 31px;
    margin-top: 1px;
    font-family: "Inter", sans-serif !important;
    font-weight: 400;
}

.quantity-decrease, .quantity-increase{
    width: 27px;
    position: relative;
    cursor: pointer;
}

.quantity-decrease svg, .quantity-increase svg{
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    pointer-events: none;
}

.product-options-label{
    font-family: "Inter", sans-serif !important;
    font-weight: 700;
    color: #000000;
}


@media only screen and (max-width:768px)
{
    .admin-design-container h3
    {
        font-size:16px;
        text-align:center;
    }

    .wbfd_add_to_cart_panel .btn-custom{
        width: 100% !important;
    }
}
@media only screen and (max-width:900px)
{
    .wbfd_div_1
    {
        float:none;
        width: 100% !important;
    }
    .admin-design-container
    {
        padding: 0px;
    }
    .wbfd_div_2
    {
        float:none;
        margin-left: 0px;
        width: 100%;
        margin-top: 10px;
        height:auto !important;
    }
    /* .wbfd_front_bg, .wbfd_back_bg
    {
        width:50px;
        height: 30px;
    } */
    .variation-panel-main
    {
        margin-right: 10px;
        width: 100%;
        float: none;
    }
    .canvas_container .canvas-container
    {
        margin: 0px auto;
    }
}