.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider:before {
    position: absolute;
    content: "On";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}
input:checked + .slider {
    background-color: #929292;
}

input:focus + .slider {
    box-shadow: 0 0 1px #929292;
}
input:checked + .slider:before {
    content: "Off";
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}


.sett-foll-header{
    background-color: #FF5722;
    width: 100%;
    margin-top: 15px;
    border: solid 1px #e7e7e7;
    background-color: #ed701e;
    display: flex;
    align-items: center; height: 41px;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
}
.sidebar {
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: #f1f1f1;
    height: 100%;
    overflow: auto;
    float: left;

}

.sidebar a {
    display: block;
    color: black;
    padding: 9px 16px;
    text-decoration: none;
    border:solid 1px #e7e7e7
}

.sidebar a.active {
    background-color: white;
    color: red;
}

.sidebar a:hover:not(.active) {
    background-color: #555;
    color: white;
}

div.sett-foll-content {
    margin-left: 203px;
    padding: 1px 16px;
    /*   height: 1000px;*/
    background-color: white; padding-bottom: 30px;
    /*margin-right: 10px;*/
}

@media screen and (max-width: 700px) {
    .sidebar {
        width: 100%;
        height: auto;
        position: relative;
    }
    .sidebar a {float: left;}
    div.sett-foll-content {margin-left: 0;}
}

@media screen and (max-width: 400px) {
    .sidebar a {
        text-align: center;
        float: none;
    }
}

.sett-foll-content table tr{
    height: 35px;
}
.sett-flot-section{
    height: 30px;
    width: 170px;
}
.content-td1{
    width: 200px; height: 20px;
    font-size: 13px;
    font-family: "SegoeUI_Medium";
}
.content-td2{
    width: 500px; height: 20px;
}
td[class*="content-td"]{ line-height: 0px;}
.rotate-icon-span{
    width: 50px;
    height: 50px;
    margin-left: 10px;
    display: inline-flex;
    position: relative;
    align-items: center;
    justify-content: center;
}
.rotate-icon-span label{width: 100%;
    position: relative;
    z-index: 10; text-align:center;
    overflow: hidden;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.rotate-icon-span input[type=radio]{position: absolute;
    z-index: 0;
    left: 36%;
}
.rotate-icon-span + p{padding-right: 10px; margin-bottom: 7px; padding-top: 0px; margin-top: 5px; font-family: "SegoeUI"}
.rotate-icon-span.active-radio + p{font-family: "SegoeUI_Medium"}

.rotate-icon-span label:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background: white;
    left: 0px;
    z-index: -1;
}

