/*------------------------------------*\
    S4BT Button
\*------------------------------------*/
.s4bt_button.webix_el_button{
    width: auto !important;
    margin-left: 0px !important;
    margin-top: 0px !important;
}
.s4bt_button .webix_el_box{
    padding: 0px !important
}
.s4bt_button .webix_image{
    width: 24px !important;
    height: 24px !important;
}
.s4bt_buttonRightFooter button{
    float:right !important
}
.s4bt_buttonWhite{
    width: 140px;
    height: 36px;
    border-radius: 100px;
    background-color: #fff;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.6px;
    text-align: center;
    text-transform: uppercase;
    color: #243256;
    position: relative;
    right:0;
    cursor: pointer;
}
.s4bt_boxHeight64 .webix_el_box{
    height:64px !important;
    margin-top:12px !important
}
.s4bt_boxHeight96 .webix_el_box{
    height:96px !important;
    margin-top:12px !important
}
.s4bt_width72 .webix_el_box{
    width:72px !important
}
.s4bt_btnRight32{
    float: right;
    margin-right:32px;
}

/*------------------------------------*\
    S4BT Width Button
\*------------------------------------*/
/* .s4bt_width90 .webixtype_base{
    width:90px !important;
} */
.s4bt_width116 .webixtype_base{
    width:116px !important;
}
.s4bt_width132 .webixtype_base{
    width:132px !important;
}
.s4bt_width192 .webixtype_base{
    min-width:192px !important;
}
.s4bt_width250 .webixtype_base{
    min-width:250px !important;
}





/*------------------------------------*\
    S4BT Icon with Text on Bottom 
\*------------------------------------*/
.s4btIconBottomTextButton button{
    width: 56px;
    height: 56px;
    background-color: transparent;
    border-radius: 4px;
    border: none !important;
}
.s4btIconBottomTextButton .webix_img_btn_abs.webix_img_btn_abs_top.webixtype_base{
    width: 56px;
    height: 56px;
    background-color: transparent;
    border: none !important;
}
.s4btIconBottomTextButton .webix_img_btn_abs .webix_img_btn_text{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0.6;
    text-align: center;
    color: #8d9196;
    position: absolute !important;
    top: 40px;
    text-transform: uppercase;
}
.s4btIconBottomTextButton .webix_img_btn_abs .webix_icon{
    font-size: 24px !important;
    color: #8d9196;
    position: absolute !important;
    top: 10px !important;	
}
.s4btIconBottomTextButton .webix_img_btn_top .webix_img_btn_text{
    font-family: Rubik;
    font-size: 12px;
    font-weight: 500;
    color: #8d9196;
    letter-spacing: 0.3px;
    position: absolute !important;
    top: 36px;
}
.s4btIconBottomTextButton .webix_img_btn_top{
    position: absolute;
    top: 25% !important;
    transform: translateY(-25%);
}
/* .s4btIconBottomTextButton .webix_img_btn_top .webix_icon {
    font-size: 32px;
} */
.s4btIconBottomTextButton .webix_img_btn_top .webix_icon{
    margin-left: -18px !important;
    margin-top: -8px !important;
    font-size: 32px;
}
.s4btIconBottomTextButton .webix_img_btn_top:hover,
.s4btIconBottomTextButton .webix_img_btn_top:focus,
.s4btIconBottomTextButton .webix_img_btn_top:active{
  background-color: transparent;
}
.s4btIconBottomTextCloseSetup button{
    width: 56px;
    height: 56px;
    background-color: transparent;
    border-radius: 4px;
    border: none !important;
}
.s4btIconBottomTextCloseSetup .webix_img_btn_abs.webix_img_btn_abs_top.webixtype_base{
    width: 56px;
    height: 56px;
    background-color: transparent;
    border: none !important;
}
.s4btIconBottomTextCloseSetup .webix_img_btn_abs .webix_img_btn_text{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0.6;
    text-align: center;
    color: #505c83;
    position: absolute !important;
    top: 40px;
    text-transform: uppercase;
}
.s4btIconBottomTextCloseSetup .webix_img_btn_abs .webix_icon{
    width: 24px;
    height: 24px;
    background-color: #ee5244;
    border-radius: 50%;
    font-size: 16px !important;
    color: #fff;
    position: absolute !important;
    top: 10px !important;	
    line-height: 1.54;
}

/*------------------------------------*\
    S4BT User Section
\*------------------------------------*/
.s4bt_headerProfile button,
.s4bt_headerProfile button:hover{
    height: 56px;
    background: #F7F8F9 !important;
    border: none !important;
    border-radius: 5px;
}
.s4bt_headerProfile .webix_icon{
    font-size:24px;
    color: #919eac;
    float: right;
    text-align: center;
    position: relative;
    /* top: -2px;
    left: 8px; */
    top: 25%;
    left: 16px;
    transform: translateY(-25%);
}
.s4bt_headerProfileDeskTab .webix_icon{
    font-size:24px;
    color: #919eac;
    text-align: center;
    position: relative;
    top: 25%;
    left: -8px;
    transform: translateY(-25%);
}
.s4bt_headerProfileMobile .webix_el_box{
    padding: 0 !important
}
.s4bt_headerProfileMobile button,
.s4bt_headerProfileMobile button:hover{
    height: 40px;
    background: #F7F8F9;
    border: none !important;
    border-radius: 5px;
}
.s4bt_headerProfileMobile .webixtype_base:focus{
    height: 40px;
    background: #F7F8F9;
    border: none !important;
    border-radius: 5px;
}
.s4bt_headerProfileMobile .s4bt_avatarProfile{
    width: 32px;
    height: 32px;
    float: left;
    padding-top: 2px;
}
.s4bt_headerProfileMobile span{
    font-size:15px;
    color: #919eac;
    float: left;
    /* padding-left:8px; */
}
.s4bt_headerProfileMobile .webix_icon{
    font-size:18px;
    color: #919eac;
    text-align: center;
    line-height: 2;
    /* padding-left: 6px;
    margin: 0 !important; */
}

.s4bt_headerProfilePortrait .webix_icon{
    font-size: 24px;
    color: #919eac;
    float: right;
    text-align: center;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    left: 65% !important;
}

/*------------------------------------*\
    S4BT Close Secondary Menu
\*------------------------------------*/
.s4btIconHideSecondMenu button{
    width: 24px !important;
    height: 36px !important;
    border-radius: 4px;
    border: none;
    background-color: #fff;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
}
.s4btIconHideSecondMenu.webix_el_icon,
.s4btIconHideSecondMenu .webix_el_box{
    width:auto !important
}
.s4btIconHideSecondMenu .webix_icon_button:hover:before {
    background-color: #fff;
    opacity: 1;
    transform: scale(1);
}
.s4btIconHideSecondMenu .webix_icon_button .webix_icon {
    font-size: 16px;
    height: 16px !important;
    display: inline-block;
    text-align: center;
    position: absolute;
    top: 50%;
    right: 3px;
    transform: translateY(-50%);
    color: #738596;
}
.s4btIconHideSecondMenu{
    margin-left: 0px !important;
}
.s4btIconHideSecondMenu.webix_el_icon.s4bt_button.webix_disabled_view{
    cursor: default;
    background-color:transparent !important
}
.s4btIconHideSecondMenu.webix_el_icon.s4bt_button.webix_disabled_view button{
    width: 24px !important;
    height: 36px !important;
    border-radius: 4px;
    border: none;
    background-color: #fff;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    opacity: 0.3;
}

/*------------------------------------*\
    S4BT Close Toolbar
\*------------------------------------*/
.s4btIconHideToolbar button{
    width: 36px !important;
    height: 24px !important;
    border-radius: 4px;
    border: none;
    background-color: #fff;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
}
.s4btIconHideToolbar .webix_icon_button:hover:before {
  background-color: #fff;
  opacity: 1;
  transform: scale(1);
}
.s4btIconHideToolbar .webix_icon_button .webix_icon {
    font-size: 16px;
    height: 16px !important;
    line-height: 1.3 !important;
    display: inline-block;
    text-align: center;
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
    color: #738596;
}
.s4btIconHideToolbar{
    margin-left: 0px !important;
}
.s4btIconHideToolbar.webix_el_icon.s4bt_button.webix_disabled_view{
    cursor: default;
    background-color:transparent !important
}
.s4btIconHideToolbar.webix_el_icon.s4bt_button.webix_disabled_view button{
    width: 36px !important;
    height: 24px !important;
    border-radius: 4px;
    border: none;
    background-color: #fff;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    opacity: 0.3;
}






/*------------------------------------*\
    S4BT Blue Accent Background Det Proc Menu
\*------------------------------------*/
.s4btBlueAccentDetProcMenu.webix_el_button,
.s4btBlueAccentDetProcMenu .webix_el_box{
    width: 120px !important;
    height: auto !important;
}
.s4btBlueAccentDetProcMenu .webix_icon_btn{
    line-height: 1.6;
    color: #ffffff !important;
}
.s4btBlueAccentDetProcMenu button,
.s4btBlueAccentDetProcMenu button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #1452cc !important;
    border-radius: 24px !important;
    background-color: #1452cc !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #ffffff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btBlueAccentDetProcMenu .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Blue Accent Background Config
\*------------------------------------*/
.s4btBlueAccentConfiguratore.webix_el_button,
.s4btBlueAccentConfiguratore .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btBlueAccentConfiguratore button,
.s4btBlueAccentConfiguratore button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #1452cc !important;
    border-radius: 24px !important;
    background-color: #1452cc !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btBlueAccentConfiguratore .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Text & Border Accent
\*------------------------------------*/
.s4btWhiteBorderAccent.webix_el_button,
.s4btWhiteBorderAccent .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btWhiteBorderAccent button,
.s4btWhiteBorderAccent button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #243256 !important;
    border-radius: 24px !important;
    background-color: #fff !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #243256 !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btWhiteBorderAccent .webix_disabled_box button{
    opacity: .3;
}


/*------------------------------------*\
    S4BT Text Accent White Background
        Det Proc Menu
\*------------------------------------*/
.s4btWhiteDetProcMenu.webix_el_button,
.s4btWhiteDetProcMenu .webix_el_box{
    width: 120px !important;
    height: auto !important;
}
.s4btWhiteDetProcMenu .webix_icon_btn{
    line-height: 1.6;
    color: #1452cc;
}
.s4btWhiteDetProcMenu button,
.s4btWhiteDetProcMenu button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #fff !important;
    border-radius: 24px !important;
    background-color: #fff !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btWhiteDetProcMenu .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Red Error Background
\*------------------------------------*/
.s4btStatusRedError.webix_el_button,
.s4btStatusRedError .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btStatusRedError button,
.s4btStatusRedError button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #db5d4d !important;
    border-radius: 24px !important;
    background-color: #db5d4d !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btStatusRedError .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Green Success Background
\*------------------------------------*/
.s4btStatusGreenSuccess.webix_el_button,
.s4btStatusGreenSuccess .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btStatusGreenSuccess button,
.s4btStatusGreenSuccess button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #9CD638 !important;
    border-radius: 24px !important;
    background-color: #9CD638 !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btStatusGreenSuccess .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Orange Warning Background
\*------------------------------------*/
.s4btStatusOrangeWarning.webix_el_button,
.s4btStatusOrangeWarning .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btStatusOrangeWarning button,
.s4btStatusOrangeWarning button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #FBBF3C !important;
    border-radius: 24px !important;
    background-color: #FBBF3C !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btStatusOrangeWarning .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Status Default
\*------------------------------------*/
.s4btStatusDefault.webix_el_button,
.s4btStatusDefault .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btStatusDefault button,
.s4btStatusDefault button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #505c83 !important;
    border-radius: 24px !important;
    background-color: #505c83 !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btStatusDefault .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Border Red White Background
\*------------------------------------*/
.s4btWhiteBorderRed.webix_el_button,
.s4btWhiteBorderRed .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btWhiteBorderRed button,
.s4btWhiteBorderRed button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #ee5244 !important;
    border-radius: 24px !important;
    background-color: #fff !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #ee5244 !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btWhiteBorderRed .webix_disabled_box button{
    opacity: .3;
}


/*------------------------------------*\
    S4BT Image Accent Light
\*------------------------------------*/
.s4btButtonImageAccentLight{
    vertical-align: middle !important;
}
.s4btButtonImageAccentLight .webix_el_box{
    width: auto !important;
}
.s4btButtonImageAccentLight button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #e8effc !important;
    cursor: default;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}
.s4btButtonImageAccentLight .webix_img_btn{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.4 !important;
    letter-spacing: 0.6px;
    color: #1452cc !important;
    text-transform: uppercase !important;
}
.s4btButtonImageAccentLight.webix_disabled_view button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #e8effc !important;
    cursor: default;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: default;
    opacity: .3;
}
.s4btButtonImageAccentLight.webix_disabled_view .webix_img_btn{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.4 !important;
    letter-spacing: 0.6px;
    color: #8d9196 !important;
    text-transform: uppercase !important;
}