.active-radio{ border:1px solid #d4d4d4;}
[type=radio] {
    position: absolute;
    /*opacity: 0;
    width: 0;
    height: 0;*/
}
.radio {
    width: 40px;
    height: 58px;
    opacity: 10;
}
/* IMAGE STYLES */
[type=radio] + img {
    cursor: pointer;
}

/* CHECKED STYLES */
[type=radio]:checked + img {
    outline: 2px solid #f00;
}
.sett-foll-width-fld, .watermark-width-height input{
    margin-left: 20px;
    width:53px!important;
    height: 29px;
    text-align: right;
    font-size: 13px;
    /* direction: rtl;*/
}

.sett-foll-opacity-fld {
    width: 53px;
    margin-left: 10px;
    height: 29px;
     text-align: right;
    font-size: 13px;
}
.foldio360_setting_save_changes_btn{
    float: right;
    /*width: 150px;*/
    height: 29px;
    margin-right:0px;
    border:none; border-radius: 2px;
    background-color: #4d4d4d;
    color: white; padding-left: 12px; padding-right: 12px; cursor: pointer
}
.foldio360_setting_save_changes_btn:hover{ background: #333333;}
.foldio360_setting_reset_changes_btn{
    margin-right: 6px;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 2px;
    border: none;
    height:29px; cursor: pointer;
}
.sett-foll-header div{
    width: 100px;
    float: left;
    color: white;
    font-family: "SegoeUI_Medium";
    font-size: 14px;
}
.ml-auto{margin-left: auto!important;
    width: auto!important;
    display: flex;
    align-items: center;}
.rotate-icon-span{ border:2px solid #e7e7e7; width: 89px!important; height: 70px!important; margin-left: 0px!important; margin-right: 10px; padding: 5px; box-sizing: border-box; margin-top: 5px;}
.rotate-icon-span.active-radio{ border-color: #ed701e}
.dashicons, .dashicons-before:before{ font-size: 17px; line-height: 20px; margin-right: 3px;}
.sidebar a.active{color: #ed701e; font-size: 14px; font-family: SegoeUI_Medium; border-right:none;}



.on-off-toggle{  width: 130px; display: inline-block; height: 30px; font-size: 14px;}
.ontxt, .offtxt{ transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out;}
.ontxt:hover, .selected .offtxt:hover{ background: #dedede}
.switch-light input:checked ~ span span.ontxt{ background: none}


.switch-toggle.switch-candy, .switch-light.switch-candy > span{ background-color: #eeeeee!important;}
.switch-candy a{background: #777777!important; color: white!important; border-color: transparent!important;}
.switch-light input:checked ~ span a{ background: #ed701e!important; color: white!important; border-color: transparent!important; box-shadow: none; border-radius: 0px;}
.switch-light input:checked ~ span:hover a{ background: #cc5e16!important;}
.switch-candy span:hover a{ background: #666666!important;}



.switch-light.switch-candy span span, .switch-light.switch-candy input:checked ~ span span:first-child, .switch-toggle.switch-candy label{ color: #23282d; text-shadow: none!important;}

.w-auto{ width: auto}
.d-inline{ display: inline}
.float-left{ float: left; text-align: center}

.switch-light.switch-candy input:checked ~ span span:nth-child(2){ color: white!important;}

.ml-0{ margin-left: 0px;}
.mt-15{ margin-top: 15px;}
.content-td2 .on-off-toggle{ margin-left: 0px!important; width: 150px;}
.switch-candy{ width: 156px;}
.d-flex{ display: flex}
.align-items-center{ align-items: center}
.ontxt, .offtxt{ padding-top: 2px;}
td.content-td2 .toggle-demo + select{ margin-left: 15px;}

.wp-core-ui select{
    width: 156px;
    background: url(../images/combo_arrow_default.svg) no-repeat center right 8px!important;
    -webkit-appearance: none;
    padding-left: 8px;
    height:29px;
    border: 1px solid #e7e7e7; font-size: 13px;line-height: normal;
    padding-top: 0px; margin: 0px; vertical-align: middle; min-height: 29px;
}
.wp-core-ui select:focus, .wp-core-ui select:active, .wp-core-ui select:visited, .wp-core-ui select:hover{ outline: none; box-shadow: none; border-color:#b7b7b7; background-image: url(../images/combo_arrow_hover.svg)!important;}



.tooltip {
    position: relative;
    display: inline-block;
    color: rgba(0, 0, 0, .4);
}
.specific-setting .tooltip, .custom-setting-form .tooltip{display: inline-flex}

.tooltip .fa{ font-size: 14px;}
.tooltip .tooltiptext {
    visibility: hidden;
    position: absolute;
    width: 141px;
    background-color: rgba(0, 0, 0, .5);
    color: #fff;
    text-align: center;
    padding: 3px 5px;
    border-radius: 2px;
    opacity: 0;
    transition: opacity 0.3s;
    font-size: 10px;
    line-height: normal;
    z-index: 100;
    min-height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "SegoeUI";
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.tooltip-bottom {
    top: 135%;
    /* left: 50%;
     margin-left: -120px;*/
    left: 0%;
    margin-left: -10px;
}

.tooltip-bottom::after {
    content: "";
    position: absolute;
    bottom: 100%;
    /* left: 50%;*/
    left: 10%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #7f7f7f transparent;
}
.w-auto{ width: auto!important;}
.h-auto{ height: auto!important;}
#setting.woocommerce_options_panel label, .woocommerce_options_panel legend, #setting-shortcode label{ margin-left: 0px!important;}

.specific-setting{ padding: 1.5em!important;}
.specific-setting td:first-child input[type="checkbox"] {margin-right: 15px;}
.specific-setting td:first-child{ width: 50px}
.specific-setting .content-td1.w-auto {width: 30%!important;}
.specific-setting .content-td2.w-auto {width: 65%!important;}
.specific-setting .on-off-toggle input[type="checkbox"]{ opacity: 0;}
/*.specific-setting .on-off-toggle input[type="checkbox"]:disabled ~ span { opacity: .5}*/
.specific-setting td{ padding: 5px!important; vertical-align: top}
.specific-setting .content-td2.w-auto select{ min-width: 150px;}
.specific-setting  .watermark{ margin-top: 7px;}
.specific-setting  .watermark span{ width: 60px}
.specific-setting  .watermark input{ width: 100px!important; margin-right: 10px;}
.specific-setting input[type=file]{ margin-bottom: 7px;}

.specific-setting{ padding: 1.5em!important;}
.specific-setting td:first-child input[type="checkbox"] {margin-right: 15px;}
.specific-setting td:first-child{ width: 50px}
.specific-setting .content-td1.w-auto {width: 30%!important;}
.specific-setting .content-td2.w-auto {width: 65%!important;}
.specific-setting .on-off-toggle input[type="checkbox"]{ opacity: 0;}
.specific-setting .on-off-toggle input[type="checkbox"]:disabled ~ span, .specific-setting select.disabled, .specific-setting select:disabled { opacity: .3; pointer-events: none}
/*.specific-setting td.disabled{ opacity: .3; pointer-events: none;}*/
.specific-setting td.disabled{ opacity: .3; pointer-events: auto;}
/*.specific-setting td:last-child, .specific-setting td:nth-child(2) { opacity: .3; pointer-events: none;}
.specific-setting td:first-child input[type="checkbox"]:checked ~ td{ opacity: 1}*/

.specific-setting td{ padding: 5px!important; vertical-align: top}
.specific-setting .content-td2.w-auto select{ min-width: 150px;}
.specific-setting  .watermark{ margin-top: 7px;}
.specific-setting  .watermark span{ width: 60px}
.specific-setting  .watermark input{ width: 100px!important; margin-right: 10px;}
.specific-setting input[type=file]{ margin-bottom: 7px;}
.off-gray-bg:after { position: absolute; min-width: 430px; height: 64px; background: rgba(0, 0, 0, .6); position: absolute; width: 100%; height: 100%; z-index: 100; content: ""; top: 0px;}

.off-gray-bg-text{ display: none}
.off-gray-bg .off-gray-bg-text{ display: none; min-width: 430px; height: 64px; background: rgba(0, 0, 0, .6); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    text-align: center; border-radius: 32px; display: flex; align-items: center; padding-left: 20px; padding-right: 20px; box-sizing: border-box; z-index: 101; color: #ffffff;
    text-align: center; justify-content: center; font-size: 14px; font-family: "SegoeUI"; line-height: 1.36;}

#li_image_list.attachment.save-ready:focus {box-shadow: none;}
#li_image_list:hover .attachment-preview {border: 3px solid #666666;}
#li_image_list .attachment-preview{border:3px solid transparent; box-shadow: none; background: none;}
#li_image_list span.dashicons-dismiss {display: none;}
#li_image_list:hover span.dashicons-dismiss {display: block;}
/*li#li_image_list {width: 20%!important;min-height: 175px; max-width: 135px;}*/
li#li_image_list {width: 20%!important;min-height: auto; max-width: 135px;display: block}
#imagelist .uploader-inline-content .upload-ui{ margin-top: 0px;}
.hover-dashicons-dismiss{position: absolute;top: 0px;z-index: 10;right: 0px;font-size: 25px;background: #ffffff;border-radius: 100%;}
.hover-dashicons-dismiss:before{ color:#666666}
.wp-core-ui .foldio-product-data .button-link-delete {
    color: #a00;
    font-size: 13px;
    background: none;
    border: none;
    border: 1px solid #a00;
    /*padding: 6px;*/
    border-radius: 2px;
}
.imagelist-shortcodes{
    display: block !important;
    padding-bottom: 50px !important;
}
.imagelist-shortcodes li#li_image_list{ width: 14%!important;min-width: 135px}
.uploader-inline li#li_image_list {
    width: 20%!important;
    min-width: 135px;
}