/*------------------------------------*\
    S4BT Border Blue Primary
\*------------------------------------*/
.s4btWhiteBorderBluePrimary.webix_el_button,
.s4btWhiteBorderBluePrimary .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btWhiteBorderBluePrimary button,
.s4btWhiteBorderBluePrimary button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #4678aa !important;
    border-radius: 24px !important;
    background-color: #fff !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #666 !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btWhiteBorderBluePrimary .webix_disabled_box button{
    opacity: .3;
}


/*------------------------------------*\
    S4BT Regression Status
\*------------------------------------*/
.s4btButtonRegressionStatus button,
.s4btButtonRegressionStatus button:hover{
    padding: 0 16px;
    background-color: transparent !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #ee5244 !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btButtonRegressionStatus .webix_icon_btn,
.s4btButtonRegressionStatus .webix_input_icon{
    height: 17px;
    color: #ee5244 !important;
}
.s4btButtonRegressionStatus .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Regression Status Mobile
\*------------------------------------*/
.s4btButtonRegressionStatusMobile button,
.s4btButtonRegressionStatusMobile button:hover{
    padding: 0 8px;
    background-color: transparent !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #ee5244 !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btButtonRegressionStatusMobile .webix_icon_btn,
.s4btButtonRegressionStatusMobile .webix_input_icon{
    height: 17px;
    color: #ee5244 !important;
}
.s4btButtonRegressionStatusMobile .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Advance Status
\*------------------------------------*/
.s4btButtonAdvanceStatus button,
.s4btButtonAdvanceStatus button:hover{
    padding: 0 16px;
    background-color: transparent !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btButtonAdvanceStatus .webix_icon_btn,
.s4btButtonAdvanceStatus .webix_input_icon{
    color: #1452cc !important;
    float: right;
    margin-left: 8px;
    padding-top: 6px;
}
.s4btButtonAdvanceStatus .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Advance Status Mobile
\*------------------------------------*/
.s4btButtonAdvanceStatusMobile button,
.s4btButtonAdvanceStatusMobile button:hover{
    padding: 0 8px;
    background-color: transparent !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btButtonAdvanceStatusMobile .webix_icon_btn,
.s4btButtonAdvanceStatusMobile .webix_input_icon{
    color: #1452cc !important;
    float: right;
    margin-left: 8px;
}
.s4btButtonAdvanceStatusMobile .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Modify Detal Process
\*------------------------------------*/
.s4bt_buttonInfoDetailProcess{
    width: auto !important;
    height: auto !important;
    margin-right: 8px;
    padding-top: 16px;
}
.s4bt_buttonInfoDetailProcessMob{
    width: auto !important;
    height: auto !important;
    margin-right: 0px !important;
    padding-top: 0px !important;
}
.s4bt_buttonInfoDetailProcess .webix_img_btn{
    width: 24px !important;
    height: 24px !important;
    border-radius: 100% !important;
}
.s4bt_buttonInfoDetailProcess .webix_icon_btn{
    font-size: 20px !important;
    opacity: 1 !important;
    vertical-align: text-top !important;
    padding-left: 2px !important;
}

.s4bt_buttonSearchDetailProcess .webix_img_btn{
    background-color: transparent !important;
}
.s4bt_buttonSearchDetailProcess .webix_icon_btn{
    color: #505c83 !important;
}

.s4bt_buttonModifyDetailProcess .webix_img_btn{
    background-color: transparent !important;
    cursor:default !important
}
.s4bt_buttonModifyDetailProcess .webix_icon_btn{
    color: #9CD638 !important;
}

.s4bt_buttonLockDetailProcess .webix_img_btn{
    background-color: transparent !important;
}
.s4bt_buttonLockDetailProcess .webix_icon_btn{
    color: #ee5244 !important;
}




/*------------------------------------*\
    S4BT Header Accordion
\*------------------------------------*/
.s4bt_btnHeaderAccordion{
    height: 36px !important;
    padding: 0 16px;
    border: 2px solid #fff !important;
    border-radius: 24px !important;
    background-color: #fff !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #243256 !important;
    text-transform: uppercase;
    cursor: pointer !important;
}

/* .s4bt_btnHeaderAccordion:hover{
    box-shadow: 0px 0px 8px 1px #ccc;
    -moz-box-shadow: 0px 0px 8px 1px #ccc;
    -webkit-box-shadow: 0px 0px 8px 1px #ccc;
    transition: box-shadow 0.3s ease-in-out;
} */





































/*------------------------------------*\
    S4BT Icon with Text in the Right
\*------------------------------------*/
.s4btIconButtonFooterLogin.webix_el_button button{
    background-color:transparent !important;
    color:#4678aa;
    
}
.s4btIconButtonFooterLogin.webix_el_htmlbutton .webix_type_base{
    background-color:transparent !important;
}
.s4btIconButtonFooterLogin .webix_icon{
    margin-right:8px;
}

/*------------------------------------*\
    S4BT Trigramma Icon Menù
\*------------------------------------*/
.s4btIconMenu button,
.s4btIconMenu button:hover,
.s4btIconMenu button:focus,
.s4btIconMenu button:active{
    width: auto;
    height: auto;
    background-color: #fff;
    cursor: pointer;
}
.s4btIconMenu .webix_icon_btn{
    color: var(--primaryMenuSystem)
}
.s4btIconMenu.webix_control .webix_disabled_box .webix_img_btn{
    color: #94A1B3 !important;
    background-color: #fff !important;
}

/*------------------------------------*\
    S4BT Close SideMenu
\*------------------------------------*/
.s4btcloseButtonSidemenu button{
    border-top-right-radius: 100px !important;
    border-bottom-right-radius: 100px !important;
    border: none;
    background-color: #f0f2f4;
    background: -moz-linear-gradient(top, #f0f2f4 0% , #f0f2f4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f0f2f4), color-stop(1, #f0f2f4));
}
.s4btcloseButtonSidemenu .webix_el_box{
    padding: 0px !important;
    margin: 0px !important
}
.s4btcloseButtonSidemenu .webix_icon_btn {
    text-align: center;
    color: #505c83 !important;
    line-height: .2;
    font-weight: 300;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.s4btcloseButtonSidemenu.webix_el_button{
    display: inline-block;
    vertical-align: bottom !important;
    position: absolute;
    left: 0px;
}

/*------------------------------------*\
    S4BT Side Bottom Menù Mobile
\*------------------------------------*/
.s4btButtonBottomSideMenu button,
.s4btButtonBottomSideMenu button:hover,
.s4btButtonBottomSideMenu button:focus,
.s4btButtonBottomSideMenu button:active{
    background-color: transparent;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--primaryMenuSystem) !important;
}
.s4btButtonBottomSideMenu .webix_icon_btn{
    font-size: 15px;
    color: var(--primaryMenuSystem)
}

.s4btButtonBottomSideMenu.webix_control .webix_disabled_box .webix_img_btn{
    opacity: 0.3;
    color: var(--primaryMenuSystem) !important;
    background-color: transparent !important;
}








/*------------------------------------*\
    S4BT Border Blue Accent
\*------------------------------------*/
.s4btWhiteBorderBlueAccent button{
    border: 2px solid #1452cc !important;
    border-radius: 24px;
    background-color: #fff !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 15px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc !important;
    text-transform: uppercase !important;
    cursor: pointer
}
.s4btWhiteBorderBlueAccent .webix_disabled_box button{
    border: 2px solid #9ab4ce !important;
    border-radius: 24px;
    background-color: #fff !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 15px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #9ab4ce !important;
    text-transform: uppercase !important;
    cursor: pointer
} 























/*------------------------------------*\
    S4BT Circle AccentLight
\*------------------------------------*/
.s4btAccentLightIconAccent.webix_el_button{
    width: auto !important;
}
.s4btAccentLightIconAccent .webix_img_btn{
    text-align: center;
}
.s4btAccentLightIconAccent button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #ddebff !important;
    background: -moz-linear-gradient(top, #ddebff 0% , #ddebff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ddebff), color-stop(1, #ddebff));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btAccentLightIconAccent .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 9px;
    height: 16px !important;
    color: #505c83;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.s4btAccentLightIconAccent .webix_disabled_box .webix_img_btn{
    background: #fff;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btAccentLightIconAccent.webix_disabled_view .webix_icon_btn{
    color: #505c83
}





/*------------------------------------*\
    S4BT Circle Celestial
\*------------------------------------*/
.s4btIconCelestial.webix_el_button,
.s4btIconCelestial .webix_el_box{
    width: auto !important;
}
.s4btIconCelestial .webix_img_btn{
    text-align: center;
}
.s4btIconCelestial button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #e8effc !important;
    background: -moz-linear-gradient(top, #e8effc 0% , #e8effc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e8effc), color-stop(1, #e8effc));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconCelestial .webix_icon_btn {
    font-size: 18px !important;
    display: inline-block;
    text-align: center;
    width: 9px;
    height: 18px !important;
    color: #1452cc;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.s4btIconCelestial .webix_disabled_box .webix_img_btn{
    background: #e8effc;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btIconCelestial.webix_disabled_view .webix_icon_btn{
    color: #1452cc
}























/*------------------------------------*\
    S4BT Text Red Backgr Transp
\*------------------------------------*/
.s4btTextRed{
    vertical-align: middle !important;
}
.s4btTextRed .webix_el_box{
    width: auto !important;
}
.s4btTextRed button{
    width: auto !important;
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: transparent !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #ee5244 !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer !important
}
.s4btTextRed .webix_disabled_box button{
    color: #ee5244 !important;
    background-color: transparent !important;
    opacity: 0.3 !important;
}





/*------------------------------------*\
    S4BT Icon Button Modal Feedback
\*------------------------------------*/
.webix_el_button.s4bt_iconBtnFeddModal{
    margin-top: 0px !important;
}
.s4bt_iconBtnFeddModal .webix_icon_btn{
    height:62px !important;
    color: #4678aa;
    font-size: 48px !important;     
}
.s4bt_iconBtnFeddModal button,
.s4bt_iconBtnFeddModal button:hover{
    background-color: transparent !important;
    width: 48px;
    height: 48px;
    cursor: default;
}
.webix_el_button.s4bt_iconBtnFeddModal,
.s4bt_iconBtnFeddModal .webix_el_box {
    height: 62px !important
} 





/*------------------------------------*\
    S4BT Icon & Text Red
\*------------------------------------*/
.s4btIconTextRed .webix_el_box,
.s4btIconTextRed.webix_el_button{
    width: auto !important;
}
.s4btIconTextRed button{
    width: auto !important;
    height: auto !important;
    font-family: Rubik;
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.4px;
    text-align: center;
    color: #ee5244;
    background-color: #f7f8f9 !important;
    border: none;
    text-transform: uppercase;
    background: -moz-linear-gradient(top, #f7f8f9 0% , #f7f8f9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f7f8f9), color-stop(1, #f7f8f9));
}

.s4btIconTextRed.webix_control .webix_disabled_box .webixtype_base{
    color: #ecc8c3 !important;
    background: #f7f8f9;
    border: none;
}
.s4btIconTextRed.webix_disabled_view.webix_control .webix_icon{
    color: #ecc8c3 !important;
}





/*------------------------------------*\
    S4BT Text & Border Red
\*------------------------------------*/
.s4btRejectButton button{
    width: auto;
    padding-left: 16px;
    padding-right: 16px;
    border: 2px solid #ee5244 !important;
    border-radius: 24px;
    background-color: #fff !important;
    background: -moz-linear-gradient(top, #fff 0%, #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #ee5244 !important;
    text-transform: uppercase
}
.s4bt_button.s4btRejectButton.webix_control.webix_el_button,
.s4btRejectButton .webix_el_box{
    width: auto !important
}
.s4btRejectButton .webix_icon_btn {
    margin-right: 4px;
    color: #ee5244 !important;
    font-size: 16px !important;
}











/*------------------------------------*\
    S4BT Clear Filetr Accent
\*------------------------------------*/
.s4btWhiteClear{
    vertical-align: middle !important;
}
.s4btWhiteClear .webix_el_box{
    width: auto !important;
}
.s4btWhiteClear button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: transparent !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: var(--primaryMenuSystem) !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer
}
.s4btWhiteClear .webix_icon_btn {
    margin-right: 4px;
    color: #ee5244 !important;
    font-size: 16px !important;
}

.s4btWhiteClear .webix_disabled_box button{
    color: #ee5244 !important;
    background-color: #fff !important;
    opacity: 0.3 !important;
}





/*------------------------------------*\
    S4BT Icon & Text Blue Accent
\*------------------------------------*/
.s4btIconTextBlueAccent .webix_el_box,
.s4btIconTextBlueAccent.webix_el_button{
    width: 90px !important;
    float: right !important;
}
.s4btIconTextBlueAccent button,
.s4btIconTextBlueAccent:hover button,
.s4btIconTextBlueAccent button .webix_selected{
    width: 88px !important;
    height: auto !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc;
    background-color: #fff !important;
    border: none;
    text-transform: uppercase;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#fff), color-stop(1, #fff));
}

.s4btIconTextBlueAccent.webix_disabled_view.webix_control .webix_icon {
    color: #1452cc !important;
}
.s4btIconTextBlueAccent .webix_disabled_box .webixtype_base{
    opacity: 0.3;
    color: #1452cc !important;
}





/*------------------------------------*\
    S4BT Icon & Text Blue Accent
\*------------------------------------*/
.s4btIconTextAccent .webix_el_box,
.s4btIconTextAccent.webix_el_button{
    width: auto !important;
    padding-bottom:0;
}
.s4btIconTextAccent button,
.s4btIconTextAccent:hover button{
    width: auto !important;
    height: auto !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.6px;
    text-align: center;
    color: #4678aa;
    background-color: transparent;
    border: none;
    text-transform: uppercase;
    background: -moz-linear-gradient(top, transparent 0% , transparent 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,transparent), color-stop(1, transparent));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.s4btIconTextAccent button:focus {
    width:auto !important;
    padding-top: 38px; 
    padding-bottom: 36px; 
    background-color: #759ec7;
    box-shadow: inset 0  68px #e8ebee;
    -moz-box-shadow: inset 0  68px  #e8ebee;
    -webkit-box-shadow: inset 0  68px #e8ebee;
    -o-box-shadow: inset 0  68px  #e8ebee;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    /* border-left:2px solid #e8ebee !important;
    border-right:1px solid #e8ebee !important; */
}

.s4btIconTextAccent.webix_disabled_view.webix_control .webix_icon {
    color: #4678aa !important;
}
.s4btIconTextAccent .webix_disabled_box .webixtype_base{
    opacity: 0.3;
    color: #4678aa !important;
}





/*------------------------------------*\
    S4BT Blue Accent Light
\*------------------------------------*/
.s4btButtonAccentLight{
    vertical-align: middle !important;
}
.s4btButtonAccentLight .webix_el_box{
    width: auto !important;
}
.s4btButtonAccentLight button{
    width: auto;
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #d2dcf3 !important;
    cursor: default;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.4px;
    color: #1452cc !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}
.s4btButtonAccentLight .webix_img_btn{
    line-height: normal !important
}
.s4btButtonAccentLight .webix_icon_btn{
    width: auto !important;
    height: auto !important;
    font-size: 13px;
    color: #1452cc !important;
}

.s4btButtonAccentLight .webix_disabled_box .webix_img_btn{
    background: #fff;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btButtonAccentLight.webix_disabled_view .webix_icon_btn{
    color: #1452cc
}





/*------------------------------------*\
    S4BT Blue Accent Light Summary
\*------------------------------------*/
.s4btButtonAccentLightChangeSum{
    vertical-align: middle !important;
}
.s4btButtonAccentLightChangeSum button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #d2dcf3 !important;
    cursor: default;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.4px;
    color: #1452cc !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}
.s4btButtonAccentLightChangeSum .webix_img_btn{
    line-height: normal !important
}
.s4btButtonAccentLightChangeSum .webix_icon_btn{
    height: auto !important;
    font-size: 13px;
    color: #1452cc !important;
}

.s4btButtonAccentLightChangeSum .webix_disabled_box button{
    padding-left: 16px;
    padding-right: 16px;
    border: 2px solid #d2dcf3 !important;
    border-radius: 24px;
    background-color: #d2dcf3 !important;
    background: -moz-linear-gradient(top, #d2dcf3 0%, #d2dcf3 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d2dcf3), color-stop(1, #d2dcf3));
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc !important;
    text-transform: uppercase;
    opacity: .6 !important
}





/*------------------------------------*\
    S4BT Blue Accent Light Mobile
\*------------------------------------*/
.s4btIconTextBlueAccentMobile .webix_el_box,
.s4btIconTextBlueAccentMobile.webix_el_button{
    width: auto !important;
}
.s4btIconTextBlueAccentMobile button,
.s4btIconTextBlueAccentMobile:hover button,
.s4btIconTextBlueAccentMobile button .webix_selected{
    width: auto !important;
    height: auto !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc !important;
    background-color: #e8effc !important;
    border: none;
    border-radius:24px !important;
    padding-left: 16px;
    padding-right:16px;
    text-transform: uppercase;
    background: -moz-linear-gradient(top, #e8effc 0% , #e8effc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#e8effc), color-stop(1, #e8effc));
}
.s4btIconTextBlueAccentMobile .webix_icon_btn {
    font-size: 16px;
    width: 20px;
    color: #1452cc;
}

.s4btIconTextBlueAccentMobile.webix_disabled_view.webix_control .webix_icon {
    color: #1452cc !important;
}
.s4btIconTextBlueAccentMobile .webix_disabled_box .webixtype_base{
    opacity: 0.3;
    color: #1452cc !important;
}













/*------------------------------------*\
    S4BT Fake Accordion
\*------------------------------------*/
.s4btFakeAccordion button{
    width: 36px !important;
    height: 24px !important;
    border-radius: 4px;
    border: none;
    background-color: #d9dee3;
    background: -moz-linear-gradient(top, #d9dee3 0% , #d9dee3 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d9dee3), color-stop(1, #d9dee3));
}
.s4btFakeAccordion .webix_icon_button:hover:before {
    background-color: #d9dee3;
    opacity: 1;
    transform: scale(1);
}
.s4btFakeAccordion .webix_icon_button .webix_icon {
    font-size: 16px;
    height: 16px !important;
    line-height: 1.3 !important;
    display: inline-block;
    text-align: center;
    color: #919eac;
}
.s4btFakeAccordion{
    margin-left: 0px !important;
    position: absolute;
    right: 24px;
}

.s4btFakeAccordion.webix_el_icon.s4bt_button.webix_disabled_view{
    cursor: default;
    background-color:transparent !important
}
.s4btFakeAccordion.webix_el_icon.s4bt_button.webix_disabled_view button{
    width: 36px !important;
    height: 24px !important;
    border-radius: 4px;
    border: none;
    background-color: #d9dee3;
    background: -moz-linear-gradient(top, #d9dee3 0% , #d9dee3 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d9dee3), color-stop(1, #d9dee3));
    opacity: 0.3;
}





/*------------------------------------*\
    S4BT Show/Hide Sections
\*------------------------------------*/
.s4btIconShowSections button{
    width: 36px !important;
    height: 24px !important;
    border-radius: 4px;
    border: none;
    background-color: #fff;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
}

.s4btIconShowSections.webix_control.webix_el_button{
    width: auto !important;
    height: auto !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconShowSections .webix_el_box{
    width: auto !important;
    height: auto !important;
}
.s4btIconShowSections .webix_icon_btn {
    font-size: 16px;
    height: 16px !important;
    line-height: 1.3 !important;
    display: inline-block;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #738596;
}
.s4btIconShowSections .webix_icon_button:hover:before {
    background-color: #fff;
    opacity: 1;
    transform: scale(1);
}
.s4btIconShowSections{
    margin-left: 0px !important;
}





/*------------------------------------*\
    S4BT Spreadsheet Button
\*------------------------------------*/
.s4bt_spreadsheetBtn button{
    border-radius: 4px;
    background: -moz-linear-gradient(top, #4678aa 0% , #4678aa 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#4678aa), color-stop(1, #4678aa));
}
.s4bt_spreadsheetBtnBack button{
    border-radius: 4px;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#fff), color-stop(1, #fff));
}
















/*------------------------------------*\
    S4BT Close Page
\*------------------------------------*/
.s4btCloseButton.webix_control.webix_el_button{
    width:auto !important;
    height:auto !important
}
.s4btCloseButton.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
    position: absolute;
    right: 102px;
    margin-left: 0px !important;
    margin-top: 0px !important;
}
.s4btCloseButton .webix_el_box{
    width: auto !important;
    height: auto !important;
}
.s4btCloseButton button{
    max-width: 36px !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ee5244 0% , #ee5244 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ee5244), color-stop(1, #ee5244));
}
.s4btCloseButton .webix_icon_btn {
    width: 6px !important;
    height: 36px !important;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    color: #fff;
    line-height: 2.2;
}
.s4btCloseButton.webix_el_button .webix_img_btn,
.s4btCloseButton.webix_el_button .webix_img_btn_top{
    background-color: #ee5244 !important
}




/*------------------------------------*\
    S4BT Button Show Calendar
\*------------------------------------*/
.s4btIconShowCalendar button{
    width: 36px !important;
    height: 24px !important;
    border-radius: 4px;
    border: none;
    background-color: #d9dee3;
    background: -moz-linear-gradient(top, #d9dee3 0% , #d9dee3 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d9dee3), color-stop(1, #d9dee3));
}
.s4btIconShowCalendar .webix_icon_button:hover:before {
    background-color: #d9dee3;
    opacity: 1;
    transform: scale(1);
}
.s4btIconShowCalendar .webix_icon_button .webix_icon {
    font-size: 16px;
    height: 16px !important;
    line-height: 1.3 !important;
    display: inline-block;
    text-align: center;
    color: #738596;
}
.s4btIconShowCalendar{
    margin-left: 0px !important;
}





/*------------------------------------*\
    S4BT Image Primary
\*------------------------------------*/
.s4btButtonImagePrimary{
    vertical-align: middle !important;
}
.s4btButtonImagePrimary .webix_el_box{
    width: auto !important;
}
.s4btButtonImagePrimary button{
    height: 34px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: transparent !important;
    cursor: default;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}
.s4btButtonImagePrimary .webix_img_btn{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.4 !important;
    letter-spacing: 0.6px;
    color: #5b7895 !important;
    text-transform: uppercase !important;
}





/*------------------------------------*\
    S4BT Icon More
\*------------------------------------*/
.s4btButtonMore button{
    width: 24px;
    height: 24px;
    border-radius: 100px;
    border: none;
    background-color: #e8effc;
    background: -moz-linear-gradient(top, #e8effc 0% , #e8effc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#e8effc), color-stop(1, #e8effc));
}
.s4btButtonMore .webix_icon_btn{
    width: 24px;
    height: auto !important;
    padding: 0 !important;
    padding-top: 3px !important;
    text-align: center !important;
    vertical-align: top !important;
    color: #4678aa;
}
.s4btButtonMore.webix_el_button{
    display: inline-block;
    vertical-align: middle !important;
    width: 24px !important;
    height: 24px !important;
}





/*------------------------------------*\
    S4BT Icon Prev & Next
\*------------------------------------*/
.s4btIconPrevNext.webix_el_icon{
    background-color: transparent !important
}
.s4btIconPrevNext .webix_icon_button .webix_icon{
    width: 24px;
    height: 24px;
    color: #4678aa;
}
.s4btIconPrevNext .webix_icon_button:hover:before {
  background-color: transparent;
  opacity: 1;
  transform: scale(1);
}





















/*------------------------------------*\
    S4BT Icon/Img White
\*------------------------------------*/
.s4btImgWhiteMore button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #fff !important;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btImgWhiteMore.webix_el_button,
.s4btImgWhiteMore .webix_el_box{
    width: auto !important;
}
.s4btImgWhiteMore .webix_img_btn{
    text-align: center;
}
.s4btImgWhiteMore .webix_icon_btn {
    font-size: 18px !important;
    display: inline-block;
    text-align: center;
    width: 24px;
    height: 24px !important;
    color: #4678aa;
    line-height: 1.4;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}
.s4btImgWhiteMore .webix_disabled_box .webix_img_btn{
    background: #fff;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btImgWhiteMore.webix_disabled_view .webix_icon_btn{
    color: #4678aa
}





/*------------------------------------*\
    S4BT Icon More White
\*------------------------------------*/
.s4btIconTips button{
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    border: none;
    background-color: transparent !important;
    background: -moz-linear-gradient(top, transparent 0% , transparent 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(1, transparent));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconTips.webix_el_button,
.s4btIconTips .webix_el_box{
    width: auto !important;
}
.s4btIconTips .webix_img_btn{
    text-align: center;
}
.s4btIconTips .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 16px;
    height: 16px !important;
    color: #4678aa;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.s4btIconTips .webix_disabled_box .webix_img_btn{
    background: transparent;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btIconTips.webix_disabled_view .webix_icon_btn{
    color: #4678aa
}





/*------------------------------------*\
    S4BT Modal Info Icon
\*------------------------------------*/
.s4btModalInfoIcon button{
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    border: none;
    background-color: transparent !important;
    background: -moz-linear-gradient(top, transparent 0% , transparent 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(1, transparent));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btModalInfoIcon.webix_el_button,
.s4btModalInfoIcon .webix_el_box{
    width: auto !important;
    padding-top:11px !important;
}
.s4btModalInfoIcon .webix_img_btn{
    text-align: center;
}
.s4btModalInfoIcon .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 16px;
    height: 16px !important;
    color: #505c83;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.s4btModalInfoIcon .webix_disabled_box .webix_img_btn{
    background: transparent;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btModalInfoIcon.webix_disabled_view .webix_icon_btn{
    color: #505c83
}





/*------------------------------------*\
    S4BT Button Sec Menù Audit
\*------------------------------------*/
.s4btOnlyTexAndIcon button, .s4btOnlyTexAndIcon button:hover,
.s4btOnlyTexAndIcon button:focus, .s4btOnlyTexAndIcon button:active{
    height: auto !important;
    background-color: transparent;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.54;
    letter-spacing: 0.4px;
    color: #4678aa;
    text-align: left;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.s4btOnlyTexAndIconBack button, .s4btOnlyTexAndIconBack button:hover,
.s4btOnlyTexAndIconBack button:focus, .s4btOnlyTexAndIconBack button:active{
    color: #434548;
    background: #fff;
    border: none !important;
    border-radius: 4px;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0.3px;
    text-align: left;
    line-height: 1.8;
    text-transform: uppercase;
}




/*------------------------------------*\
    S4BT Button Reset
\*------------------------------------*/
.s4btResetButton button{
    height: 36px !important;
    border: 2px solid #ee5244 !important;
    border-radius: 24px;
    background-color: #ee5244 !important;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase !important;
    cursor: pointer
}





/*------------------------------------*\
    S4BT Button Green
\*------------------------------------*/
.s4btGreenButton button{
    height: 36px !important;
    border: 2px solid #9cd638 !important;
    border-radius: 24px;
    background-color: #9cd638 !important;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase !important;
    cursor: pointer
}





/*------------------------------------*\
    S4BT Modal Close
\*------------------------------------*/
.s4btModalClose.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
    position: absolute;
    top: 50%;
    right: 32px;
    transform: translateY(-50%);
}
.s4btModalClose .webix_el_box{
    width: auto !important;
    height: auto !important;
}
.s4btModalClose button{
    max-width: 36px !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ee5244 0% , #ee5244 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ee5244), color-stop(1, #ee5244));
}
.s4btModalClose .webix_icon_btn {
    width: 6px !important;
    height: 36px !important;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    color: #fff;
    line-height: 2.2;
}
.s4btModalClose.webix_el_button .webix_img_btn,
.s4btModalClose.webix_el_button .webix_img_btn_top{
    background-color: #ee5244 !important
}





/*------------------------------------*\
    S4BT Modal Close Mobile
\*------------------------------------*/
.s4btModalCloseMobile.webix_control.webix_el_button {
    width: auto !important;
    height: auto !important;
    position: absolute;
    right: 0;
}
.s4btModalCloseMobile.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
    position: absolute;
    right: 0px;
    margin-left: 0px !important;
    margin-top: 0px !important;
}
.s4btModalCloseMobile .webix_el_box{
    width: auto !important;
    height: auto !important;
}
.s4btModalCloseMobile button{
    max-width: 48px !important;
    width: 48px !important;
    height: 40px !important;
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
    background: -moz-linear-gradient(top, #fef7f6 0% , #fef7f6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#fef7f6), color-stop(1, #fef7f6));
    color: #ee5244 !important;
}
.s4btModalCloseMobile .webix_icon_btn {
    width: 28px !important;
    height: 36px !important;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    color: #ee5244 !important;
    line-height: 2.5;
}





/*------------------------------------*\
    S4BT Modal Fake Accordion Mobile
\*------------------------------------*/
.s4btModalFakeAccMobile.webix_control.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btModalFakeAccMobile.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
    margin-left: 0px !important;
    margin-top: 0px !important;
}
.s4btModalFakeAccMobile .webix_el_box{
    width: auto !important;
    height: auto !important;
}
.s4btModalFakeAccMobile button{
    max-width: 48px !important;
    width: 48px !important;
    height: 40px !important;
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
    background: -moz-linear-gradient(top, #ffffff 0% , #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ffffff), color-stop(1, #ffffff));
    color: #243256 !important;
}
.s4btModalFakeAccMobile .webix_icon_btn {
    font-size: 22px !important;
    display: inline-block;
    text-align: center;
    color: #243256 !important;
    line-height: 2.5;
}





/*------------------------------------*\
    S4BT Modal Multicombo
\*------------------------------------*/
.s4btWhiteTextBlueAccentModal button{
    width: auto !important;
    height: 24px !important;
    padding-left: 12px;
    padding-right: 12px;
    border: none !important;
    border-radius: 12px;
    background-color: #fff !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 11px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27 !important;
    letter-spacing: 0.4px !important;
    text-align: center;
    color: #1452cc !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer
}

.s4btWhiteTextBlueAccentModal .webix_disabled_box button{
    color: #8D9196 !important;
}
.s4btWhiteTextBlueAccentModal .webixtype_base{
    width: auto !important
}





/*------------------------------------*\
    S4BT Button More
\*------------------------------------*/
.s4btIconMoreModal button{
    width: 24px;
    height: 24px;
    border-radius: 100px;
    border: none;
    background-color: #fff;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#fff), color-stop(1, #fff));
}
.s4btIconMoreModal .webix_icon_btn {
    width: 12px !important;
    height: 8px !important;
    font-size: 16px;
    padding: 0 !important;
    text-align: center !important;
    vertical-align: middle !important;
    color: #4678aa;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(50%, 50%);
}
.s4btIconMoreModal.webix_el_button{
    display: inline-block;
    vertical-align: bottom !important;
    width: 24px;
    height: 40px !important;
}











/*------------------------------------*\
    S4BT Button Icon Grey
\*------------------------------------*/
.s4btIconGrey.webix_control.webix_el_button{
    width:auto !important;
    cursor:pointer;
}
.s4btIconGrey .webix_img_btn{
    background-color: transparent !important
}
.s4btIconGrey .webix_icon_btn{
    font-size: 18px;
    color: #738596;
    line-height: 2.2;
}





/*------------------------------------*\
    S4BT Grey Text
\*------------------------------------*/
.s4btTextGrey.webix_control.webix_el_button{
    width: auto !important;
    height: auto !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btTextGrey .webix_el_box{
    width: auto !important;
    height: auto !important;
}
.s4btTextGrey .webixtype_base{
    background-color: transparent !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: 0.3px;
    color: #738596 !important;
    text-transform: uppercase;
}
.s4btTextGrey .webixtype_base:focus{
    height:48px !important;
    color: #4678aa !important;
    box-shadow: inset 0 44px 0 #fff;
    border: none !important;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    background-image: linear-gradient(to bottom, #fff , #759ec7) !important;
}





/*------------------------------------*\
    S4BT Button Modal Not Allowed
\*------------------------------------*/
.s4bt_FeedbackNotAllowed{
    background-color: transparent !important
}
.s4bt_FeedbackNotAllowed.webix_el_button{
    height:auto !important;
}
.s4bt_FeedbackNotAllowed .webix_el_box{
    height:140px !important;
}
.s4bt_FeedbackNotAllowed .webix_img_btn_top .webix_icon{
    width: auto !important;
    height: auto !important;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    color: #ee5244;
    font-size:48px;
    padding-left: 16px !important;
    background-color:transparent !important
}
.s4bt_FeedbackNotAllowed .webix_img_btn_top:hover{
    background-color:transparent !important
}
.s4bt_FeedbackNotAllowed .webix_img_btn_text{
    font-family:Rubik;
    font-size:24px;
    text-align: center;
    font-weight: 400;
    color:#ee5244 !important
}

/*------------------------------------*\
    S4BT Button Modal Warning 
\*------------------------------------*/
.s4bt_FeedbackWarning{
    background-color: transparent !important
}
.s4bt_FeedbackWarning.webix_el_button{
    height:auto !important;
}
.s4bt_FeedbackWarning .webix_img_btn_top .webix_icon{
    width: auto !important;
    height: auto !important;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    color: #fbbf3c;
    font-size:48px;
    padding-left: 16px !important;
    background-color:transparent !important
}
.s4bt_FeedbackWarning .webix_img_btn_top:hover{
    background-color:transparent !important
}
.s4bt_FeedbackWarning .webix_img_btn_text{
    font-family:Rubik;
    font-size:24px;
    text-align: center;
    font-weight: 400;
    color:#fbbf3c !important
}

/*------------------------------------*\
	S4BT Button Modal Allowed
\*------------------------------------*/
.s4bt_FeedbackAllowed{
    background-color: transparent !important
}
.s4bt_FeedbackAllowed.webix_el_button{
    height:auto !important;
}
.s4bt_FeedbackAllowed .webix_img_btn_top .webix_icon{
    width: auto !important;
    height: auto !important;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    color: #9cd638;
    font-size:48px;
    padding-left: 16px !important;
    background-color:transparent !important
}
.s4bt_FeedbackAllowed .webix_img_btn_top:hover{
    background-color:transparent !important
}
.s4bt_FeedbackAllowed .webix_img_btn_text{
    font-family:Rubik;
    font-size:24px;
    text-align: center;
    font-weight: 400;
    color:#9cd638 !important
}

/*------------------------------------*\
    S4BT Button Modal Default
\*------------------------------------*/
.s4bt_FeedbackDefault{
    background-color: transparent !important
}
.s4bt_FeedbackDefault.webix_el_button{
    height:auto !important;
}
.s4bt_FeedbackDefault .webix_img_btn_top .webix_icon{
    width: auto !important;
    height: auto !important;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    color: #505c83;
    font-size:48px;
    padding-left: 16px !important;
    background-color:transparent !important
}
.s4bt_FeedbackDefault .webix_img_btn_top:hover{
    background-color:transparent !important
}
.s4bt_FeedbackDefault .webix_img_btn_text{
    font-family:Rubik;
    font-size:24px;
    text-align: center;
    font-weight: 400;
    color:#505c83 !important
}





/*------------------------------------*\
    S4BT Go Back Button Accent Text
\*------------------------------------*/
.s4btIconTextAccentModal .webix_el_box,
.s4btIconTextAccentModal.webix_el_button{
    width: auto;
}
.s4btIconTextAccentModal button{
    width: auto;
    height: auto;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    text-transform: uppercase;
    line-height: 2;
    letter-spacing: 0.6px;
    border: none;
    padding-left: 8px;
    padding-right: 8px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    background-color: #fff !important;
    background: -moz-linear-gradient(top, #fff 0%, #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    color: #1452cc
}

.s4btIconTextAccentModal.webix_disabled_view.webix_control .webix_icon {
    color: #1452cc !important;
}
.s4btIconTextAccentModal .webix_disabled_box .webixtype_base{
    opacity: 0.3;
    color: #1452cc !important;
}





/*------------------------------------*\
    S4BT Remove User
\*------------------------------------*/
.s4btModalRemoveUser.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btModalRemoveUser .webix_el_box{
    width: auto !important;
    height: auto !important;
    
}
.s4btModalRemoveUser button{
    max-width: 24px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #738596 0% , #738596 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#738596), color-stop(1, #738596));
}
.s4btModalRemoveUser .webix_icon_btn {
    max-width: 24px !important;
    width: 24px !important;
    height: 24px;
    color: #fff;
    font-size: 14px;
    vertical-align: top;
    line-height: 1.8;
}
.s4btModalRemoveUser.webix_el_button .webix_img_btn,
.s4btModalRemoveUser.webix_el_button .webix_img_btn_top{
    background-color: #738596 !important
}





/*------------------------------------*\
    S4BT Cancel Icon
\*------------------------------------*/
.s4btIconCancel.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btIconCancel .webix_el_box{
    width: auto !important;
    height: auto !important;
    padding-top:32px;
}
.s4btIconCancel button{
    max-width: 24px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ddebff 0% , #ddebff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ddebff), color-stop(1, #ddebff));
}
.s4btIconCancel .webix_icon_btn {
    max-width: 24px !important;
    width: 24px !important;
    height: 24px;
    color: #ee5244;
    font-size: 14px;
    vertical-align: top;
    line-height: 1.8;
}
.s4btIconCancel.webix_el_button .webix_img_btn,
.s4btIconCancel.webix_el_button .webix_img_btn_top{
    background-color: #e8effc !important
}





/*------------------------------------*\
    S4BT Modify Icon Mail
\*------------------------------------*/
.s4btIconModifyMail.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btIconModifyMail .webix_el_box{
    width: auto !important;
    height: auto !important;
    padding-top: 6px;
}
.s4btIconModifyMail button{
    max-width: 24px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ddebff 0% , #ddebff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ddebff), color-stop(1, #ddebff));
}
.s4btIconModifyMail .webix_icon_btn {
    max-width: 24px !important;
    width: 24px !important;
    height: 24px;
    color: #7e89b3;
    font-size: 14px;
    vertical-align: top;
    line-height: 1.8;
}
.s4btIconModifyMail.webix_el_button .webix_img_btn,
.s4btIconModifyMail.webix_el_button .webix_img_btn_top{
    background-color: #e8effc !important
}





/*------------------------------------*\
    S4BT Cancel Icon Mail
\*------------------------------------*/
.s4btIconCancelMail.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btIconCancelMail .webix_el_box{
    width: auto !important;
    height: auto !important;
    padding-top: 6px;
}
.s4btIconCancelMail button{
    max-width: 24px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ddebff 0% , #ddebff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ddebff), color-stop(1, #ddebff));
}
.s4btIconCancelMail .webix_icon_btn {
    max-width: 24px !important;
    width: 24px !important;
    height: 24px;
    color: #ee5244;
    font-size: 14px;
    vertical-align: top;
    line-height: 1.8;
}
.s4btIconCancelMail.webix_el_button .webix_img_btn,
.s4btIconCancelMail.webix_el_button .webix_img_btn_top{
    background-color: #e8effc !important
}




/*------------------------------------*\
    S4BT Mail Accent Icon
\*------------------------------------*/
.s4btIconMailAccent.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btIconMailAccent .webix_el_box{
    width: auto !important;
    height: auto !important;
}
.s4btIconMailAccent button{
    max-width: 28px !important;
    width: 28px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ffffff 0% , #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ffffff), color-stop(1, #ffffff));
}
.s4btIconMailAccent .webix_icon_btn {
    max-width: 28px !important;
    width: 28px !important;
    height: 24px;
    color: #243256;
    font-size: 24px;
    vertical-align: top;
}
.s4btIconMailAccent.webix_el_button .webix_img_btn,
.s4btIconMailAccent.webix_el_button .webix_img_btn_top{
    background-color: #ffffff !important
}



/*------------------------------------*\
    S4BT Move Rows
\*------------------------------------*/
.s4btIconMoveRows.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btIconMoveRows .webix_el_box{
    width: auto !important;
    height: auto !important;
    padding-top:32px;
}
.s4btIconMoveRows button{
    max-width: 24px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ffffff 0% , #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ffffff), color-stop(1, #ffffff));
    cursor:default;
}
.s4btIconMoveRows .webix_icon_btn {
    max-width: 24px !important;
    width: 24px !important;
    height: 24px;
    color: #505c83;
    font-size: 14px;
    vertical-align: top;
    line-height: 1.8;
    cursor:default;
}
.s4btIconMoveRows.webix_el_button .webix_img_btn,
.s4btIconMoveRows.webix_el_button .webix_img_btn_top{
    background-color: #ffffff !important;
    cursor:default;
}

.s4btIconMoveRows.webix_icon{
    max-width: 24px !important;
    width: 24px !important;
    height: 24px;
    color: #505c83 !important;
    font-size: 14px;
    vertical-align: top;
    line-height: 1.8;
}









/*------------------------------------*\
    S4BT Report Accent Icon
\*------------------------------------*/
.s4btIconReportAccent.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btIconReportAccent .webix_el_box{
    width: auto !important;
    height: auto !important;
    padding-top:32px;
}
.s4btIconReportAccent button{
    max-width: 28px !important;
    width: 28px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ffffff 0% , #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ffffff), color-stop(1, #ffffff));
}
.s4btIconReportAccent .webix_icon_btn {
    max-width: 28px !important;
    width: 28px !important;
    height: 24px;
    color: #243256;
    font-size: 24px;
    vertical-align: top;
}
.s4btIconReportAccent.webix_el_button .webix_img_btn,
.s4btIconReportAccent.webix_el_button .webix_img_btn_top{
    background-color: #ffffff !important
}


/*------------------------------------*\
    S4BT Report Red Icon
\*------------------------------------*/
.s4btIconReportRed.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btIconReportRed .webix_el_box{
    width: auto !important;
    height: auto !important;
    padding-top:32px;
}
.s4btIconReportRed button{
    max-width: 28px !important;
    width: 28px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #ffffff 0% , #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#ffffff), color-stop(1, #ffffff));
}
.s4btIconReportRed .webix_icon_btn {
    max-width: 28px !important;
    width: 28px !important;
    height: 24px;
    color: #ee5244;
    font-size: 24px;
    vertical-align: top;
}
.s4btIconReportReds4btIconReportRed.webix_el_button .webix_img_btn,
.s4btIconReportAccent.webix_el_button .webix_img_btn_top{
    background-color: #ffffff !important
}


/*------------------------------------*\
    S4BT More Icon
\*------------------------------------*/
.s4btIconMore.s4bt_button.webix_el_button {
    width: auto !important;
    height: auto !important;
}
.s4btIconMore .webix_el_box{
    width: auto !important;
    height: auto !important;
    padding-top:32px;
}
.s4btIconMore button{
    max-width: 24px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    background: -moz-linear-gradient(top, #e8effc 0% , #e8effc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#e8effc), color-stop(1, #e8effc));
}
.s4btIconMore .webix_icon_btn {
    max-width: 24px !important;
    width: 24px !important;
    height: 24px;
    color: #4678aa;
    font-size: 14px;
    vertical-align: top;
    line-height: 1.8;
}
.s4btIconMore.webix_el_button .webix_img_btn,
.s4btIconMore.webix_el_button .webix_img_btn_top{
    background-color: #e8effc !important
}





/*------------------------------------*\
    S4BT Query Graph Button
\*------------------------------------*/
.s4btQueryGraphsButton .webix_img_btn_top{
    background-color: transparent !important;
    border: 1px solid #d9dee3 !important;
    border-radius: 2px !important;
}
.s4btQueryGraphsButton .webix_img_btn_text{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2 !important;
    letter-spacing: 0.6px;
    text-align: center;
    text-transform: uppercase;
    color: #8d9196;
}
.s4btQueryGraphsButton .webix_img_btn_top .webix_icon{
    font-size: 24px;
    color: #919eac !important;
    position: absolute;
    top: 12px !important;
    left: 50%;
    transform: translateX(-50%);
    margin-left: -4px !important;
}
.s4btQueryGraphsButton .webix_img_btn_top:hover{
    background-color:transparent !important
}
.s4btQueryGraphsButton .webix_image{
    margin-top: 6px;
}









.s4btQueryGraphsButtonSel .webix_img_btn_top{
    background-color: #ddebff !important;
    border: 1px solid #ddebff !important;
    border-radius: 2px;
}
.s4btQueryGraphsButtonSel .webix_img_btn_text{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2 !important;
    letter-spacing: 0.6px;
    text-align: center;
    text-transform: uppercase;
    color: #505c83 !important;
}
.s4btQueryGraphsButtonSel .webix_img_btn_top .webix_icon{
    font-size: 24px;
    color: #505c83 !important;
    position: absolute;
    top: 12px !important;
    left: 50%;
    transform: translateX(-50%);
    margin-left: -4px !important;
}
.s4btQueryGraphsButtonSel .webix_img_btn_top:hover{
    background-color: #ddebff !important;
}
.s4btQueryGraphsButtonSel .webix_image{
    margin-top: 6px;
}





















/* Cancel Button Red Text Enabled */
.s4btCancelRedText button{
    width: auto;
    padding-left: 16px;
    padding-right: 16px;
    border: 2px solid #fff;
    border-radius: 24px;
    background-color: #fff !important;
    background: -moz-linear-gradient(top, #fff 0%, #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #EE5244;
    text-transform: uppercase
}
/* Save Button Blue Accent Disabled */
.s4btCancelRedText .webix_disabled_box button{
    width: auto;
    padding-left: 16px;
    padding-right: 16px;
    border: 2px solid #fff !important;
    border-radius: 24px;
    background-color: #fff !important;
    background: -moz-linear-gradient(top, #fff 0%, #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #EE5244 !important;
    opacity: 0.3;
    text-transform: uppercase
}































/* Button Select of Multicombo Popup */
.s4btSelectButtonPopup button{
    width: auto;
    padding-left: 16px;
    padding-right: 16px;
    border: 2px solid #1452cc !important;
    border-radius: 24px;
    background-color: #1452cc !important;
    background: -moz-linear-gradient(top, #1452cc 0%, #1452cc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #1452cc), color-stop(1, #1452cc));
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}





/* Button Feedback Checked Modal */
.s4btCheckedButtonModal button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #9CD638 !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer
}

/* Button Feedback Email Sent Modal */
.s4btEmailSentButtonModal button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #4678AA !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer
}





/* Button Close Setup Mobile */
.s4btCloseSetupMobile button{
    border-top-left-radius: 50%;
    border-bottom-left-radius: 50%;
    border: none;
    background-color: #fff !important;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
}

.s4btCloseSetupMobile.webix_el_button,
.s4btCloseSetupMobile .webix_el_box{
    width: auto !important;
    float: right;
}


.s4btCloseSetupMobile .webix_icon_btn {    
    width: 56px;
    max-width: 36px !important;
    height: 16px !important;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    color: #505c83;
    line-height: 0.8;
}

.s4btCloseSetupMobile .webix_disabled_box .webix_img_btn{
    background: #fef7f6;
    border: none;
    text-shadow: none;
    opacity: .3
}

.s4btCloseSetupMobile.webix_disabled_view .webix_icon_btn{
    color: #4678aa
}











/* Un-Lock User Icon Button Modal Footer */
.s4btIconFooterLockedMobile button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #fef7f6 !important;
    background: -moz-linear-gradient(top, #fef7f6 0% , #fef7f6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fef7f6), color-stop(1, #fef7f6));
}

.s4btIconFooterLockedMobile.webix_el_button,
.s4btIconFooterLockedMobile .webix_el_box{
    width: auto !important;
    padding-right: 16px;
    padding-top: 8px;
    float: right;
}


.s4btIconFooterLockedMobile .webix_icon_btn {    
    width: 52px;
    max-width: 36px !important;
    height: 16px !important;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    color: #ee5244;
    line-height: 0.8;
}

.s4btIconFooterLockedMobile .webix_disabled_box .webix_img_btn{
    background: #fef7f6;
    border: none;
    text-shadow: none;
    opacity: .3
}

.s4btIconFooterLockedMobile.webix_disabled_view .webix_icon_btn{
    color: #ee5244
}





/* Button Back White */
.s4btWhiteIcon button{
    width: 16px !important;
    border: none;
    background-color: transparent !important;
    background: -moz-linear-gradient(top, transparent 0% , transparent 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(1, transparent));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btWhiteIcon.webix_el_button,
.s4btWhiteIcon .webix_el_box{
    width: auto !important;
}
.s4btWhiteIcon .webix_img_btn{
    text-align: center;
}
.s4btWhiteIcon .webix_icon_btn {
    font-size: 20px !important;
    display: inline-block;
    text-align: center;
    width: 9px;
    height: 16px !important;
    color: #e4e4e4;
    position: absolute;
    top: 50%;
    left: 40%;
    transform: translate(-50%, -50%)
}
.s4btWhiteIcon .webix_disabled_box .webix_img_btn{
    background: transparent;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btWhiteIcon.webix_disabled_view .webix_icon_btn{
    color: #e4e4e4
}










/* Button Chat */
.s4bt_buttonModalChatIcon.webix_window{
    width: 88px !important;
    height: 88px !important;
	border:none !important;
	background-color: transparent;
    box-shadow: none;
}
.s4bt_buttonModalChatIcon.webix_win_content{
    width: 88px !important;
    height: 88px !important;
	background-color: transparent;
}
.s4bt_buttonModalChatIcon.webix_view .webix_win_head {
    width: 88px !important;
    height: 88px !important;
    border-bottom: none !important;
    background-color: transparent !important;
}
.s4btModalChatIcon.webix_control.webix_el_button,
.s4btModalChatIcon .webix_el_box{
    width: 88px !important;
    height: 88px !important;
    background-color: transparent;
}
.s4btModalChatIcon.webix_el_button button,
.s4btModalChatIcon.webix_view button{
    border-width: 0px;
    background-color: transparent;
}
.s4btModalChatIcon .webix_img_btn_abs .webix_icon {
    width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 1.2;
    color: #505c83;
    padding: 13px;
    background-color: #f7f8f9;
    border-radius: 100%;
    box-shadow: 0 0 16px 8px rgba(210, 210, 210, 0.5);
    position: relative;
    top: 0;
    left: 8px;
}
.s4btModalChatIcon .webix_badge {
    width: 20px;
    height: 20px;
    background-color: #f5007a;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: normal;
    text-align: center;
    color: #FFFFFF;
    border-radius: 11px;
    min-width: 22px;
    box-sizing: border-box;
    padding: 0 4px;
    text-align: center;
    line-height: 22px;
    position: absolute;
    right: 14px;
    top: 14px;
} 




















.s4btButtonAccent button{
    height: auto;
    border: 2px solid #1452cc !important;
    border-radius: 24px;
    background-color: #1452cc !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase !important;
    cursor: pointer;
    padding:0px 24px;
}

.s4btButtonAccent .webix_disabled_box button{
    height: auto;
    border: 2px solid #bccbed !important;
    border-radius: 24px;
    background-color: #bccbed !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 15px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase !important;
    cursor: pointer
} 





.s4bt_headerAccordionIconModify{
    width: 24px;
    height: 24px;
    border-radius: 100px;
    border: none;
    background-color: #e9effb;
    font-size: 12px;
    color: #5277a6;
    text-align: center;
    line-height: 2;
    position: absolute;
    top: 2px;
    margin-left: 16px;
    background: -moz-linear-gradient(top, #e9effb 0% , #e9effb 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#e9effb), color-stop(1, #e9effb));
}







.s4btIconAccentMore button{
    width: 24px;
    height: 24px;
    border-radius: 100px;
    border: none;
    background-color: #e8effc;
    background: -moz-linear-gradient(top, #e8effc 0% , #e8effc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#e8effc), color-stop(1, #e8effc));
}

.s4btIconAccentMore .webix_icon_btn{
    width: 16px;
    height: auto !important;
    padding: 0 !important;
    padding-top: 1px !important;
    text-align: center !important;
    vertical-align: top !important;
    color: #1452cc;
}

.s4btIconAccentMore.webix_el_button{
    display: inline-block;
    vertical-align: bottom !important;
    width: 24px;
    height: 40px !important;
    float: right;
}











.s4btCelestialAccent button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #1452cc !important;
    cursor: default;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.4px;
    color: #fff !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer
}

.s4btCelestialAccent .webix_disabled_box button{
    background-color: #bccbed !important;
    color: #fff !important;
} 
.s4btDelete button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #ee5244 !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer
}


.s4btDelete,
.s4btCelestialAccent,
.s4btBlue,
.s4btButtonAccentLight,
.s4btButtonImageAccentLight,
.s4btButtonImagePrimary{
    vertical-align: middle !important;
}

.s4btCelestialAccent .webix_el_box,
.s4btDelete .webix_el_box,
.s4btBlue .webix_el_box,
.s4btButtonAccentLight .webix_el_box,
.s4btButtonImageAccentLight .webix_el_box,
.s4btButtonImagePrimary .webix_el_box{
    width: auto !important;
}














.s4btIconRedLock button{
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    border: none;
    background-color: #fef7f6 !important;
    background: -moz-linear-gradient(top, #fef7f6 0% , #fef7f6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fef7f6), color-stop(1, #fef7f6));
}

.s4btIconRedLock.webix_el_button,
.s4btIconRedLock .webix_el_box{
    width: auto !important;
}

.s4btIconRedLock .webix_img_btn{
    text-align: center;
} 

.s4btIconRedLock .webix_icon_btn {    
    width: 24px;
    height: 16px !important;
    font-size: 12px;
    display: inline-block;
    text-align: center;
    color: #ee5244;
    line-height: 0.5;
    text-align: center
}

.s4btIconRedLock .webix_disabled_box .webix_img_btn{
    background: #fef7f6;
    border: none;
    text-shadow: none;
    opacity: .3
}

.s4btIconRedLock.webix_disabled_view .webix_icon_btn{
    color: #ee5244
}





.s4btIconRedInvalid button{
    width: 24px !important;
    height: 24px !important;
    border-radius: 100px;
    border: none;
    background-color: #fef7f6 !important;
    background: -moz-linear-gradient(top, #fef7f6 0% , #fef7f6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fef7f6), color-stop(1, #fef7f6));
    cursor: default !important;
}

.s4btIconRedInvalid.webix_el_button,
.s4btIconRedInvalid .webix_el_box{
    width: auto !important;
}

.s4btIconRedInvalid .webix_img_btn{
    text-align: center;
} 

.s4btIconRedInvalid .webix_icon_btn {    
    width: 24px;
    height: 16px !important;
    font-size: 12px;
    display: inline-block;
    text-align: center;
    color: #ee5244;
    line-height: 0.5;
    text-align: center
}

.s4btIconRedInvalid .webix_disabled_box .webix_img_btn{
    background: #fef7f6;
    border: none;
    text-shadow: none;
    opacity: .3
}

.s4btIconRedInvalid.webix_disabled_view .webix_icon_btn{
    color: #ee5244
}



















.s4btIconPrimary button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #e8effc !important;
    background: -moz-linear-gradient(top, #e8effc 0% , #e8effc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e8effc), color-stop(1, #e8effc));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.s4btIconPrimary.webix_el_button,
.s4btIconPrimary .webix_el_box{
    width: auto !important;
}

.s4btIconPrimary .webix_img_btn{
    text-align: center;
}

.s4btIconPrimary .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 24px;
    height: 16px !important;
    /* vertical-align: middle; */
    color: #4678aa !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.s4btIconPrimary .webix_disabled_box .webix_img_btn{
    background: #e8effc;
    border: none;
    text-shadow: none;
    opacity: .3
}

.s4btIconPrimary.webix_disabled_view .webix_icon_btn{
    color: #4678aa !important
}

.s4btBlue button{
    width: auto !important;
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #1452cc !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}


.s4btBlueIconExport button{
    width: 24px;
    height: 24px;
    border-radius: 100px;
    border: none;
    background-color: #fff;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#fff), color-stop(1, #fff));
}

.s4btBlueIconExport .webix_icon_btn{
    height: 29px !important;
    padding: 0 !important;
    padding-top: 3px !important;
    text-align: center !important;
    vertical-align: middle !important;
    color: #4678aa;
}

.s4btBlueIconExport.webix_el_button{
    display: inline-block;
    vertical-align: bottom !important;
    width: 24px;
    height: 32px !important;
}






















.s4bt_textPrevUpdateFooterModal{
    vertical-align: top;
    padding-left: 8px;
}

.s4bt_textPrevNextUpdateFooterModal{
    vertical-align: top;
    padding-right: 8px;
}

.s4bt_iconPrevNextUpdateFooterModal{
    font-size: 24px;
}









.s4btClearFilter button{
    background-color: #e8ebee;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #5b7895 !important;
    background: -moz-linear-gradient(top, #e8ebee 0% , #e8ebee 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#e8ebee), color-stop(1, #e8ebee));
}

.s4btClearFilter .webix_icon_btn {
    font-size: 24px;
    color: #4678aa;
    margin-right: 8px;
    padding-top: 8px
}

.s4btSelectedBreadcrumbs.webix_el_s4btlabel{
    width: auto !important;
    height: auto !important;
    margin-right: 8px;
    font-family: Rubik;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: 0.3px;
    color: #424548;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.s4btIconBreadcrumbs.webix_el_s4btlabel{
    width: auto !important;
    height: auto !important;
    margin-right: 8px;
    font-family: Rubik;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: 0.3px;
    color: #919EAC;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.s4btLinkedBreadcrumbs.webix_el_s4btlabel{
    width: auto !important;
    height: auto !important;
    margin-right: 8px;
    font-family: Rubik;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: 0.3px;
    color: #424548;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.s4btChooseVisualKanban button,
.s4btChooseVisualKanban:hover button{
    width: auto;
    height: auto;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.54;
    letter-spacing: 0.4px;
    color: #4678aa;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    background-color: transparent
}

.s4btChooseVisualKanban.webix_el_button{
    width: auto !important
}

.s4btChooseVisualKanban .webix_el_box{
    width: auto !important;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.s4btChooseVisualKanban .webixtype_base:focus{
    background-color: transparent;
} 


.s4btFooterCardKanban button,
.s4btFooterCardKanban:hover button{
    width: auto !important;
    height: auto !important;
    border-radius: 4px;
    background-color: #e8effc;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #4678aa;
    padding: 4px 12px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.s4btFooterCardKanban.webix_control.webix_el_button,
.s4btFooterCardKanban .webix_el_box{
    width: auto !important
}

.s4btFooterCardKanban .webixtype_base:focus{
    background-color: #e8effc;
}

.s4btIconFooterCardKanban.webix_el_button .webix_img_btn{
    width: auto !important;
    height: auto !important;
    border-radius: 4px;
    line-height: normal !important;
    background-color: #e8effc;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.s4btIconFooterCardKanban .webix_icon_btn{
    width: 39px !important;
    height: 21px !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    padding-left: 4px;
    color: #4678aa;
}

.s4btIconFooterCardKanban.webix_control.webix_el_button,
.s4btIconFooterCardKanban .webix_el_box{
    width: auto !important
}

.s4btIconFooterCardKanban .webixtype_base:focus{
    background-color: #e8effc;
}



.s4btButtonPhaseCardKanban button,
.s4btButtonPhaseCardKanban:hover button{ 
    width: auto !important;
    height: auto !important;
    border-radius: 10px;
    background-color: #d1ddeb;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #4678aa;
    padding: 4px 12px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    border: 1px solid #d1ddeb !important;
}

.s4btButtonPhaseCardKanban .webixtype_base:focus{
    background-color: #d1ddeb;
}

.s4btButtonPhaseCardKanban .webix_control.webix_el_button {
    width: auto !important;
}

.s4btButtonPhaseCardKanban .webix_el_box{
    width: auto !important;
}

.s4btButtonPhaseActiveCardKanban button,
.s4btButtonPhaseActiveCardKanban:hover button{ 
    width: auto !important;
    height: auto !important;
    border-radius: 10px;
    background-color: #d1ddeb;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #1452cc;
    padding: 4px 12px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    border: 1px solid #d1ddeb !important;
}

.s4btButtonPhaseActiveCardKanban .webixtype_base:focus{
    background-color: #d1ddeb;
}

.s4btButtonPhaseActiveCardKanban .webix_control.webix_el_button {
    width: auto !important;
}

.s4btButtonPhaseActiveCardKanban .webix_el_box{
    width: auto !important;
}











/* S4BT Button Phase Activity Card */
.s4bt_heightAuto.webix_toolbar .webixtype_base {
    border: none;
}

.s4bt_finishedPhaseButtonCard .webix_el_box{
    width: auto !important;
    height: auto !important
}

.s4bt_finishedPhaseButtonCard.webix_control.webix_el_button{
    width: auto !important;
    height: auto !important;
}
  
.s4bt_finishedPhaseButtonCard .s4bt_textPhaseCard{
    text-align: left;
    display: inline-block;
    vertical-align: middle;
}
  
.s4bt_finishedPhaseButtonCard button{
    width: auto !important;
    height: auto !important;
    font-family: Rubik;
    font-size: 11px;
    font-weight: medium;
    font-stretch: normal;
    letter-spacing: 0.4;
    background-color: #d1ddeb !important;
    border: 1px solid #d1ddeb !important;
    border-radius:32px;
    text-align: left;
    text-transform:uppercase;
    color: #1452CC;
    padding:4px 16px
}



.s4bt_notFinishedPhaseButtonCard .webix_el_box{
    width: auto !important;
    height: auto !important
}

.s4bt_notFinishedPhaseButtonCard.webix_control.webix_el_button{
    width: auto !important;
    height: auto !important;
}
  
.s4bt_notFinishedPhaseButtonCard .s4bt_textPhaseCard{
    text-align: left;
    display: inline-block;
    vertical-align: middle;
}
  
.s4bt_notFinishedPhaseButtonCard button{
    width: auto !important;
    height: auto !important;
    font-family: Rubik;
    font-size: 11px;
    font-weight: medium;
    font-stretch: normal;
    letter-spacing: 0.4;
    background-color: #fff !important;
    border: 1px solid #1452CC !important;
    border-radius:32px;
    text-align: left;
    text-transform:uppercase;
    color: #1452CC;
    padding:4px 16px
}



.s4bt_secondRowButton{
    width: auto !important;
    height: auto !important;
    font-family: Rubik;
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    letter-spacing: 0.4;
    text-align: left;
    text-transform:none;
    color: #424548;
    margin:0
}












.s4btTextBlueAccent button{
    border: 2px solid #fff !important;
    border-radius: 24px;
    background-color: #fff !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 15px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc !important;
    text-transform: uppercase !important;
    cursor: pointer
}
.s4btTransparentTextBlueAccent button{
    border-radius: 24px;
    background-color: transparent !important;
    cursor: default;
    font-family: Rubik !important;
    font-size: 13px;
    font-weight: 500 !important;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 0.6px;
    text-align: center;
    color: #1452cc !important;
    text-transform: uppercase !important;
    cursor: pointer
}
.s4btTransparentTextBlueAccent .webix_disabled_box button{
    opacity: .3;
}





.s4btExportXLSDisable button{
    height: 36px !important;
    padding-left: 16px;
    padding-right: 16px;
    border: none !important;
    border-radius: 24px;
    background-color: #bccbec !important;
    cursor: default;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: default;
    opacity: .3;
}

.s4btExportXLSDisable .webix_img_btn{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.4 !important;
    letter-spacing: 0.6px;
    color: #1452cc !important;
    text-transform: uppercase !important;
}





.s4btHelpIcon.webix_el_button{
    background-color: transparent
}
.s4btHelpIcon .webixtype_base,
.s4btHelpIcon .webixtype_prev,
.s4btHelpIcon .webixtype_next,
.s4btHelpIcon.webixbutton {
    background: transparent !important;
    color: #ffffff !important;
}
.s4btHelpIcon .webix_icon,
.s4btHelpIcon .webix_icon:hover,
.s4btHelpIcon .webix_icon:focus,
.s4btHelpIcon .webix_icon:active{
    width: 24px;
    height: 24px;
    font-size: 24px;
    color: var(--primaryMenuSystemTextAndIcon) !important
}








.s4btChatIcon.webix_el_button{
    background-color: transparent
}

.webix_el_box {
    padding: none !important;
}

.s4btChatIcon .webixtype_base,
.s4btChatIcon .webixtype_prev,
.s4btChatIcon .webixtype_next,
.s4btChatIcon.webixbutton {
    background: transparent !important;
    color: #7e89b3 !important;
}

.s4btChatIcon .webix_icon,
.s4btChatIcon .webix_icon:hover{
    width: 24px;
    height: 24px;
    font-size: 24px;
    color: #7e89b3
}

.webix_img_btn_abs.webix_img_btn_abs_top .webix_icon {
    margin-left: -10px;
}

.s4btChatIcon .webixtype_base .webix_badge {
    top: 50%;
    margin-top: -12px;
    margin-right: 14px !important;
}

.s4btChatIcon .webix_badge {
    min-width: 16px;
    min-height: 16px;
    background-color: #f5007a;
    border-radius: 50%;
    box-sizing: border-box;
    padding: 0 4px;
    position: absolute;
    right: 10px;
    top: 0;
    
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.1;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
}

.s4btChatBadge.webix_badge {
    min-width: 16px;
    min-height: 16px;
    background-color: #f5007a;
    border-radius: 50%;
    box-sizing: border-box;
    padding: 0 4px;
    position: absolute;
    right: 20px;
    top: 10px;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.1;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
}


.s4btprimaryMenuIconMore button{
    width: 32px !important;
    height: 32px;
    border-radius: 100px;
    border: none;
    background-color: #f0f2f4;
    background: -moz-linear-gradient(top, #f0f2f4 0% , #f0f2f4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f0f2f4), color-stop(1, #f0f2f4));
}

.s4btprimaryMenuIconMore .webix_el_box{
    padding: 0px !important
}

.s4btprimaryMenuIconMore .webix_img_btn_abs .webix_icon {
    color: #4678aa;
    line-height: .8;
    font-weight: 400
}

.s4btprimaryMenuIconMore.webix_el_button{
    display: inline-block;
    vertical-align: bottom !important;
    width: 32px;
    height: 32px !important;
    position: absolute;
    /* bottom: 24px; */
    left: 34px;
}



.s4btHelpIconAndTextPrimary button,
.s4btHelpIconAndTextPrimary button:hover,
.s4btHelpIconAndTextPrimary button:focus,
.s4btHelpIconAndTextPrimary button:active{
    background-color: transparent;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.27;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #5b7895 !important;
    background: -moz-linear-gradient(top, transparent 0% , transparent 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,transparent), color-stop(1, transparent));
}

.s4btHelpIconAndTextPrimary .webix_icon_btn {
    font-size: 16px;
    color: #4678aa;
    padding-top: 16px
}








.s4bt_iconChangeSecondMenu.webix_icon{
    text-align: right !important;
    float: right !important;
    font-weight: 500 !important;
    color: #fff !important;
}

.s4bt_iconChangeSecondMenuLeft.webix_icon{
    text-align: left !important;
    float: left !important;
    line-height: 1.4;
    margin-left: 8px;
    color: #738596 !important;
    font-weight: 500 !important
}

.s4bt_iconChangeSecondMenuRight.webix_icon{
    text-align: right !important;
    float: right !important;
    line-height: 1.4;
    color: #4678aa !important;
    margin-right: 8px;
}
























.s4btBlueAccentIconFooterMobile button{
    width: 60px !important;
    height: 36px !important;
    border-radius: 18px;
    border: none;
    background-color: #ddebff !important;
    background: -moz-linear-gradient(top, #ddebff 0% , #ddebff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ddebff), color-stop(1, #ddebff));
}

.s4btBlueAccentIconFooterMobile.webix_el_button,
.s4btBlueAccentIconFooterMobile .webix_el_box{
    width: auto !important;
    padding-top: 8px;
    padding-bottom: 8px;
}

.s4btBlueAccentIconFooterMobile .webix_img_btn{
    text-align: center;
}

.s4btBlueAccentIconFooterMobile .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 9px;
    height: 16px !important;
    color: #243256;
    position: absolute;
    top: 50%;
    left: 42%;
    transform: translate(-50%, -50%)
}

.s4btBlueAccentIconFooterMobile .webix_disabled_box .webix_img_btn{
    background: #ddebff;
    border: none;
    text-shadow: none;
    opacity: .5
}

.s4btBlueAccentIconFooterMobile.webix_disabled_view .webix_icon_btn{
    color: #243256;
    opacity: .5
}







.s4bt_btnMoreCardModalActDetProx button{
    width:24px !important;
    height:24px !important;
    background-color:#fff !important;
    border-radius:50% !important;
    
}
.s4bt_btnMoreCardModalActDetProx.webix_control.webix_el_button{
    width:auto !important;
}
.s4bt_btnMoreCardModalActDetProx.webix_el_box{
    width:auto !important
}
.s4bt_btnMoreCardModalActDetProx .webix_icon_btn{
    width:24px;
    font-size:14px;
    color:#505c83;
    vertical-align: text-top;
    text-align:center
}





























/*------------------------------------*\
    S4BT Button Sec Menu Det Prox
\*------------------------------------*/
.s4btIconTextBGWhite .webix_img_btn{
    background: #fff;
    border-radius: 4px;
}
.s4btIconTextBGWhite .s4bt_textBGWhite{
    color: #505c83;
    padding-left: 4px;
    font-family: Rubik;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0.3px;
    float: left
}
.s4btIconTextBGWhite .webix_icon_btn{
    float: left;
    line-height: 1.9;
    padding-left: 16px;
    color: #505c83;
    font-size: 16px;
}
.s4btIconTextBGWhite .webix_disabled_box button{
    opacity: .5;
}


/*------------------------------------*\
    S4BT Text Accent White Background
\*------------------------------------*/
.s4btWhite.webix_el_button,
.s4btWhite .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btWhite button,
.s4btWhite button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #fff !important;
    border-radius: 24px !important;
    background-color: #fff !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: var(--primaryMenuSystem) !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btWhite .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Icon More White
\*------------------------------------*/
.s4btIconWhiteMore button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #fff !important;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconWhiteMore.webix_el_button,
.s4btIconWhiteMore .webix_el_box{
    width: auto !important;
}
.s4btIconWhiteMore .webix_img_btn{
    text-align: center;
}
.s4btIconWhiteMore .webix_icon_btn {
    font-size: 20px;
    display: inline-block;
    text-align: center;
    width: 24px;
    height: 24px !important;
    color: var(--primaryMenuSystem);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding-top:4px
}
.s4btIconWhiteMore .webix_disabled_box .webix_img_btn{
    background: #fff;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btIconWhiteMore.webix_disabled_view .webix_icon_btn{
    color: #243256
}

/*------------------------------------*\
    S4BT Circle White
\*------------------------------------*/
.s4btIconWhite .webix_el_box{
    width: auto !important;
}
.s4btIconWhite.webix_el_button,
.s4btIconWhite .webix_el_box{
    width: auto !important;
}
.s4btIconWhite .webix_img_btn{
    text-align: center;
}
.s4btIconWhite button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #fff !important;
    background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconWhite .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 9px;
    height: 16px !important;
    color: var(--primaryMenuSystem);
    position: absolute;
    top: 50%;
    left: 42%;
    transform: translate(-50%, -50%)
}

.s4btIconWhite .webix_disabled_box .webix_img_btn{
    background: #fff;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btIconWhite.webix_disabled_view .webix_icon_btn{
    color: #243256
}

/*------------------------------------*\
    S4BT Background Primary
\*------------------------------------*/
.s4btBgPrimary.webix_el_button,
.s4btBgPrimary .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btBgPrimary button,
.s4btBgPrimary button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid var(--secondaryMenuSystem) !important;
    border-radius: 24px !important;
    background-color: var(--secondaryMenuSystem) !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    /* line-height: 2.6; */
    line-height: normal;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btBgPrimary .webix_disabled_box button{
    opacity:0.3
}

/*------------------------------------*\
    S4BT Background Primary Mid
\*------------------------------------*/
.s4btBgPrimaryMid.webix_el_button,
.s4btBgPrimaryMid .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
}
.s4btBgPrimaryMid button,
.s4btBgPrimaryMid button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid var(--primaryMenuSystemTextAndIcon) !important;
    border-radius: 24px !important;
    background-color: var(--primaryMenuSystemTextAndIcon) !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    /* line-height: 2.6; */
    line-height: normal;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btBgPrimaryMid .webix_disabled_box button{
    opacity:0.3
}

/*------------------------------------*\
    S4BT Circle Alternate
\*------------------------------------*/
.s4btIconButtonMore .webix_el_box{
    width: 32px !important;
    height: 32px !important;
}
.s4btIconButtonMore.webix_el_button{
    display: inline-block;
    vertical-align: bottom !important;
    width: 32px;
    height: 32px !important;
    position: absolute;
    top: 16px;
    right: 24px;
}
.s4btIconButtonMore button{
    width: 32px;
    height: 32px;
    border-radius: 100px;
    border: none;
    background-color: #f0f2f4;
    background: -moz-linear-gradient(top, #f0f2f4 0% , #f0f2f4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f0f2f4), color-stop(1, #f0f2f4));
}
.s4btIconButtonMore .webix_icon_btn{
    height:auto !important;
    padding:0 !important;
    text-align:center !important;
    color:var(--primaryMenuSystem);
    padding-top: 6px !important;
    padding-left: 5px !important;
    vertical-align: top;
}

/*------------------------------------*\
    S4BT Expand Graphs
\*------------------------------------*/
.s4btIconExpandGraphs .webix_el_box{
    width: 32px !important;
    height: 32px !important;
}
.s4btIconExpandGraphs.webix_el_button{
    width: 32px !important;
    height: 32px !important;
    display: inline-block;
    vertical-align: bottom !important;
    position: absolute;
    top: 16px;
    right: 56px;
    margin-right:8px !important;
}
.s4btIconExpandGraphs button,
.s4btIconExpandGraphs:hover button,
.s4btIconExpandGraphs button .webix_selected{
    width: 32px;
    height: 32px;
    border-radius: 100px;
    border: none;
    background-color: #f0f2f4;
    background: -moz-linear-gradient(top, #f0f2f4 0% , #f0f2f4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f0f2f4), color-stop(1, #f0f2f4));
}
.s4btIconExpandGraphs .webix_icon_btn{
    height:auto !important;
    padding:0 !important;
    text-align:center !important;
    color:var(--primaryMenuSystem);
    vertical-align: top;
    padding-top: 8px !important;
    padding-left: 5px !important;
    font-size: 16px;
}

/*------------------------------------*\
    S4BT Refresh BG Grey
\*------------------------------------*/
.s4btIconRefreshBGGrey .webix_el_box{
    width: 36px !important;
    height: 36px !important;
} 
.s4btIconRefreshBGGrey.webix_el_button{
    width: 36px !important;
    height: 36px !important;
    display: inline-block;
    position: relative;
    top: 16px;
}
.s4btIconRefreshBGGrey button,
.s4btIconRefreshBGGrey:hover button,
.s4btIconRefreshBGGrey button .webix_selected{
    width: 32px;
    height: 32px;
    border-radius: 100px;
    border: none;
    background-color: #f0f2f4;
    background: -moz-linear-gradient(top, #f0f2f4 0% , #f0f2f4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f0f2f4), color-stop(1, #f0f2f4));
}
.s4btIconRefreshBGGrey .webix_icon_btn{
    height:auto !important;
    padding:0 !important;
    text-align:center !important;
    color:#243256;
    vertical-align: top;
    padding-top: 8px !important;
    padding-left: 5px !important;
    font-size: 16px;
}

/*------------------------------------*\
    S4BT Blue Accent Background
\*------------------------------------*/
.s4btBlueAccent.webix_el_button,
.s4btBlueAccent .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
    padding-top: 0px !important;
}
.s4btBlueAccent button,
.s4btBlueAccent button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid var(--primaryMenuSystem) !important;
    border-radius: 24px !important;
    background-color: var(--primaryMenuSystem) !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btBlueAccent .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Button Refresh Accent Light
\*------------------------------------*/
.s4btIconAccentLight button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #ddebff !important;
    background: -moz-linear-gradient(top, #ddebff 0% , #ddebff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ddebff), color-stop(1, #ddebff));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconAccentLight.webix_el_button,
.s4btIconAccentLight .webix_el_box{
    width: auto !important;
}
.s4btIconAccentLight .webix_img_btn{
    text-align: center;
}
.s4btIconAccentLight .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 9px;
    height: 16px !important;
    color: #7e89b3;
    position: absolute;
    top: 50%;
    left: 40%;
    transform: translate(-50%, -50%)
}
.s4btIconAccentLightDownload .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 9px;
    height: 16px !important;
    color: #7e89b3;
    position: absolute;
    top: 50%;
    left: 45% !important;
    transform: translate(-50%, -50%)
}

.s4btIconAccentLight .webix_disabled_box .webix_img_btn{
    background: #ddebff;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btIconAccentLight.webix_disabled_view .webix_icon_btn{
    color: #7e89b3
}

/*------------------------------------*\
    S4BT Button Manuali Accent Light
\*------------------------------------*/
.s4btIconAccentLightManuali button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #f0f2f4 !important;
    background: -moz-linear-gradient(top, #f0f2f4 0% , #f0f2f4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f0f2f4), color-stop(1, #f0f2f4));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconAccentLightManuali.webix_el_button,
.s4btIconAccentLightManuali .webix_el_box{
    width: auto !important;
}
.s4btIconAccentLightManuali .webix_img_btn{
    text-align: center;
}
.s4btIconAccentLightManuali .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 18px;
    height: 18px !important;
    color: #243256;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.s4btIconAccentLightManuali .webix_disabled_box .webix_img_btn{
    background: #f0f2f4;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btIconAccentLightManuali.webix_disabled_view .webix_icon_btn{
    color: #243256
}

/*------------------------------------*\
    S4BT Button Icon Text Accent Light
\*------------------------------------*/
.s4bt_xlsDownloadButton{
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0.4px;
    color: var(--secondaryMenuSystem);
}
.s4btIconTextAccentLight button{
    width: auto !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #ddebff !important;
    background: -moz-linear-gradient(top, #ddebff 0% , #ddebff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ddebff), color-stop(1, #ddebff));
    position: relative;
    top: 50%;
    transform: translateY(-50%); 
    padding:0px 16px;
    
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    text-transform: uppercase;
    font-stretch: normal;
    letter-spacing: 0.4px;
    color: #505c83;
}
.s4btIconTextAccentLight.webix_el_button,
.s4btIconTextAccentLight .webix_el_box{
    width: auto !important;
    padding: 0px 2px !important;
}

.s4btIconTextAccentLight .webix_img_btn{
    text-align: center;
    line-height: normal !important;
}
.s4btIconTextAccentLight .webix_icon_btn {
    font-size: 14px;
    display: inline-block;
    text-align: center;
    width: 16px;
    height: 16px !important;
    color: #505c83;
    line-height: 1.3;
}

.s4btIconTextAccentLight .webix_disabled_box .webix_img_btn{
    background: #ddebff;
    border: none;
    text-shadow: none;
    opacity: .3
}
.s4btIconTextAccentLight.webix_disabled_view .webix_icon_btn{
    color: #505c83
}

/*------------------------------------*\
    S4BT Button Icon Card Datatable
\*------------------------------------*/
.s4btIconFooterCardDatatable.webix_el_button .webix_img_btn{
    width: auto !important;
    height: auto !important;
    border-radius: 4px;
    line-height: normal !important;
    background-color: #ddebff;
/*    position: sticky;
    top: 50%;*/
}

.s4btIconFooterCardDatatable .webix_icon_btn{
    width: 39px !important;
    height: 24px !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    padding-left: 4px;
    color: #7e89b3;
}

.s4btIconFooterCardDatatable.webix_control.webix_el_button,
.s4btIconFooterCardDatatable .webix_el_box{
    width: auto !important
}

.s4btIconFooterCardDatatable .webixtype_base:focus{
    background-color: #ddebff;
}

/*------------------------------------*\
    S4BT Icon for Clean Page
\*------------------------------------*/
.s4btCleanPageIconText.webix_control.webix_el_button.webix_disabled_view {
    height: auto !important;
    position: relative;
    top: 0;
    left: 47%;
    transform: translate(-50%, -50%)
}
.s4btCleanPageIconText .webix_el_box.webix_disabled_box{
    height: 130px !important;
}
.s4btCleanPageIconText.webix_disabled_view.webix_control .webix_icon {
    font-size: 48px;
    color: #505c83;
    position: absolute;
    top: 25%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.s4btCleanPageIconText.webix_view.webix_control .webix_disabled_box .webix_img_btn_text {
    width: 316px;
    height: auto;
    font-family: Rubik;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0.3px;
    text-align: center;
    color: #738596;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.s4btCleanPageIconTextForm.webix_control.webix_el_button.webix_disabled_view {
    height: auto !important;
    position: relative;
    top: 0;
}
.s4btCleanPageIconTextForm .webix_el_box.webix_disabled_box{
    height: 130px !important;
}
.s4btCleanPageIconTextForm.webix_disabled_view.webix_control .webix_icon {
    font-size: 48px;
    color: #505c83;
    position: absolute;
    top: 25%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.s4btCleanPageIconTextForm.webix_view.webix_control .webix_disabled_box .webix_img_btn_text {
    width: 316px;
    height: auto;
    font-family: Rubik;
    font-size: 18px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 0.3px;
    text-align: center;
    color: #738596;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

/*------------------------------------*\
    S4BT Icon Text Accent Bg White
\*------------------------------------*/
.s4btIconTextAccentBgWhite button {
    width: auto !important;
    height: 36px !important;
    border-radius: 24px;
    border: none;
    background-color: #ffffff !important;
    background: -moz-linear-gradient(top, #ffffff 0% , #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(1, #ffffff));
    position: relative;
    top: 50%;
    /* transform: translateY(-8%); */
    transform: translateY(-50%);
    padding: 0px 16px;
    font-family: Rubik;
    font-size: 11px;
    font-weight: 500;
    font-style: normal;
    text-transform: uppercase;
    font-stretch: normal;
    letter-spacing: 0.4px;
    color: var(--secondaryMenuSystem);
}
.s4btIconTextAccentBgWhite.webix_control.webix_el_button{
    width: auto !important;
}
.s4btIconTextAccentBgWhite .webix_el_box{
    width: auto !important;
    height: auto;
    background-color: #ffffff;
    padding: 0px 16px;
    border-radius: 24px;
}
.s4btIconTextAccentBgWhite .webix_img_btn{
    font-family: Rubik;
    font-size: 13px !important;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.6px;
    text-align: center;
    color: var(--secondaryMenuSystem);
    background-color: #ffffff;
}
.s4btIconTextAccentBgWhite .webix_icon_btn{
    font-size: 16px;
    color: var(--secondaryMenuSystem);
}
.s4btIconTextAccentBgWhite .webix_disabled_box .webix_img_btn{
  background: #fff;
  border: none;
  text-shadow: none;
  opacity: .3
}
.s4btIconTextAccentBgWhite.webix_disabled_view .webix_icon_btn{
  color: var(--secondaryMenuSystem)
}

/* Close Button Sidemenu */
.s4btcloseChattingArea button{
    border-top-left-radius: 100px !important;
    border-bottom-left-radius: 100px !important;
    border: none;
    background-color: #f0f2f4;
    background: -moz-linear-gradient(top, #f0f2f4 0% , #f0f2f4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f0f2f4), color-stop(1, #f0f2f4));
    color: #505c83 !important;
    font-weight:300;
}
.s4btcloseChattingArea .webix_el_box{
    height:40px !important;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    padding: 0px !important
}
.s4btcloseChattingArea .webix_icon_btn {
    text-align: center;
    color: #4678aa !important;
    line-height: .2;
    font-weight: 300;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.s4btcloseChattingArea.webix_el_button{
    display: inline-block;
    vertical-align: bottom !important;
    position: absolute;
    right: 0px;
}

/* Button Add User Chat */
.s4btIconBackgroundWhite button{
  width: 36px !important;
  height: 36px !important;
  border-radius: 100px;
  border: none;
  background-color: #fff !important;
  background: -moz-linear-gradient(top, #fff 0% , #fff 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #fff));
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.s4btIconBackgroundWhite.webix_el_button,
.s4btIconBackgroundWhite .webix_el_box{
  width: auto !important;
}
.s4btIconBackgroundWhite .webix_img_btn{
  text-align: center;
}
.s4btIconBackgroundWhite .webix_icon_btn {
  font-size: 16px;
  display: inline-block;
  text-align: center;
  width: 9px;
  height: 16px !important;
  color: #505c83;
  position: absolute;
  top: 50%;
  left: 40%;
  transform: translate(-50%, -50%)
}
.s4btIconBackgroundWhite .webix_disabled_box .webix_img_btn{
  background: #fff;
  border: none;
  text-shadow: none;
  opacity: .3
}
.s4btIconBackgroundWhite.webix_disabled_view .webix_icon_btn{
  color: #1452cc
}

/*------------------------------------*\
    S4BT Text Red
\*------------------------------------*/
.s4btWhiteTextRed.webix_el_button,
.s4btWhiteTextRed .webix_el_box{
    min-width: 90px !important;
    width: auto !important;
    height: auto !important;
    padding-top: 0px !important;
}
.s4btWhiteTextRed button,
.s4btWhiteTextRed button:hover{
    height:36px !important;
    padding: 0 16px;
    border: 2px solid #fff !important;
    border-radius: 24px !important;
    background-color: #fff !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #ee5244 !important;
    text-transform: uppercase;
    cursor: pointer !important;
}
.s4btWhiteTextRed .webix_disabled_box button{
    opacity: .3;
}

/*------------------------------------*\
    S4BT Icon Accent
\*------------------------------------*/
.s4btIconAccent button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #ffffff !important;
    background: -moz-linear-gradient(top, #ffffff 0% , #ffffff 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(1, #ffffff));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconAccent.webix_el_button,
.s4btIconAccent .webix_el_box{
    width: auto !important;
}
.s4btIconAccent .webix_img_btn{
    text-align: center;
}
.s4btIconAccent .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 24px;
    height: 16px !important;
    /* vertical-align: middle; */
    color: #243256;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}
.s4btIconAccent .webix_disabled_box .webix_img_btn{
    background: #243256;
    border: none;
    text-shadow: none;
    opacity: .5
}
.s4btIconAccent.webix_disabled_view .webix_icon_btn{
    color: #243256
}


/*------------------------------------*\
    S4BT Icon White Mobile
\*------------------------------------*/
.s4btIconWhiteMobile button{
    width: 36px !important;
    height: 36px !important;
    border-radius: 100px;
    border: none;
    background-color: #243256 !important;
    background: -moz-linear-gradient(top, #243256 0% , #243256 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #243256), color-stop(1, #243256));
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.s4btIconWhiteMobile.webix_el_button,
.s4btIconWhiteMobile .webix_el_box{
    width: auto !important;
}
.s4btIconWhiteMobile .webix_img_btn{
    text-align: center;
}
.s4btIconWhiteMobile .webix_icon_btn {
    font-size: 16px;
    display: inline-block;
    text-align: center;
    width: 24px;
    height: 16px !important;
    /* vertical-align: middle; */
    color: #ffffff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}
.s4btIconWhiteMobile .webix_disabled_box .webix_img_btn{
    background: #243256;
    border: none;
    text-shadow: none;
    opacity: .5
}
.s4btIconWhiteMobile.webix_disabled_view .webix_icon_btn{
    color: #ffffff
}












/*------------------------------------*\
    S4BT Button PATD
\*------------------------------------*/
.s4bt_btnCaricaPATD.webix_el_button,
.s4bt_btnCaricaPATD .webix_el_box{
    width: 180px !important;
    height: auto !important;
}
.s4bt_btnCaricaPATD .webix_icon_btn{
    line-height: 1.6;
    color: #ffffff !important;
}
.s4bt_btnCaricaPATD button,
.s4bt_btnCaricaPATD button:hover{
    height:40px !important;
    padding: 0 16px;
    border-radius: 16px !important;
    font-family: Rubik;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.6;
    letter-spacing: 0.6px;
    text-align: center;
    color: #fff !important;
    text-transform: uppercase;
    cursor: pointer !important;
    background: #243256 !important;
    width:130px !important;
}
.s4bt_btnCaricaPATD .webix_disabled_box button{
    opacity: .3;
}

/* Bottone SCURO (Tutti) */
.miniBtnConfPATD {
    background-color: #505c83;
    color: white;
    border: none;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 12px;
    cursor: pointer;
    width: 70px;
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.miniBtnConfPATD:hover {
    background-color: #6e7baa;
}

.miniBtnConfPATD:active {
    background-color: #6e7baa;
    transform: scale(0.95);
}

/* Bottone CHIARO (Nessuno - inverso) */
.miniBtnConfPATDInverse {
    background-color: #f0f8fa;
    color: #505c83;
    border: 1px solid #505c83;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 12px;
    cursor: pointer;
    width: 70px;
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.miniBtnConfPATDInverse:hover {
    background-color: #e0eef2;
}

.miniBtnConfPATDInverse:active {
    background-color: #d0e3ea;
    transform: scale(0.95);
}