@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&display=swap');


@font-face {
  font-family: 'ProximaNova';
  font-weight: 600;
  src: url('fonts/ProximaNovaSbold.eot');
  src: url('fonts/ProximaNovaSbold.eot') format('embedded-opentype'),
       url('fonts/ProximaNovaSbold.woff2') format('woff2'),
       url('fonts/ProximaNovaSbold.woff') format('woff'),
       url('fonts/ProximaNovaSbold.ttf') format('truetype'),
       url('fonts/ProximaNovaSbold.svg#ProximaNovaSbold') format('svg');
}
@font-face {
  font-family: 'ProximaNova';
  font-weight: 400;
  src: url('fonts/ProximaNovaRegular.eot');
  src: url('fonts/ProximaNovaRegular.eot') format('embedded-opentype'),
       url('fonts/ProximaNovaRegular.woff2') format('woff2'),
       url('fonts/ProximaNovaRegular.woff') format('woff'),
       url('fonts/ProximaNovaRegular.ttf') format('truetype'),
       url('fonts/ProximaNovaRegular.svg#ProximaNovaRegular') format('svg');
}
@font-face {
  font-family: 'ProximaNova';
  font-weight: 800;
  src: url('fonts/MarkSimonsonProximaNovaExtrabold.eot');
  src: url('fonts/MarkSimonsonProximaNovaExtrabold.eot') format('embedded-opentype'),
       url('fonts/MarkSimonsonProximaNovaExtrabold.woff2') format('woff2'),
       url('fonts/MarkSimonsonProximaNovaExtrabold.woff') format('woff'),
       url('fonts/MarkSimonsonProximaNovaExtrabold.ttf') format('truetype'),
       url('fonts/MarkSimonsonProximaNovaExtrabold.svg#MarkSimonsonProximaNovaExtrabold') format('svg');
}
@font-face {
  font-family: 'ProximaNova';
  font-weight: 700;
  src: url('fonts/ProximaNovaBold.eot');
  src: url('fonts/ProximaNovaBold.eot') format('embedded-opentype'),
       url('fonts/ProximaNovaBold.woff2') format('woff2'),
       url('fonts/ProximaNovaBold.woff') format('woff'),
       url('fonts/ProximaNovaBold.ttf') format('truetype'),
       url('fonts/ProximaNovaBold.svg#ProximaNovaBold') format('svg');
}
@font-face {
    font-family: 'ProximaNova';
    font-weight: 400;
    font-style: italic;
    src: url('fonts/ProximaNovaRegItalic.eot');
    src: url('fonts/ProximaNovaRegItalic.eot') format('embedded-opentype'),
         url('fonts/ProximaNovaRegItalic.woff2') format('woff2'),
         url('fonts/ProximaNovaRegItalic.woff') format('woff'),
         url('fonts/ProximaNovaRegItalic.ttf') format('truetype'),
         url('fonts/ProximaNovaRegItalic.svg#ProximaNovaRegItalic') format('svg');
}





:root {
    --primary-10: #FFF5EC;
    --primary-20: #FFDEC1;
    --primary-30: #FFCDA3;
    --primary-40: #FFAC65;
    --primary-50: #FF9941;
    --primary-60: #F1760D;
    --primary-80: #A04F08;
    

    --active-10: #FBF4F4;
    --active-20: #F2DFDF;
    --active-30: #E9C6C8;
    --active-40: #D8999B;
    --active-50: #AA2327;
    --active-60: #900E12;

    --gray-100: #F8F9FA;
    --gray-200: #E9ECEF;
    --gray-300: #DEE2E6;
    --gray-400: #CED4DA;
    --gray-500: #9a9b9c;
    --gray-600: #6C757D;
    --gray-700: #495057;
    --gray-800: #343A40;
    --gray-900: #212529;

    --secondary: #243551;
    --text-base-color: #1D211D;
    --blue: #0A58CA;

    --success: #28A745;
    --danger: #EB5757;
    --warning: #D27523;
    --info: #17A2B8;

    --small-font: 14px;
    --medium-font: 16px;
    --large-font: 18px;

    --focus-outline: #547DC0;


    
  }
 
      
/* typography */

.widget-eventTime, .widget-timeline-title, body {color: var(--text-base-color); font-family: 'ProximaNova';}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {color: var(--text-base-color); font-family: 'ProximaNova'; font-weight: 800; padding: 0; margin: 0.5em 0; line-height: 1.25em;}
.large {font-size: 18px;}
.small {font-size: 14px;;}
.italic {font-style: italic;}
.bold {font-weight: 700;}
.mainContent a {text-decoration: underline; font-weight: 600; color: var(--text-base-color);}
.mainContent > .mx-scrollcontainer-wrapper {overflow-x: hidden !important;}
/* .mainContent a:hover, .mainContent a:focus, .mainContent a:active {background-color: var(--primary-20);} */
.widths {width: 600px; max-width: 100%; margin:0;}
.widthxs {width: 400px; max-width: 100%; margin:0;}
.width {width: 1000px; max-width: 100%; margin:0;}
.widthm {width: 850px; max-width: 100%; margin:0;}
.wide {width: 1400px; max-width: 100%; margin:0;}
.fRight {float: right}
.fLeft {float: left;}
.fRight.btn {margin-left: 10px;}
.fLeft.btn {margin-right: 10px;}
.underline {text-decoration: underline;}
.dropdown-list {width: auto !important;}
.noHover {background: none !important;}
.bor300 {border: 1px solid var(--gray-300);}
.bo {border: 1px solid var(--gray-300);}
.bot {border-top: 1px solid var(--gray-300);}
.bob {border-bottom: 1px solid var(--gray-300);}
.bol {border-left: 1px solid var(--gray-300);}
.bor {border-right: 1px solid var(--gray-300);}
.mx-groupbox > .mx-groupbox-header {font-size: 1rem; font-weight: 600; background-color: var(--gray-200); border-color: var(--gray-200); padding: 1rem; border-radius: 0;}
.mx-groupbox > .mx-groupbox-body {padding: 1rem; border-color: var(--gray-200); border-radius: 0;}
.noPh p {padding: 0; margin:0;}
.noWrap {white-space: nowrap;}

/* Heding title */

h1, .h1 {font-size: 40px;}
h2, .h2 {font-size: 32px;}
h3, .h3 {font-size: 28px;}
h4, .h4 {font-size: 24px;}
h5, .h5 {font-size: 20px;}
h6, .h6 {font-size: 16px;}

/* Colors */

.p10  {color:var(--primary-10) !important;}
.p20  {color:var(--primary-20) !important;}
.p30  {color:var(--primary-30) !important;}
.p40  {color:var(--primary-40) !important;}
.p50  {color:var(--primary-50) !important;}
.p60  {color:var(--primary-60) !important;}

.bp10  {background-color:var(--primary-10);}
.bp20  {background-color:var(--primary-20);}
.bp30  {background-color:var(--primary-30);}
.bp40  {background-color:var(--primary-40);}
.bp50  {background-color:var(--primary-50);}
.bp60  {background-color:var(--primary-60);}

.a10  {color:var(--active-10);}
.a20  {color:var(--active-20);}
.a30  {color:var(--active-30);}
.a40  {color:var(--active-40);}
.a50  {color:var(--active-50);}
.a60  {color:var(--active-60);}

.ba10  {background-color:var(--active-10);}
.ba20  {background-color:var(--active-20);}
.ba30  {background-color:var(--active-30);}
.ba40  {background-color:var(--active-40);}
.ba50  {background-color:var(--active-50);}
.ba60  {background-color:var(--active-60);}

.g100 {color:var(--gray-100) !important;}
.g200 {color:var(--gray-200) !important;}
.g300 {color:var(--gray-300) !important;}
.g400 {color:var(--gray-400) !important;}
.g500 {color:var(--gray-500) !important;}
.g600 {color:var(--gray-600) !important;}
.g700 {color:var(--gray-700) !important;}
.g800 {color:var(--gray-800) !important;}
.g900 {color:var(--gray-900) !important;}

.bg100 {background-color:var(--gray-100);}
.bg200 {background-color:var(--gray-200);}
.bg300 {background-color:var(--gray-300);}
.bg400 {background-color:var(--gray-400);}
.bg500 {background-color:var(--gray-500);}
.bg600 {background-color:var(--gray-600);}
.bg700 {background-color:var(--gray-700);}
.bg800 {background-color:var(--gray-800);}
.bg900 {background-color:var(--gray-900);}

.b {color: #000;}
.w {color: #fff;}
.s {color: #243551;}

.bb {background-color: #000;}
.bw {background-color: #fff;}
.bs {background-color: var(--secondary);}

.bc {color: var(--text-base-color);}
.bbc {background-color: var(--text-base-color);}

.success {color:var(--success);}
.danger {color:var(--danger);}
.warning {color:var(--warning);}
.info {color:var(--info);}

.bsuccess {background-color:var(--success);}
.bdanger {background-color:var(--danger);}
.bwarning {background-color:var(--warning);}
.binfo {background-color:var(--info);}

.table .td:focus {outline-width:0}

.divCenter {margin-left: auto; margin-right: auto;}

.lhs {line-height: 1.3em;}
.infinite-loading {max-height: unset !important;}

/* tabs */

.mx-tabcontainer .mx-tabcontainer-tabs {border:0;  display: flex;   flex-wrap: wrap;}
.mx-tabcontainer .mx-tabcontainer-tabs > li > a {border:0; border-bottom: 2px solid rgba(255,255,255,0); color: var(--text-base-color); font-weight: 600;  padding-bottom: 16px; margin-bottom: 16px; font-size: 16px; text-decoration: none; white-space: nowrap;}
.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a, .mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:hover, .mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:focus, .mx-tabcontainer .mx-tabcontainer-tabs > li a:hover, .mx-tabcontainer .mx-tabcontainer-tabs > li > a:focus {border:0; border-bottom: 2px solid var(--primary-60); background: none; color: var(--gray-700); }


/* spaces */

.m1 {margin: 1rem !important;}
.m2 {margin: 2rem !important;}
.m3 {margin: 3rem !important;}

.m-1 {margin: -1rem !important;}
.m-2 {margin: -2rem !important;}
.m-3 {margin: -3rem !important;}

.mt1 {margin-top: 1rem !important;}
.mt2 {margin-top: 2rem !important;}
.mt3 {margin-top: 3rem !important;}

.mt-1 {margin-top: -1rem !important;}
.mt-2 {margin-top: -2rem !important;}
.mt-3 {margin-top: -3rem !important;}

.mb1 {margin-bottom: 1rem !important;}
.mb2 {margin-bottom: 2rem !important;}
.mb3 {margin-bottom: 3rem !important;}

.mb-1 {margin-bottom: -1rem !important;}
.mb-2 {margin-bottom: -2rem !important;}
.mb-3 {margin-bottom: -3rem !important;}

.ml1 {margin-left: 1rem !important;}
.ml2 {margin-left: 2rem !important;}
.ml3 {margin-left: 3rem !important;}

.ml-1 {margin-left: -1rem !important;}
.ml-2 {margin-left: -2rem !important;}
.ml-3 {margin-left: -3rem !important;}

.mr1 {margin-right: 1rem !important;}
.mr2 {margin-right: 2rem !important;}
.mr3 {margin-right: 3rem !important;}

.mr-1 {margin-right: -1rem !important;}
.mr-2 {margin-right: -2rem !important;}
.mr-3 {margin-right: -3rem !important;}

.mh1 {margin-top: 1rem !important; margin-bottom: 1rem !important;}
.mh2 {margin-top: 2rem !important; margin-bottom: 2rem !important;}
.mh3 {margin-top: 3rem !important; margin-bottom: 3rem !important;}

.mh-1 {margin-top: -1rem !important; margin-bottom: -1rem !important;}
.mh-2 {margin-top: -2rem !important; margin-bottom: -2rem !important;}
.mh-3 {margin-top: -3rem !important; margin-bottom: -3rem !important;}

.mv1 {margin-left: 1rem !important; margin-right: 1rem !important;}
.mv2 {margin-left: 2rem !important; margin-right: 2rem !important;}
.mv3 {margin-left: 3rem !important; margin-right: 3rem !important;}

.mv-1 {margin-left: -1rem !important; margin-right: -1rem !important;}
.mv-2 {margin-left: -2rem !important; margin-right: -2rem !important;}
.mv-3 {margin-left: -3rem !important;margin-right: -3rem !important; }

.p1 {padding: 1rem !important;}
.p2 {padding: 2rem !important;}
.p3 {padding: 3rem !important;}

.pt1 {padding-top: 1rem !important;}
.pt2 {padding-top: 2rem !important;}
.pt3 {padding-top: 3rem !important;}

.pb1 {padding-bottom: 1rem !important;}
.pb2 {padding-bottom: 2rem !important;}
.pb3 {padding-bottom: 3rem !important;}

.pl1 {padding-left: 1rem !important;}
.pl2 {padding-left: 2rem !important;}
.pl3 {padding-left: 3rem !important;}

.pr1 {padding-right: 1rem !important;}
.pr2 {padding-right: 2rem !important;}
.pr3 {padding-right: 3rem !important;}

.ph1 {padding-top: 1rem !important; padding-bottom: 1rem !important;}
.ph2 {padding-top: 2rem !important; padding-bottom: 2rem !important;}
.ph3 {padding-top: 3rem !important; padding-bottom: 3rem !important;}

.pv1 {padding-left: 1rem !important; padding-right: 1rem !important;}
.pv2 {padding-left: 2rem !important; padding-right: 2rem !important;}
.pv3 {padding-left: 3rem !important; padding-right: 3rem !important;}

.nm, .nm > ul {margin: 0 !important;}
.nmt, .nmt > ul {margin-top: 0 !important;}
.nmb, .nmb > ul {margin-bottom: 0 !important;}
.nml, .nml > ul {margin-left: 0 !important;}
.nmr, .nmr > ul {margin-right: 0 !important;}

.np {padding: 0 !important;}
.npt {padding-top: 0 !important;}
.npb {padding-bottom: 0 !important;}
.npl {padding-left: 0 !important;}
.npr {padding-right: 0 !important;}

.mn1, .mw1 {min-width: 50px;}
.mn2, .mw2 {min-width: 100px;}
.mn3, .mw3 {min-width: 150px;}
.mn4, .mw4 {min-width: 200px;}
.mn5, .mw5 {min-width: 250px;}
.mn6, .mw6 {min-width: 300px;}
.mn7, .mw7 {min-width: 350px;}
.mn8, .mw8 {min-width: 400px;}
.mn9, .mw9 {min-width: 450px;}
.mn10, .mw10 {min-width: 500px;}

.mw {min-width: 100%;}

.largeFont {font-size: var(--large-font) !important;}
.mediumFont, .mediumFont > label {font-size: var(--medium-font) !important;}
.smallFont {font-size: var(--small-font);}
.regularFont {font-size: 0.95rem !important;}

.react-datepicker-popper, .widget-tooltip .widget-tooltip-content {z-index: 51;}
.mx-calendar {font-size: 16px;}
.mx-calendar-year-switcher, .mx-calendar-month-label {font-size: 19px; font-weight: 600;}
.mx-calendar .mx-calendar-year-switcher {color: #f1a360;}
.mx-calendar .mx-calendar-year-switcher span.mx-calendar-year-selected {    color: #1d211d;}
.mx-calendar-month-dropdown-options div {font-size: 16px;}

.tCenter {text-align: center;}

.autoHeight, .autoHeight .mx-window-body, .autoHeight .mx-scrollcontainer-wrapper {height: auto !important;}
.autoHeight .mx-scrollcontainer-wrapper {max-height: calc(100vh - 100px); overflow: auto;}

/* buttons */

.btn, .mx-button { padding: 0.7rem 1.5rem; background-color: var(--primary-40); font-weight: 600; line-height: 1em; color: var(--text-base-color); font-size: 1rem; border-radius: 4px; position: relative; border:none}
.btn-calendar {padding: 0.7rem 0.8rem;}
.btn:hover, .mx-button:hover {background-color: var(--primary-50); color: var(--text-base-color); }
.btn:focus {background-color: var(--primary-40); color: var(--text-base-color); }
.btn:not(.filter-selector-button):focus:before {content: ''; width: calc(100% + 8px); height: calc(100% + 8px); position: absolute; top:-4px; left: -4px; border: 2px solid var(--blue); border-radius: 4px;}
.btn:active {background-color: var(--primary-60); color: var(--text-base-color); }
.btn.disabled, .btn[aria-disabled], .btn[disabled] {color: var(--gray-600); }
.ss4 .btn.disabled, .ss4 .btn[aria-disabled], .ss4 .btn[disabled] {background-color: var(--gray-300) !important; border-color: var(--gray-300) !important;}

.btn.btn-lg, .mx-button.btn-lg {padding: 0.9rem 1.5rem;  font-size: var(--large-font);} 
.btn.btn-sm, .mx-button.btn-sm {padding: 0.5rem 1rem;  font-size: var(--small-font);} 

.btn-inverse {border: 1px solid var(--secondary);  background: #fff; color: var(--secondary);}
.btn-inverse:hover {background-color: var(--gray-100); color: var(--secondary); border-color: var(--secondary);}
.btn-inverse:focus, .btn-inverse:active {background-color: #fff; color: var(--secondary);}
.btn-inverse:not(.filter-selector-button):focus:before, .btn-inverse:active:before {content: ''; width: calc(100% + 2px); height: calc(100% + 2px); position: absolute; top:-1px; left: -1px; border: 2px solid var(--blue); border-radius: 4px;}
.btn-inverse.disabled, .btn-inverse[aria-disabled], .btn-inverse[disabled] {border-color: var(--gray-500) !important; background-color: #fff !important; color: var(--gray-500) !important;}
.btn-inverse.disabled:before, .btn-inverse[aria-disabled]:before, .btn-inverse[disabled]:before  {content: ''; width: calc(100% + 2px); height: calc(100% + 2px); position: absolute; top:-1px; left: -1px; border: 2px solid var(--gray-500); border-radius: 4px;}

.btn-success {font-weight: 700; border: 1px solid var(--success);  background: #fff; color: var(--gray-700); border-radius: 4px;}
.btn-success:hover {background-color: #f6fbf7;  color: var(--gray-700); border-color: var(--success);}
.btn-success:focus, .btn-success:active {background-color: #fff;  color: var(--gray-700);}
.btn-success:not(.filter-selector-button):focus:before {content: ''; width: calc(100% + 4px); height: calc(100% + 4px); position: absolute; top:-2px; left: -2px; border: 3px solid var(--success); border-radius: 4px;}
.btn-success.disabled, .btn-success[aria-disabled], .btn-success[disabled] {border-color: var(--gray-600) !important; background-color: #fff !important; color: var(--gray-600) !important; filter: grayscale(1);}

.btn-danger {font-weight: 700; border: 1px solid var(--danger);  background: #fff; color: var(--gray-700); border-radius: 4px;}
.btn-danger .glyphicon {color: var(--danger);}
.btn-danger:hover {background-color: #ffecee;  color: var(--gray-700); border-color: var(--danger);}
.btn-danger:focus, .btn-danger:active {background-color: #fff;  color: var(--gray-700);}
.btn-danger:not(.filter-selector-button):focus:before {content: ''; width: calc(100% + 4px); height: calc(100% + 4px); position: absolute; top:-2px; left: -2px; border: 3px solid var(--danger); border-radius: 4px;}
.btn-danger.disabled, .btn-danger[aria-disabled], .btn-danger[disabled] {border-color: var(--gray-600) !important; background-color: #fff !important; color: var(--gray-600) !important; filter: grayscale(1);}
.btn-danger.fullR {background-color: var(--danger) !important; color: #fff !important;}

.skip-button {position: absolute; top: 0px; left: 1; width: 1px; height: 0px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; z-index:1000 }
.skip-button:focus {position: absolute; width: auto; height: auto; font-size: 13px; margin: 0; padding-right: 5px; padding-left: 5px;  border: 1px solid #23527c; background: #fff; clip: auto; white-space: normal; transition: top .05s ease-in; border-radius: 3px; }

.alert .btn {font-size: 14px !important;}

.btn-info {font-weight: 700; border: 1px solid var(--gray-700);  background: #fff; color: var(--gray-700); border-radius: 4px; padding-left: 16px !important; padding-right: 16px !important;}
.noSelected {background-color: var(--ss4-greenMedium) !important; color: #fff !important; border: 0 !important;}
.btn-info:hover {background-color: var(--gray-100);  color: var(--gray-700); border-color: var(--gray-700);}
.btn-info:focus, .btn-info:active {background-color: #fff;  color: var(--gray-700);}
.btn-info:not(.filter-selector-button):focus:before {content: ''; width: calc(100% + 4px); height: calc(100% + 4px); position: absolute; top:-2px; left: -2px; border: 3px solid var(--gray-700); border-radius: 4px;}
.btn-info.disabled, .btn-info[aria-disabled], .btn-info[disabled]  {border-color: var(--gray-600) !important; background-color: #fff !important; color: var(--gray-600) !important;}
.noSelected.canRemove:hover::after {background-color: var(--ss4-redMedium) !important; position: absolute; width: 100%; height: 100%; top:0; left: 0; content: 'Wycofaj'; border-radius: 4px; padding-top: 11px; }
.blocked{background-color:var(--gray-500) !important;cursor:default;color:#fff !important;border:0 !important;}

.btn img, .mx-button img, .mx-link:not(.imgLink) img {width: auto; height: auto; vertical-align: middle; margin: -3px 6px 0 -2px; max-height: 17px;}
.btn .glyphicon, .mx-button .glyphicon{max-height: 17px;line-height:12px;font-size:14px;margin-right:6px;}
/* .ss4 .btn .glyphicon, .ss4 .mx-button .glyphicon{margin-right:0;} */

.imgLink img {width: auto; height: auto; max-height: 17px;}
.smallImg img {width: 16px; margin: 0;}
.mainContent .imgLink:hover, .mainContent .imgLink:active, .mainContent .imgLink:focus {background-color: #fff;}
.va.mx-table td {vertical-align: middle;}

.mx-datepicker .btn, .reactDateTimePicker .btn {border-radius: 4px; padding: 0.55rem 1rem;}
.mx-datepicker .btn::before, .reactDateTimePicker .btn::before {display: none !important;}

.onlyIcon {padding: 0.7rem; width: 45px;}
.onlyIconSmall {padding: 0; width: 20px;}
a.onlyIcon, a.onlyIconSmall {background: none !important;}
.onlyIcon img, .onlyIconSmall img {margin: 0 auto !important; max-height: 16px;}

/* grid */
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-input .form-control {font-size: 14px;}
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-input select.form-control {padding: 3px 16px;}
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-label label {line-height: 1.1em;}


/* form input */
.srs .srs-text {padding: 0 !important; position: relative;  width: 100%;}
.srs .srs-badge-row, .srs .srs-icon-row {position: absolute; right: 22px;}
.srs .srs-text p {white-space: nowrap;}
.form-control, .srs .form-control, .widget-combobox-input-container, .widget-combobox .widget-combobox-input-container-disabled.form-control-static {border: 1px solid var(--gray-600); color: var(--text-base-color); padding: 9px 16px; line-height: 1em; font-size: 1rem; background-color: var(--gray-100); font-family: 'ProximaNova', sans-serif; font-weight: 400;}
.srs .form-control {padding: 11px 16px;}
.srs input {background: none; padding: 0; margin: -2px;}
.srs .form-control {padding-right: 50px;}
.srs .form-control:focus {padding: 10px 15px;}
.srs .srs-badge-row, .srs .srs-icon-row {margin: -6px -6px -6px -50px;}
select.form-control {padding: 11px 26px 11px 16px;}
.widget-combobox-input-container.form-control, .widget-combobox .widget-combobox-input-container-disabled.form-control-static {padding: 11px 11px 11px 16px !important;}
.form-group .control-label {font-size: var(--small-font); font-weight: 700; border-radius: 4px; margin-bottom: 2px;}
textarea.form-control {padding: 14px 16px; line-height:20px;}
.srs .glyphicon, .srs img {padding: 8px 0;}

.form-control:focus{padding: 8px 15px; border-color: var(--blue) !important; border-width: 2px;}
select.form-control:focus{padding: 10px 15px; }
textarea.form-control:focus {padding: 13px 15px;}
.form-control:hover {border-color: #F1760D;}
.form-control:disabled, .widget-combobox .widget-combobox-input-container-disabled.form-control-static {border-color: var(--gray-300); background-color: var(--gray-300); color: var(--gray-600);}
.widget-combobox .widget-combobox-input-container-disabled.form-control-static {background-image: url(resources/arrow.svg); background-repeat: no-repeat;  background-position: calc(100% - 10px) 17px;  appearance: none;  -moz-appearance: none;  -webkit-appearance: none;     border-radius: 4px; padding-right: 26px;}
.form-control::-webkit-input-placeholder {color: var(--gray-500);}
.form-control:-ms-input-placeholder { color: var(--gray-500);}
.form-control::placeholder {  color: var(--gray-500);} 


.successMessage {padding: 4px 0 0 2px;  color: #28A745; font-size: var(--small-font);}
.has-error .mx-validation-message {padding: 4px 0 0 2px !important;  margin: 0;  border: none;  background: none;  color: #DC3545; font-size: var(--small-font);}
.has-error .form-control {background-color: var(--active-10); border-color: #DC3545 !important; color: #DC3545; background-image: url(/images/error.svg); background-repeat: no-repeat; background-position: calc(100% - 10px) 9px; padding-right: 35px;}
.searchableReference.has-error .form-control {background-position: calc(100% - 50px) 9px; }
.searchableReference.addN .srs .srs-icon-row{right:15px;}
.has-error .successMessage {display: none;}
.iSuccess .form-control {border-color: #198754 !important; background-color: #fff; background-image: url(/images/success.svg); background-repeat: no-repeat; background-position: calc(100% - 10px) 9px; padding-right: 35px;}

input[type=checkbox]:before {width: 16px; height: 16px; border-radius: 2px; border: 0; background-color: #fff; border:1px solid var(--gray-500)}
input[type=checkbox]:checked:before, input[type=checkbox].three-state-checkbox:indeterminate:before, input[type=checkbox].three-state-checkbox:checked:before {border-color: var(--primary-40); background-color: var(--primary-40);}
input[type=checkbox]:checked:after, input[type=checkbox].three-state-checkbox:not(:indeterminate):after {width: 16px; height: 16px; transform: none; border:none; margin: 0; background-image: url(/images/check.svg); background-repeat: no-repeat; background-position: center center; }
input[type=checkbox]:disabled:before, input[type=radio]:disabled:before {background-color: #eaeaea; border-color: var(--gray-500);}
input[type=checkbox].three-state-checkbox:before {background-color: #fff;     border: 1px solid #c7c7c7;}
.mx-radiobuttons .radio input[type=radio]:disabled + label, input[type=checkbox]:disabled + label {color: var(--gray-500);}
.mx-checkbox input[type=checkbox] {margin: 4px 0 !important;}
.mx-checkbox.label-after > div{flex-wrap:nowrap;} /*# :: < - Global fix for all checkboxes with label after - if label is too long then it will not go below checkbox itself now, but stay in place, center all and break the line in the label text :: #*/
.mx-radiobuttons .radio input[type=radio]:focus { outline-width: 0;}
.mx-radiobuttons .radio input[type=radio] {margin: 0;}
.mx-radiobuttons .radio input[type=radio]:checked::before {border-color: var(--primary-40); background-color: var(--primary-40);}
input[type=radio]:after {width: 6px; height: 6px;}
select.form-control option:hover {background-color: var(--primary-10); color: var(--text-base-color);}
.disabled, [disabled] {opacity: 1;}
.greenInput select, .greenInput input {color: var(--success) !important; border-color: var(--success) !important;}

.w-e-text-container {min-height: 500px !important;}
.w-e-text table td, .w-e-text table th, .w-e-text table {min-height: unset !important; border: unset !important;}
.w-e-menu {display: none !important;}
.w-e-menu[data-title="bold"], .w-e-menu[data-title="underline"], .w-e-menu[data-title="italic"], .w-e-menu[data-title="numbered list"], .w-e-menu[data-title="bold"], .w-e-menu[data-title="undo"], .w-e-menu[data-title="redo"], .w-e-menu[data-title="align"], .w-e-menu[data-title="fullscreen"], .w-e-menu[data-title="cancel fullscreen"] {display: flex !important;}
.kgEditor {pointer-events: all !important;}


/* template grid2 */
.widget-datagrid {display: inline-block;}
.widget-datagrid .table .th {background-color: var(--gray-100); text-transform: uppercase; border: none; padding: 15px 5px;}
.widget-datagrid .table .th:first-child {padding-left: 20px; border-top-left-radius: 8px; }
.widget-datagrid .table .th .column-header span {font-size: var(--small-font); line-height: 1.1em;}
.widget-datagrid .table .th .filter {margin: 5px 0 0 0 !important;}
.ss4 .widget-datagrid .table .th .filter {margin: 0 !important;}
.widget-datagrid .table .th .column-header svg {margin-top: -3px;}
.widget-datagrid .table .td > .td-text, .widget-datagrid .table .td * {font-size: var(--small-font);}
.widget-datagrid .table .td {border-top:none; border-color: var(--gray-200); padding: 4px 5px; min-width: 1px}
.widget-datagrid .table .tr:hover .td {background: #FFF5EC;}
.widget-datagrid .table .td:first-child {padding-left: 20px;}
.widget-datagrid .table .td .mx-datepicker{margin:0;}
.widget-datagrid .table .td .mx-datepicker > .form-control-static{padding:0;border:0;}
.widget-datagrid .column-selector-content button {border-radius: 4px; background-color: var(--gray-200); margin-right: 10px !important; border: 0;}
.widget-datagrid .column-selector-content button path {fill: #2047EA;}
.widget-datagrid .column-selector-content button::before {display: none;}
.widget-datagrid .column-selector-content button:active, .widget-datagrid .column-selector-content button:hover, .widget-datagrid .column-selector-content button:focus {background-color: var(--gray-300);}
.widget-datagrid .column-selector-content button:active path, .widget-datagrid .column-selector-content button:hover path, .widget-datagrid .column-selector-content button:focus path {fill: var(--primary-60);}
.widget-datagrid .filter-selector .filter-selector-content .filter-selector-button {
  background-color: var(--gray-200); border-top-left-radius: 4px; border-bottom-left-radius: 4px; font-family: "datagrid-filters"; font-weight: 400; line-height: unset; padding: 0 5px; border: 0;}
.widget-datagrid .filter-container .filter-input {padding:7px 5px; border-color: var(--gray-300); background-color: #fff; border-left: 0 !important; font-size: var(--small-font); color: var(--gray-600);}
.widget-datagrid .filter-container .filter-input:focus {border: 1px solid var(--gray-400) !important; border-left: 0 !important;}
.widget-datagrid .filter-container .btn-calendar {padding: 0.3em 0.5em;}
.widget-datagrid .dropdown-container .form-control {padding: 7px 10px; background-color: #fff; font-size: var(--small-font); color: var(--gray-600); border-color: var(--gray-300); border-width: 1px !important;}
.widget-datagrid .filter-selector .filter-selector-content .filter-selector-button:before {font-size: 15px; line-height: 20px; }
.widget-datagrid .table .th {min-width: auto;}
.widget-datagrid .table {margin-bottom: 0;}
.table .th .column-header svg {align-self: unset;}
.horizontalScroll {overflow-x: auto;}
.horizontalScroll::-webkit-scrollbar {height: 10px; position: absolute;}
.horizontalScroll::-webkit-scrollbar-track {background: #e9ecef;}
.horizontalScroll::-webkit-scrollbar-thumb {background: #888;}
.horizontalScroll::-webkit-scrollbar-thumb:hover {background: #555;}
.horizontalScroll .widget-datagrid .table .td:last-child {padding-right: 48px;}
.widget-datagrid-content {overflow: unset;}
.table .column-selector .column-selector-content {padding-right: 0;}
.tranfersTable.horizontalScroll .widget-datagrid .table .td:last-child {padding-right: 20px;}
.tranfersTable .widget-datagrid .table .td {padding-top: 10px; padding-bottom: 10px;}
.horizontalScroll .widget-datagrid {min-width: 100%;}
.pagination-bar {justify-content: flex-start; margin:5px 10px;}
.gridSettings .btn {border-radius: 4px; background-color: var(--gray-100); width: 20px; height: 20px; padding: 0px;}
.gridSettings .btn::before {display: none !important;}
.gridSettings .btn img {width: 16px; margin: 0;}
.gridSettings {width: 40px; position: absolute; height: 20px; z-index: 62; right: 15px; top:50px; }
.gSettings .column-selector-content {align-self: start !important }
.topC {height: 89px; position: relative;   border-bottom: 1px solid #E9ECEF;}
.cGrid .table-content {margin: 24px;}
.cGrid .gridSettings { right: 39px;  top: 170px;}
.cGrid .pagination-bar {margin: 0 24px 0 24px;}
.table .align-column-right {padding-right: 10px; text-align: right;}
.td-custom-content {width: 100%; display: block;}
.widget-datagrid-load-more {  padding: 10px 40px !important;}
.flexDate {flex-basis: 306px;}
.flexAmount {flex-basis: 120px;}
.flexSelectL { flex-basis: 260px;}
.flexSelect { flex-basis: 200px;}
.flexSelectS { flex-basis: 110px;}
.widget-datagrid-content.infinite-loading {overflow-y: visible;}



/* Alerts */
.alert {padding: 12px 16px !important; color: #335e92;  border-color: #b2c7e9;  background-color: #eaf3fd;}
.alert-primary {border-color: var(--primary-40); background-color: #FEDDC1; color: var(--text-base-color)}
.alert-success {border-color: #75B798; background-color: #D1E7DD; color: #0F5132}
.alert-warning {border-color: #f9ebe0; background-color: #fbf1e9; color: #d27523}
.alert-warning a {color: #9d5312; text-decoration: underline;}
.alert-danger {border-color: #F1AEB5; background-color: #F8D7DA; color: #842029}
.fakeLine {position: absolute; height: 32px; left: 50px;  margin: -5px 0 0 0px;  right: 31px;}

/* PopUp */
.ss4PopUp {z-index: 125 !important;}
.modal-dialog .modal-content .modal-header {padding: 20px;}
.modal-dialog .modal-content {border-radius: 4px; box-shadow: none; border: 1px solid var(--gray-400);}
.modal-dialog .modal-content .modal-header  {border-bottom: 1px solid var(--gray-400);}
.modal-dialog .mx-dataview-controls {text-align: right; margin: 0 -24px;  padding: 20px 24px 0 24px; border-top: 1px solid var(--gray-400);}
.mx-window.mx-window-view .mx-window-body > .mx-placeholder > .mx-dataview > .mx-dataview-controls {border-top: 1px solid var(--gray-400);}
.mx-window-view .mx-window-body > .mx-placeholder > .mx-dataview > .mx-dataview-content {color: var(--secondary);}
.modal-dialog .modal-content .modal-header h4 {font-size: 18px; color: #000; margin-top: 7px; font-weight: bold;}
.modal-dialog .modal-content .modal-header .close {margin-top: 5px;}
.modal-dialog.ss4PopUp .modal-content .modal-header .close {width: 32px; height: 32px; text-align: center; border-radius: 16px; background-color: #ed7601; color: #fff;  font-size: 32px;   margin-top: 0;}
.modal-dialog.ss4PopUp .modal-content .modal-header .close:hover {background-color: #353e49;}
.modal-dialog.ss4PopUp .modal-content .modal-header {padding-bottom: 5; border-bottom: unset;} 
.modal-dialog.ss4PopUp .mx-scrollcontainer .mx-placeholder .mx-layoutgrid, .modal-dialog.ss4PopUp .mx-scrollcontainer .mx-placeholder .mx-layoutgrid-fluid {padding-top: 0 !important;}


 /* progress */
.mx-underlay {opacity: 0.8; background-color: #000;}
.mx-progress {background:none; padding: 0; top:50%; width: 74px; margin-top: -37px;}
.mx-progress-message {color: #fff !important;  position: relative;  width: 500px;  text-align: center;  display: block;  left: 50%;  top: 125px;  font-size: 18px; transform: translate(-50%, 0); max-width: 80vw;}
.mx-progress .mx-progress-indicator {border-width: 8px;  border-style: solid;  border-color: var(--primary-60) var(--primary-60) var(--primary-60) transparent;  width: 74px;  height: 74px;  border-radius: 50%;  animation: spin 1.5s infinite;  position: relative;  margin:0; background: none; }  
.mx-progress .mx-progress-indicator:before, .mx-progress .mx-progress-indicator:after {content: ''; width: 8px;  height: 8px;  border-radius: 50%;    position: absolute;   left: 8px; background: none; }
.mx-progress .mx-progress-indicator:before {top: 8px; }
.mx-progress .mx-progress-indicator:after {bottom: 8px;}


/* SS4 */
.ss4 {font-family: 'Open Sans', sans-serif; color:#353e49; font-size: 15px;}
.ss4 h1, .ss4 h2, .ss4 h3, .ss4 h4, .ss4 h5, .ss4 h6 {font-family: 'Open Sans', sans-serif; font-weight: 600; color:#353e49;}
.ss4 h1 {font-size: 1.7rem;}
.role-anonymous .ss4 h1 {font-weight: 800;}
.ss4 h2 {font-size: 1.33rem;}
.ss4 h3 {font-size: 1.2rem;}
.ss4 h4 {font-size: 1.1rem;}
.ss4Right strong {font-weight: 600;}
.ss4Content {padding: 0 2rem; flex: 0 1 auto; min-height: 100vh; flex-grow: 1; max-width: 100%; background-color: #fff; display: flex; flex-direction: column;}
.SS4bottomPanel {padding: 2rem 2rem; margin:auto -2rem 0 -2rem; background-color: #f4f5fa;}
.ss4Right {flex: 0 1 auto; width: 455px; min-width: 455px; min-height: 100vh; background: url(/images/sidebarbg.png) 0 0 no-repeat,linear-gradient(270deg,#17375e,#0f2b4d); color: #fff !important; font-size: 14px; padding:30px;  transition: margin 0.5s ease;  position: relative;}


.ss4Right a {background-repeat: no-repeat;  background-size: 100% 1px;  background-position: 0 100%;  transition: color .2s cubic-bezier(.96,.01,.58,1);  background-image: linear-gradient(#fe943c,#fe943c); color: #fff; text-decoration: none;}
.ss4Right a:hover {color: #fe943c;}
.ss4Right h1, .ss4Right h2, .ss4Right h3, .ss4Right h4, .ss4Right h5, .ss4Right h6 {color: #fff; margin:0 0 1rem 0;}
.ss4Foot {border-top: 1px solid #d8dfe7; padding: 1rem 2rem; font-size: 14px; margin: 0 -2rem; background-color: #fff;}
.benPanel .ss4Foot { margin:auto 0 0 0}
.ss4Right .mx-groupbox > .mx-groupbox-header {background: none; border: 0;  border-bottom: 1px solid hsla(0,0%,100%,.1); color: #fff; border-radius: 0; font-size: 14px; padding: 10px 0;}
.ss4Right .mx-groupbox > .mx-groupbox-body {background-color: unset !important; border: 0; padding: 1rem 0;}
.ss4Right .mx-groupbox > .mx-groupbox-body img {margin-bottom: 10px;}
.ss4Right .mx-groupbox-collapse-icon {color: #fe811c; font-size: 12px; margin-top: 0.4em !important;}
.chair {right: 40px; position: absolute; bottom: 0;}
.ss4 .mx-scrollcontainer-wrapper {overflow-x: hidden !important;}
.infPage {line-height: 1.7em;}
.ss4FootLinks a, .role-anonymous .ss4Content a {background-repeat: no-repeat; background-size: 100% 1px; background-position: 0 100%; text-decoration: none !important;  transition: background-size .2s cubic-bezier(.96,.01,.58,1);  background-image: linear-gradient(#fe943c,#fe943c); color: #353e49; }
.ss4FootLinks a {font-size: 16px;}
.ss4FootLinks a:hover, .role-anonymous .ss4Content a:hover, .ss4login .ss4loginh, .ss4pp .ss4pph, .ss4d .ss4dh {text-decoration: none; color: #fe943c; background-size: 100% 100%; color: #353e49;}
.ss4Inf p {padding: 0 !important; margin: 0 !important; line-height: 1.6em;}
.ss4Right .ss4Inf {margin-bottom: 3rem;}
.ss4 .np td {padding: 0;}
.ss4icon {margin-top: -5px;}
.ss4 .mx-scrollcontainer .mx-placeholder {height: auto;}
.ss4FootLinks a {margin-right: 20px; white-space: nowrap;}
.ss4FootLinks .img-responsive {min-width: 64px;}
.ss4InfoBox {border: 1px solid #ee791c;  border-radius: 4px;  padding:1rem 1.5rem; position: relative;}
.ss4InfoBox::before {display: block; content: ''; width: 24px; height: 24px; position: absolute; top:14px; left: -12px; background-image: url(/images/info.svg);}
.ss4Blue {background-color: #17375e;}
.ss4Blue > .flex {max-width: 2560px;}
.role-anonymous .ss4Blue > .flex {max-width: 1920px;}
.topPanel {position: relative;}
.ss4 .widget-gallery-item-button {display: flex; height: 100%;}
.widget-rating .rating-item {opacity: 1 !important;}
.smallStar .rating-image {width: 27px;}
.profile-desktop .ss4TopBen, .profile-desktop .ss4contScroll, .ss4Foot {min-width: 1070px;}
.profile-desktop .ss4Content {overflow-x: auto;}
.navbar-nav > li {float: left;}

/* ss4 form */
.ss4 .form-group .control-label, .ss4 label {color:var(--ss4-darkGrey); font-size: 14px; line-height: 1.2857142857;  font-weight: 600; margin:0 0 0.3em 0.3em;}
.form-group.mx-checkbox .control-label {margin: 0 0 0 8px;  width: calc(100% - 28px);  line-height: 1.5em;  padding:1px 0 0 0; display: block;}
.ss4 .form-control {background-color: #fff; border: 1px solid #ccd0d4;  border-radius: 5px; font-size: 14px;  color: #212121; font-family: 'Open Sans', sans-serif; padding: 11px 15px; line-height: 1.2em;}
.ss4 .form-control[disabled], .ss4 fieldset[disabled] .form-control {background-color: #f8f8f8;}
.ss4 .form-control:focus {padding: 11px 16px; border-color: #989ea6 !important;}
.ss4 .has-error .form-control {border-color: #DC3545 !important; padding: 11px 40px 11px 16px !important; background-image: url(/images/warning.svg);  background-repeat: no-repeat;  background-position: calc(100% - 10px) 6px;}
.ss4  .table-content .form-control:focus {padding: 7px 10px;}
.ss4 .srs .form-control:focus {padding: 11px 16px !important;}
.ss4 .btn, .ss4 .mx-button {background-color: #fe943c; border: 2px solid #fe8623;}
.ss4 .btn:hover, .ss4 .mx-button:hover, .ss4 .btn:focus, .ss4 .mx-button:focus {background-color: #fe8623;}
.ss4 .btn-inverse {background-color: #fff; }
.ss4 .mx-radiobuttons .radio input[type=radio]::before {border:2px solid #ee791c; width: 20px; height: 20px;}
.ss4 input[type=radio] {min-width: 20px; width: 20px; height: 20px;}
.ss4 input[type=radio] + label {margin: 3px 0 1px 0; font-weight: 400;}
.ss4 input[type=checkbox] + label {font-weight: 400 !important;}
.ss4 .brakeSelect input[type=checkbox] + label {white-space: normal;}
.ss4 .mx-radiobuttons .radio input[type=radio]:checked::before {background-color: #fff;}
.ss4 .mx-radiobuttons .radio input[type=radio]:checked::after {background-color: #fe8623;}
.ss4 .mx-radiobuttons .radio input[type=radio]::after {width: 10px;  height: 10px; background-color: #fff;}
.ss4 .mx-button:focus::before {display: none;}
.req .control-label::after, label.req::after, .mx-text.req::after {content: '*'; color:#ee791c;}
.shortInput .form-control  {min-width: 90% !important; width: 1px !important; padding-left:0 !important; padding-right: 0 !important; text-align: center; margin: 0 5%;}
.hideInput input, .hideInput label {display: none;}
.ss4 input[type=checkbox], .ss4 input[type=checkbox]:before, .ss4 input[type=checkbox]:checked:after {width: 20px; height: 20px; margin: 1px 0 0 0 !important;}
input[type=checkbox]:not(:disabled):not(:checked):hover:after {display: none;}
.ss4infc img {max-width: 32px !important; height: auto;}
.ss4 .widget-datagrid .table .th {text-transform: unset;}
.rIcon {width: auto; display: flex;  justify-content: center;}
.rIcon img, .rIcon span {order: 2; margin-left: 5px;}
.ss4 .widthxs {width: 500px;}
.linkR {position: absolute; display: block; right: 0; top: 6px;}
.dropFull .fileDropper .filedropper__dropzone {width: 100% !important;}
.simpleForm {margin: 0 !important; padding: 0 !important; border: none !important;}
.inputLargeFont .form-control {font-size: 2rem;}



/* SS4 Login page */
.birds {margin: 0 auto;}
.birdCont {width: 100%; position: absolute; width: 100%; top:0px;}
.logoAvalon {margin-top: 55px;}
.topPanel { z-index: 1;}
.loginAlert .alert {font-size: 14px; width: 100%;}

/* SS4 Registration */

.ss4Steps {justify-content: space-between;  margin-left: -0.625rem;  margin-right: -0.625rem; position: relative;}
.ss4Steps::before {height: 1px; width: 100%; position: absolute; width: 100%; left: 0; top:13px; background-color: #bdbdbd; content: '';}
.ss4Step {background-color: #fff; padding: 0 0.625rem; z-index: 2;}
.ss4No {display: inline-block; width: 30px; height: 30px; line-height: 27px; border: 1px solid #ee791c; text-align: center; color: #ee791c; margin: -2px 10px 0 0; border-radius: 15px; font-size: 13px; vertical-align: middle;}
.ss4StepActive {font-weight: 700;}
.ss4StepActive .ss4No {background-color: #ee791c; color: #fff;}
.ss4Potw {border: 1px solid #ee791c;  border-radius: 0.375rem; margin: 2rem 0; padding: 1rem 1.5rem; position: relative;}
.ss4Potw h4 {position: absolute;  top: -12px;  left: 13px;  background-color: #fff;  color: #ee791c;  font-weight: 700;  margin: 0;  padding: 0 10px;}
.ss4 .pdf-doc .top-Bar {display: none;}
.ss4 .pdf-div {border: 0; padding: 0;}
.ss4prev, .ss4next {position: absolute; left: -30px; width: 20px; height: 100%; top:0}
.ss4next {left: auto; right: -30px; }
.ss4prev img, .ss4next img {position: absolute; top: 50%; width: 20px; height: 34px; margin-top: -12px; cursor: pointer;}
.ss4prev {transform: rotate(180deg);}
.fileNo {position: absolute;  left: 50%;  font-weight: 700;  font-size: 24px;  top: 9px; transform: translate(-50%, 0);}
.ss4 .ss4osw input[type=checkbox] + label {font-size: 16px !important; font-weight: 600 !important; line-height: 1.6em !important;}
.ss4 .srs .srs-text {white-space: nowrap;}
.ss4 .form-group {flex-direction: row;}
.ss4 .filedropper .alert {margin-bottom: 25px;}
.ss4 input[type=radio]:before {border: 1px solid #c5c5c5;}

.forgotPassword {position: absolute; right: 0; margin-top: -3px; font-weight: 600; background-image: none !important; font-size: 0.9rem !important;}
a:hover.forgotPassword {color: #ee791c;}

/* SS4 Layout */ 
.ss4TopBen {height: 80px; background-color: #fff; box-shadow: 0 2px 10px rgba(92,99,107,.1); }
.ss4TopBen > flex {max-height: 100%;}
.benPanel {padding: 0 !important; min-height: 100vh; background-color: #f4f5fa;}
.benContent {padding:0 2rem;}
.ss4TopBen .mx-navbar {background-color: unset; margin: 0 1rem; display: inline-block;}
.ss4TopBen .mx-navbar-item {height: 80px; display: flex;  }
.ss4TopBen .mx-navbar-item.active a {background-color: #fff !important; }
.ss4TopBen .mx-navbar-item.active a::after {height: 2px; width: 100%; position: absolute; bottom: 0; left: 0; background-color: var(--primary-60); content: '';}
.ss4TopBen .mx-navbar-item a {border-radius: 0 !important; background-image:unset; font-size: 1rem !important; padding: 0 1rem !important;}
.ss4TopBen .mx-navbar-item a:hover {background-color: #f3f3f3 !important;}
.ss4TopBen .mx-navbar-item a:focus {background-color: #ffffff !important;}
.whiteBg {background-color: #fff; padding: 1.3rem; border-radius: 1rem; box-shadow: 0 2px 4px rgba(92,99,107,.1); border-radius: 10px; margin-bottom: 2rem;}
.moveRight {margin-left: auto !important;}
.noCaret .caret {display: none;}
.ss4drop .btn {background-color: #fff !important; border-radius: 0 !important; border: 0 !important; height: 80px; box-shadow: unset !important; font-weight: 400;}
.ss4drop .btn::before {display: none !important;}
.ss4drop.dropdown>.dropdown-menu {padding: 0;}
.ss4 .dropdown button .glyphicon {margin: 0;}
.ss4drop .dropdown-menu a {color: #212529;  white-space: nowrap;  display: block;  padding: 0.5rem 1rem;  border-bottom: 1px solid rgba(0,0,0,0.08);}
.ss4drop .dropdown-menu a:last-child {border: 0;}
.ss4drop .dropdown-menu a:hover {background-color: rgba(0,0,0,0.04); text-decoration: none;}
.bell .glyphicon {max-height: 36px;  line-height: 36px;  font-size: 30px; color: #575757;}
.bell.open .glyphicon {color: #777;}
.initials { display: inline-flex;  align-items: center;  justify-content: center;  flex-direction: column;  width: 36px;  height: 36px;  border-radius: 50%;  background: #102c4e;  color: #fff;  font-size: 14px;  font-weight: 600; margin:0 -10px 0 10px; position: relative; z-index: 10;}
.ss4 .widget-datagrid {display: block;}
.ss4 .pagination-button {border: 1px solid #ccd0d4 !important; height: 38px; width: 38px;  text-align: center;  font-size: 14px;  padding: 0;  display: inline-flex;  align-items: center;  justify-content: center;  color: #353e49 !important;  box-shadow: none;  transition: .2s cubic-bezier(.96,.01,.58,1);  font-weight: 600; border-radius: 0; border-right: 0 !important; background-color: unset !important;}
.ss4 .pagination-button:first-child {border-top-left-radius: 0.25rem !important;  border-bottom-left-radius: 0.25rem !important;}
.ss4 .pagination-button:last-child {border-top-right-radius: 0.25rem !important;  border-bottom-right-radius: 0.25rem !important; border-right: 1px solid #ccd0d4 !important;}
.ss4 .pagination-bar .pagination-icon {width: 18px; height: 18px; display: block; position:  relative; top: unset;}
.ss4 .pagination-bar .pagination-button:disabled {color: #ccd0d4 !important; cursor: not-allowed; background-color: unset !important;}
.ss4 .pagination-bar {margin-top: 1rem; justify-content: flex-end; align-items: center; margin: 1rem 0 0 0;}
.ss4 .pagination-button::before {display: none;}
.ss4 .pagination-button:hover { background: #102c4e !important;  border-color:#102c4e !important;  color: #fff !important;}
.ss4 .paging-status {border: 1px solid #ccd0d4; border-right: 0; height: 38px; white-space: nowrap; padding: 5px 10px;}
.ss4 .widget-datagrid .table .tr:hover .td {background-color: #f7f7f7;}
.paperLink {color: #326db6; margin-top: 10px; font-weight: 600; cursor: pointer;}
.paperLink:hover span {text-decoration: underline; }





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

.ss4 .dropdown-menu {z-index: 100;}
.newsPopUp .modal-header {display: none;}
.newsPopUp {left: 50% !important; top:50% !important; transform: translate(-50%, -50%); max-height: 90vh;}
.newsPopUp .modal-content {border-radius: 10px !important;}
.newsPopUp .mx-dataview-content {max-height: 90vh;}
.closeNews {position: absolute; right: 10px; top:10px; width: 32px; height: 32px; text-align: center; border-radius: 16px; background-color: #ed7601; color: #fff; line-height: 32px;}
.closeNews:hover {color: #fff; background-color: #353e49;}
.closeNews .glyphicon {top:3px}
.ss4 .ql-editor {line-height: 1.7857142863;}
.newPopUp a {text-decoration: none;}
.popList {width: 400px; max-width: 90vw; padding: 1rem; cursor: pointer;}
.popList:hover {background-color: #f3f7f9;}

/*# ::::: SS4 - TitleBar ::::: #*/
.ss4 .titleBar{display:flex;align-items:center;margin-top:1.2rem;margin-bottom:1rem;}
.ss4 .titleBar .btn{display:inline-block;margin:0 0 0 10px;}


/*# ::::: SS4 - Buttons [think what to do about this section later; ask Karol] ::::: #*/
.ss4 .btn.btn-primary, 
.ss4 .mx-button.btn-primary{vertical-align:middle;padding:10px 40px 9px 15px;position:relative;font-size:14px;}
.ss4 .btn.btn-primary img, 
.ss4 .mx-button.btn-primary img{right:15px;position:absolute;margin:auto;top:0;bottom:0;}


/*# ::::: SS4 - Colors [first section from Mr K mobile, second/third from beneficiary panel] ::::: #*/
:root {
  --ss4-blueDark: #21496B;
  --ss4-blueMedium: #416CB1; /* Otrzymany, otrzymano doksy */
  --ss4-blueLight: #E3F1FD;
  --ss4-greenDark: #2E5837;
  --ss4-greenMedium: #4CA154; /* Gotowy do zapłaty, zapłacony, wyksiegowany */
  --ss4-greenLight: #E2FBE8;
  --ss4-orangeDark: #773720;
  --ss4-orangeMedium: #D9622B; /* Weryfikowany */
  --ss4-orangeLight: #FCEED8;
  --ss4-redDark: #900E12;
  --ss4-redMedium: #AA2327; /* Brak srodków, anulowany, do uzupełniena */
  --ss4-redLight: #F9E8E8;
  --ss4-purpleDark: #5E0775; /* Oczekujacy na zaplate */
  --ss4-purpleMedium: #711789;
  --ss4-purpleLight: #EFDDF3;  

  --ss4-lightGrey: #ccd0d4; 
  --ss4-mediumGrey: #989ea6; /* Niezupelniony */
  --ss4-darkGrey: #575757;
  --ss4-black: #353e49; /* text Color? */
  --ss4-superBlack: #212529; 
  --ss4-placeholder: #999ea5;
  
  /* Nie wiedziałem jak je nazwać - używają tam innych kolorów niz w całej apce... */
  --ss4-tableHead: #f3f7f9;
  --ss4-tableBorder: #d8dfe7;
  --ss4-tableGreyHover: #ECECEC;
  --ss4-tableLinkHover: #ed7601;

  --ss4-white: #fff;
}


/*# ::::: SS4 - DataGrid2 ::::: #*/
.ss4 .widget-datagrid .header-filters {margin-bottom:15px;}
.ss4 .widget-datagrid .header-filters .tableTitle{margin:0;font-weight:700;font-size:20px;}
.ss4 .widget-datagrid .header-filters .filter-selector{display:none;}
.ss4 .widget-datagrid .header-filters .filter-input, .ss4 .widget-datagrid .header-filters .dropdown-triggerer, .ss4 .widget-datagrid .header-filters .form-control, .ss4 .th .form-control {width:100%;border:1px solid var(--ss4-lightGrey) !important;padding:8px 14px;height:38px;color:var(--ss4-darkGrey);}
.ss4 .th .form-control:focus {padding:8px 14px;}
.ss4 .widget-datagrid .header-filters .filter-input:focus{border-color:var(--ss4-mediumGrey) !important;}

.ss4 .widget-datagrid .table {margin-bottom:0;}
.ss4 .widget-datagrid .table .th {background-color:var(--ss4-tableHead);text-transform:unset; border-bottom:2px solid var(--ss4-tableBorder);border-radius:0;color:var(--ss4-superBlack);}
.ss4 .widget-datagrid .table .th:first-child {border-top-left-radius: 7px; }
.ss4 .widget-datagrid .table .th:last-child {border-top-right-radius: 7px; }
.ss4 .widget-datagrid .table .th .column-header span {font-size:0.8rem;line-height:1.2em;}
.ss4 .widget-datagrid .table .th .column-header svg{margin-top:0;}
.ss4 .widget-datagrid .table .td > .td-text, 
.ss4 .widget-datagrid .table .td * {font-size:var(--small-font);}

.ss4 .widget-datagrid .table .td{border-color:var(--ss4-tableBorder);padding: 0.7rem ;min-width:1px;transition:.2s cubic-bezier(.96,.01,.58,1);}
.ss4 .widget-datagrid .table .tr:hover .td{background: var(--ss4-tableGreyHover);} /* Wywalić lub zmienić transition na hoverze wiersza, trwa zbyt długo */

.ss4 .widget-datagrid .table .th:last-child,
.ss4 .widget-datagrid .table .td:last-child{padding-right:1rem;}

.ss4 .widget-datagrid .table .imgActionButtons{margin:0;position:relative;right:unset;display:flex;justify-content:flex-end;}
.ss4 .widget-datagrid .table .imgActionButtons .imgLink{margin:0 0 0 5px;}
.ss4 .widget-datagrid .table .imgActionButtons .imgLink img{max-height:24px;}

.ss4 .widget-datagrid .table-footer{margin-top:15px;} /* Zamienić na 1rem? Ask Karol */
.ss4 .widget-datagrid .table-footer .pagination-bar{margin:0;}

.ss4 .table .th .column-container {align-self: end;}
.noGridHeader .th {display: none !important; }
.noGridHeader {display: block !important;}
.noGridHeader .widget-datagrid-content.infinite-loading {margin-bottom: 0 !important;}


/*# ::::: SS4 - DataGrid2 additional styles ::::: #*/
.ss4 .marker{background-color:var(--ss4-tableHead);border-radius:4px;padding:3px 7px;text-transform:uppercase;font-weight:600;font-size:var(--small-font);line-height:var(--small-font);color:#fff;text-align:center;margin-right:8px;}
.ss4 .ss4blue .marker{background-color:var(--ss4-blueMedium);}
.ss4 .ss4orange .marker{background-color:var(--ss4-orangeMedium);}
.ss4 .ss4green .marker{background-color:var(--ss4-greenMedium);}
.ss4 .ss4red .marker{background-color:var(--ss4-redMedium);}
.ss4 .ss4grey .marker{background-color:var(--ss4-mediumGrey);}
.ss4 .ss4purple .marker{background-color:var(--ss4-purpleDark);}

.ss4 .markerStatus, .ticketCont .markerStatus {background-color:var(--ss4-tableHead);border-radius:4px;padding:5px 7px;display:inline-block;font-weight:600;font-size:0.85rem;line-height:var(--small-font);color:#fff; text-transform: uppercase; }
.ss4 .ss4blue .markerStatus, .ticketCont .ss4blue .markerStatus  {background-color:var(--ss4-blueLight);color:var(--ss4-blueDark);}
.ss4 .ss4orange .markerStatus, .ticketCont .ss4orange .markerStatus {background-color:var(--ss4-orangeLight);color:var(--ss4-orangeDark);}
.ss4 .ss4green .markerStatus, .ticketCont .ss4green .markerStatus {background-color:var(--ss4-greenLight);color:var(--ss4-greenDark);}
.ss4 .ss4red .markerStatus, .ticketCont .ss4red .markerStatus {background-color:var(--ss4-redLight);color:var(--ss4-redDark);}
.ss4 .ss4grey .markerStatus, .ticketCont .ss4grey  .markerStatus {background-color:var(--ss4-lightGrey);color:var(--ss4-darkGrey);}
.ss4 .ss4purple .markerStatus, .ticketCont .ss4purple  .markerStatus {background-color:var(--ss4-purpleLight);color:var(--ss4-purpleDark);}

.ss4 .widget-datagrid .table .titlewithSubtitle > *{margin:0;padding:0;line-height:1.28;display:block;}
.ss4 .widget-datagrid .table .titlewithSubtitle > *:first-child{color:var(--ss4-black);font-weight:700;word-break:break-word;transition:.2s cubic-bezier(.96,.01,.58,1);}
.ss4 .widget-datagrid .table .tr:hover .titlewithSubtitle > *:first-child{color:var(--ss4-tableLinkHover);}

.ss4 .widget-datagrid.docTable .table .td{padding-right:0;}

.ss4 .widget-datagrid.transferTable .subaccountTableBar > div{padding:1rem;}
.ss4 .widget-datagrid.transferTable .subaccountTableBar > div:last-child{ padding: 0.5rem 0;}
.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableSubTitle{color:var(--ss4-black);font-size:14px;line-height: 1.5;}
.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters{border-top:1px solid var(--ss4-tableBorder);border-bottom:2px solid var(--ss4-tableBorder);margin:0px 0 15px;padding:1rem;display:flex;}
.ss4 .widget-datagrid.transferTable.applicationTable .subaccountTableBar .tableFilters {border: 0;}


.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters label{display:block;}
.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .widerSearch{max-width:600px;width:100%;margin-right:20px;}
.ss4 .widget-datagrid.applicationTable .subaccountTableBar .tableFilters .widerSearch {max-width:750px;width:100%;}
.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .flexRight{display:flex;align-items:flex-end;}
.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .flexRight > div{width:170px;position:relative;}
.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .flexRight > div:first-child{padding-right:0;margin-right:10px;width:250px;}
/*.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .flexRight > div:first-child::after{content: "—";
  position: absolute;
  bottom: 50%;
  right: 0;
  margin-bottom:2px;
  color: #989ea6;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);}*/

  .ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .flexRight .filter-container{position:relative;cursor:pointer;}

  .ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .flexRight .filter-input{width:unset;padding-right:35px;}
  .ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .flexRight .btn-calendar{position:absolute;right:10px;bottom:50%;background:none;border:none;transform:translateY(50%);color:#58616c;font-size:39px;padding:0;}
.ss4 .widget-datagrid.transferTable .subaccountTableBar .tableFilters .flexRight .btn-calendar svg{width:22px;height:22px;}



/*# ::::: Grids with rows selector ::::: #*/
.rowSelBox{position:relative;}
.rowSelBox .rowDropd{display:none;opacity:0;position:absolute;left:0;bottom:0;margin:0;padding:0 1rem 1rem;transition:2s;}
.rowSelBox .rowDropd select{border:1px solid var(--ss4-lightGrey);height:38px;white-space:nowrap;padding:8px 14px;color:var(--ss4-darkGrey);font-size:var(--small-font);line-height:20px;width:70px;cursor:pointer;}
.rowSelBox .rowDropd select:focus{padding:8px 14px;}
.rowSelBox .rowDropd option[value=""]{display:none;}
.rowSelBox > div div ~ .rowDropd{display:flex;opacity:1;} /*# Hack to not display selector if there is no table #*/

/*# ::::: SS4 - forms ::::: #*/
.ss4 .form-control::placeholder{color:var(--ss4-placeholder);}
.ss4 .form-control:focus{border-color:var(--ss4-mediumGrey);}
.ss4 .hideLast .dropdown-list li:last-child {display: none;}

/* SS4 tab */
.ss4tab .nav-tabs a {background-color: #fff !important; padding:0.8rem 1rem 1.1rem 1rem !important;  border-top-left-radius: 6px !important; border-top-right-radius: 6px !important;  box-shadow: 0 -3px 4px rgba(92,99,107,.1); margin: 0 15px 0 0 !important; border-top: 3px solid #fff !important;border-bottom: 0 !important; font-weight: 500 !important;}
.ss4tab .nav-tabs .active a {border-top: 3px solid var(--primary-60) !important; border-bottom: 0 !important;}
.ss4tab .nav-tabs {margin-bottom: -6px;}

/*# ::::: SS4 - Highlighted news [right panel, clean/fix this after presentation] ::::: #*/
.ss4 .featuredNews{margin:0;}
.ss4 .featuredNews h2{color:var(--ss4-white);font-weight:700;font-size:20px;width:fit-content;line-height:1.3461538462;margin:0 0 1.25rem 0;}
.ss4 .featuredNews .widget-gallery .widget-gallery-items{grid-gap:0px;}
.ss4 .featuredNews .singleNewsContainer{display: flex;
  width: 100%;
  align-items: flex-start;
  border-top: 1px solid hsla(0,0%,100%,.15);
  padding-top: 20px;
  padding-bottom: 25px;
  transition: .2s cubic-bezier(.96,.01,.58,1);}
.ss4 .featuredNews .singleNewsContainer:hover{background-color:var(--ss4-blueDark);}
.ss4 .featuredNews .singleNewsContainer .newsThumbnail{width: 90px;
  height: 68px;
  flex-shrink: 0;
  margin-right: 20px;}
.ss4 .featuredNews .singleNewsContainer .newsThumbnail img{max-width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0px;
  background-color: unset;
  border: none;
  padding: 0;
  max-height: 150px;}
.ss4 .featuredNews .singleNewsContainer .newsText{color:var(--ss4-white);}
.ss4 .featuredNews .singleNewsContainer .newsText span{display: inline;
  color: hsla(0,0%,100%,.8);
  font-size: 14px;
  line-height: 1;
  padding: 2px 6px;
  border-radius: 2px;
  background: rgba(0,0,0,.3);
  }
.ss4 .featuredNews .singleNewsContainer .newsText p{font-size: 16px;
  line-height: 1.375;
  margin-top: 10px;
  margin-bottom: 0px;
  color: #fff;
  display: inline-block;
  transition: .2s cubic-bezier(.96,.01,.58,1);
    display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  }
.ss4 .featuredNews .widget-gallery-footer{display:none;}


/*# ::::: SS4 -  news list/articles ::::: #*/
.ss4 .newsList{margin:0;}
.ss4 .newsList .widget-gallery-filter{margin-bottom:15px;}
.ss4 .newsList .widget-gallery-filter .tableTitle{margin:0;font-weight:700;font-size:20px;}
.ss4 .newsList .widget-gallery-filter .form-control{width:286px;max-width:100%;border:1px solid var(--ss4-lightGrey) !important;padding:8px 14px;height:38px;color:var(--ss4-darkGrey);}
.ss4 .newsList .widget-gallery-filter .form-control:focus{border-color:var(--ss4-mediumGrey) !important;}

.ss4 .newsList .widget-gallery-items{grid-gap:1rem;}
.ss4 .newsList .newsArticle{display:flex;flex-direction:column;min-height:220px;width:100%;border-radius:10px;border:1px solid var(--ss4-tableBorder);}

.ss4 .newsList .newsArticle .newsThumbnail{border-radius:10px;overflow:hidden;flex-shrink:0;min-width:100%;height:200px;}
.ss4 .newsList .newsArticle .newsThumbnail > div{border:none;}
.ss4 .newsList .newsArticle .newsThumbnail img{vertical-align:middle;object-fit:cover;width:100%;height:100%;object-position:center;padding:0;margin:0;border:none;}

.ss4 .newsList .newsArticle .newsText{padding:24px;display:flex;flex-direction:column;}
.ss4 .newsList .newsArticle .newsText span{line-height:20px;font-size:13px;color:var(--gray-700);padding-left:16px;border-left:1px solid var(--primary-40);display:block;margin:0 0 15px;}
.ss4 .newsList .newsArticle .newsText h3{font-size:15px;margin:0;line-height:1.4;}
.ss4 .newsList .newsArticle .newsText p{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;margin:12px 0 2px;overflow:hidden;font-size:15px;line-height:1.5;}

.ss4 .newsList .newsArticle,
.ss4 .newsList .newsArticle span,
.ss4 .newsList .newsArticle h3,
.ss4 .newsList .newsArticle p{transition:all 0.25s ease 0s;}
.ss4 .newsList .newsArticle:hover{background:var(--ss4-blueDark);border-color:var(--ss4-blueDark);}
.ss4 .newsList .newsArticle:hover span,
.ss4 .newsList .newsArticle:hover h3,
.ss4 .newsList .newsArticle:hover p{color:#fff;}

/* SS4 application */
.flexWrap {flex-wrap: wrap;}
.ss4 .applicationType {border: 2px solid #326db6; padding:1rem; border-radius: 12px; cursor: pointer; text-align: center; min-width: 400px;}
.ss4 .applicationType:hover {background-color:#e0f2fe;}
.ss4 .applicationType.ss4grey {background-color: #f5f5f5;  border: 2px solid #d3d8e0; cursor: default;}
.ss4 .applicationType.ss4grey:hover {background-color: #f5f5f5;}
.newApplication {justify-content: center;}
.kSep {display: block;  margin: 5px 5px 0 5px;}

/* SS4 order wizard */
.orderWizard h2 {font-size: 1.2rem}
.profile-tablet .ss4 .orderWizard h2 {font-size: 1.1rem;}
.profile-phone .ss4 .orderWizard h2 {font-size: 0.9rem;}
.circle-box {flex: 1 1 calc(50% - 20px); display: flex; flex-direction: column; align-items: center; text-align: center;}
.circle  {width: 100px; height: 100px; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 2rem; color: white; font-weight: 900;}
.profile-phone .circle  {width: 75px; height: 75px; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 1.5rem; color: white; font-weight: 700;}
.leaflet {background-color: var(--primary-60);}
.leafletNone { background-color:#89898B;}
.description  { color: #89898B; font-weight: 600; margin:10px 0; font-size: 1.5rem;}
.orderWizard .itemsList .mx-validation-message {width: 100%; text-align: center; position: absolute; left: 0;  bottom: -10px;  font-weight: 600; }
.profile-tablet .orderWizard .itemsList .mx-validation-message {max-width:none; white-space: nowrap; transform: translateX(-200px); }
.orderWizard .paidLeafletsMessage { font-weight:600; color: #d27523; margin-left:5px; margin-top:4px; }
.itemsList input {text-align: center !important; font-size: 20px !important;  border-width: 2px !important;  font-weight: 600; padding: 7px !important;}
.orderWizard .widget-tooltip.widget-tooltip-right-start .widget-tooltip-arrow {left: -3px;}
.itemsList {margin:0 auto !important; }
.itemsList.has-error .form-control {margin-bottom: 20px; background-position: calc(100% - 10px) 11px !important;}

.orderWizard .table-content input[type=checkbox] {margin:1px 0 0 10px !important;}
.orderWizard .table-content input[type=checkbox].three-state-checkbox {margin:1px 0 0 0px !important;}

.fakeTabs {margin-bottom: -7px;}
.profile-tablet .fakeTabs, .profile-phone .fakeTabs {margin-bottom: -1px !important;}
.fakeTabs a {background-color: #fff !important; padding: 0.8rem 1rem 1.1rem 1rem !important;  border-top-left-radius: 6px !important;  border-top-right-radius: 6px !important;  box-shadow: 0 -3px 4px rgba(92, 99, 107, .1);  margin: 0 15px 0 0 !important;  border-radius: 4px 4px 0 0;  font-size: 16px;  text-decoration: none;  font-weight: 500;  white-space: nowrap;   color: var(--gray-700);}
.profile-tablet .fakeTabs a, .profile-phone .fakeTabs a {box-shadow: none;  border-radius: 0 !important;  font-size: 15px; margin-right: 0.55rem !important; background: #e3e3e3 !important; border-width: 2px; border-top:2px solid #e3e3e3 !important;  }
.profile-phone .fakeTabs a {font-size: 13px;  letter-spacing: -0.5px;  padding:0.6rem 0.5rem 0.7rem 0.5rem !important;}
.fakeTabs a:hover {color: var(--gray-700);}
.fakeTabs a.currentTab {border-top: 3px solid var(--primary-60) !important;}
.profile-tablet .fakeTabs a.currentTab, .profile-phone .fakeTabs a.currentTab {background-color: #fff !important;}




/* steps */

.steps {display: flex; padding: 15px 30px; position: relative; margin-top:20px; font-size: 1.05rem;}
.steps .step1 {font-weight: 700;}
.steps > div::before, .steps > .step4::after {position: absolute; height: 12px; width:12px; content: ''; top:-20px; left:-6px; background-color: #e0f2fe; border-radius: 6px;}
.steps > .step4::after {left: auto; right: -6px;}
.steps > div.step1::before {background-color: #326db6;}
.steps > div {flex:1; position: relative;}
.steps > div > span {transform: translate(-50%, 0); display: inline-block; }
.steps > div:last-child > span:last-child {transform: translate(50%, 0); position: absolute; right: 0;} 
.steps::before {position: absolute; height: 3px; width:calc(100% - 60px); content: ''; top:0; left:30px; background-color: #e0f2fe;}
.s2 .steps::after {position: absolute; height: 3px; width:calc((100% - 60px)*0.25); content: ''; top:0; left:30px; background-color: #326db6;}
.s3 .steps::after {position: absolute; height: 3px; width:calc((100% - 60px)*0.5); content: ''; top:0; left:30px; background-color: #326db6;}
.s4 .steps::after {position: absolute; height: 3px; width:calc((100% - 60px)*0.75); content: ''; top:0; left:30px; background-color: #326db6;}
.s5 .steps::after {position: absolute; height: 3px; width:calc(100% - 60px); content: ''; top:0; left:30px; background-color: #326db6;}
.s2 .step2::before, .s3 .step2::before, .s4 .step2::before, .s5 .step2::before {background-color: #326db6;}
.s2 .step2, .s3 .step2, .s4 .step2, .s5 .step2 {font-weight: 700;}
.s3 .step3::before, .s4 .step3::before, .s5 .step3::before {background-color: #326db6;}
.s3 .step3, .s4 .step3, .s5 .step3 {font-weight: 700;}
.s4 .step4::before, .s5 .step4::before {background-color: #326db6;}
.s4 .step4 span:first-child {font-weight: 700;}
.s5 .step4  {font-weight: 700;}
.s5 .step4::after {background-color: #326db6;}
.moreInfo {color:#326db6; margin-left: 4px;}


/* stepsOrder */

.stepsOrder {display: flex; padding: 15px 30px; position: relative; margin-top:20px; font-size: 1.05rem;}
.stepsOrder .step1 {font-weight: 700;}
.stepsOrder > div::before, .stepsOrder > .step2::after {position: absolute; height: 12px; width:12px; content: ''; top:-20px; left:-6px; background-color: #e0f2fe; border-radius: 6px;}
.stepsOrder > .step2::after {left: auto; right: -6px;}
.stepsOrder > div.step1::before {background-color: #326db6;}
.stepsOrder > div {flex:1; position: relative;}
.stepsOrder > div > span {transform: translate(-50%, 0); display: inline-block; }
.stepsOrder > div:last-child > span:last-child {transform: translate(50%, 0); position: absolute; right: 0;} 
.stepsOrder::before {position: absolute; height: 3px; width:calc(100% - 60px); content: ''; top:0; left:30px; background-color: #e0f2fe;}
.st2 .stepsOrder::after {position: absolute; height: 3px; width:calc((100% - 60px)*0.5); content: ''; top:0; left:30px; background-color: #326db6;}
.st3 .stepsOrder::after {position: absolute; height: 3px; width:calc((100% - 60px)); content: ''; top:0; left:30px; background-color: #326db6;}
.st2 .step2::before, .st3 .step2::before {background-color: #326db6;}
.st2 .step2 span:first-child {font-weight: 700;}
.st2 .step2::before {background-color: #326db6;}
.st3 .step2  {font-weight: 700;}
.st3 .step2::after, .st3 .step2::before {background-color: #326db6;}

/*stepsCard*/
.stepsCard {display: flex; padding: 15px 30px; position: relative; margin-top:20px; font-size: 1.05rem;}
.stepsCard .step1c {font-weight: 700;}
.stepsCard > .step1c::before, .stepsCard > .step2c::after {position: absolute; height: 12px; width:12px; content: ''; top:-20px; left:-6px; background-color: #e0f2fe; border-radius: 6px;}
.stepsCard > .step2c::after {left: auto; right: -6px;}
.stepsCard > div.step1c::before {background-color: #326db6;}
.stepsCard > div {flex:1; position: relative;}
.stepsCard > div > span {transform: translate(-50%, 0); display: inline-block; }
.stepsCard > div:last-child > span:last-child {transform: translate(50%, 0); position: absolute; right: 0;} 
.stepsCard::before {position: absolute; height: 3px; width:calc(100% - 60px); content: ''; top:0; left:30px; background-color: #e0f2fe;}
.st3 .stepsCard::after {position: absolute; height: 3px; width:calc((100% - 60px)); content: ''; top:0; left:30px; background-color: #326db6;}
.st3 .step2c  {font-weight: 700;}
.st3 .step2c::after {background-color: #326db6;}


/* Tickets */

.tickets .mx-scrollcontainer-center .mx-scrollcontainer-wrapper {overflow: visible !important;}
.tickets .widget-datagrid-content {max-height: calc(100vh - 188px); overflow-y: auto;}
.tickets .widget-datagrid-content::-webkit-scrollbar {width: 5px;}
.tickets .widget-datagrid-content::-webkit-scrollbar-track {background: #fff;}
.tickets .widget-datagrid-content::-webkit-scrollbar-thumb {background: rgba(0,0,0,0.3); border-radius: 5px;}
.tickets .widget-datagrid-content::-webkit-scrollbar-thumb:hover {background: rgba(0,0,0,0.5);}
.mx-scrollcontainer-left .mx-scrollcontainer-wrapper {max-height: 100vh;}
.ticketTypeSelect {position: absolute; top: -89px; right: 10px;    z-index: 100;}
.ticketTypeSelect .dropdown-triggerer, .ticketTypeSelect .widget-combobox-input-container {padding: 11px 10px !important;}
.tickets .leftAndHeaderContent .mx-scrollcontainer-left  {width: 253px !important;}
.widget-combobox-selected-items {line-height: 18px;}
.bgray {font-weight: 400;  font-size: 14px;  border-color: #dee2e6;}
.bgray::before {display: none !important;}
.bselect {border: 1px solid #27ae60 !important;  color: #27ae60 !important;  font-weight: 600 !important;}
.ticketDetails .topContainer {overflow: visible; z-index: 100;}
.ticketAuthor {position: absolute; top:-20px; padding: 7px 15px; }
.commentList {padding: 2rem 1.5rem; position: relative;}
.mx-name-comments:first-child {border-top: 1px solid var(--gray-300);}
.mx-name-comments:last-child .commentList {padding-bottom: 2rem;}
.beneficiaryCommment {background-color: #f5f5f5;}
.widget-timeline-icon-wrapper {top:3px !important}
.newTicket .filedropper__dropzone {width: 100% !important; background: url(/images/FilePreview2.svg) no-repeat 45px center !important; padding: 23px 15px 21px 98px !important; background-color: var(--gray-100) !important;}
.profile-phone .newTicket .filedropper__dropzone {background: url(/images/FilePreview2.svg) no-repeat 15px center !important; padding: 23px 15px 21px 65px !important;}
.ticketDocList {display: inline-block; margin-right: 10px;}
.newTicket .filedropper__list {display: none;}
.ss4 .commentList { border-radius: 10px; background-color: #fff; border: 1px solid var(--gray-300); margin-bottom: 2.5rem; padding: 1.5rem 1.5rem 1rem 1.5rem;}
.ss4 .mx-name-comments:first-child {border: 0;}
.ss4 .ticketAuthor {border-radius: 10px;}
.ss4 .beneficiaryCommment .ticketAuthor {background-color:#f4f5fa;} 
.beneficiaryPictureImg {padding: 20px; width:400px;border: 1px solid #EAEAEA; background: #fff; border-radius: 30px; cursor: zoom-in !important;}
.commentAlert {border-left: #96170e solid 10px !important;}

/* Transfers */
.assignments{background-color: #000; border:2px solid #000; padding: 3px 9px; border-radius: 8px; color: #fff; font-size: 18px; margin-left: 5px; display: inline-block;} 
.wAssing {color: #000; background-color: #fff;}
.sDetails {background-color: var(--gray-100); padding: 1rem 1.5rem; border-radius: 8px;}
.inputBalance {margin-right: 20px; margin-bottom: 0;}
.inputBalance label, .ss4input label {font-weight: 400 !important; line-height: 15px;  font-size: 15px !important; color: var(--gray-600) !important;}
.inputBalance .form-control-static {font-size: 24px; font-weight: 700; padding: 0 40px 0 0;}
.inputGreen .form-control-static {color: var(--success);}
.inputRed .form-control-static {color: var(--danger);}
.ss4input .form-control-static {font-weight: 700; font-size: 16px; padding: 6px 0;}
.pln {color: var(--gray-600); position: absolute; right: 20px; bottom: 2px; }
.reload {position: absolute; left: 64px; z-index: 100; top:-1px;}
.transferFile {padding: 1rem; border-radius: 8px; border: 1px solid var(--gray-200); margin-bottom: 1rem;}
.orangeLine {background-color: var(--primary-60); height: 7px; width: 100%; position: relative; border-radius: 4px; }
.hideArrow .widget-tooltip-arrow {display: none;}
.ttip .widget-tooltip-content {width: auto;  padding: 10px 20px 0px 20px !important;  margin:0; z-index: 1000;}
.tError.widget-tooltip .widget-tooltip-content {font-weight: 400; text-align: left; padding: 1rem; background-color: #F8D7DA; color: #842029; border:1px solid #F1AEB5; box-shadow: unset;}
.tError.widget-tooltip .widget-tooltip-arrow, .tError.widget-tooltip .widget-tooltip-arrow:before {background-color: #F8D7DA; border-left:1px solid #F1AEB5; border-top:1px solid #F1AEB5; box-shadow: unset; top:-3px}
.tInfo.widget-tooltip .widget-tooltip-content {font-weight: 400; text-align: left; padding: 1rem; background-color: #cce5ff; color: #004085; border:1px solid #b8daff; box-shadow: unset;}
.tInfo.widget-tooltip .widget-tooltip-arrow, 
.tError.widget-tooltip .widget-tooltip-arrow:before {background-color: #cce5ff; border-left:1px solid #b8daff; border-top:1px solid #b8daff; box-shadow: unset; top:-3px}

.statsSectionBox .alert-primary{color:#004085;background-color:#cce5ff;border-color:#b8daff;}
.statsSectionBox .alert-info{color:#0c5460;background-color:#d1ecf1;border-color:#bee5eb;}

.popNoHeader .modal-header:not(.cHeader) {display: none;}
.overflow > .mx-scrollcontainer-wrapper {overflow: hidden !important;}
.overflow.mx-scrollcontainer-top {border: 0;}
.closeC {color: #0a1325 !important; font-weight: 600;  font-size: 19px;  margin-top: 3px; text-decoration: none !important; font-size: 34px;}
.cHeader {cursor: auto;}
.cNavC {font-size: 28px;  font-weight: 600;  margin: 3px 25px 0 15px !important;}
.pointer {cursor: pointer;}
.oh {overflow: hidden;}
.ws {white-space: nowrap; text-overflow: ellipsis;}




/*# ::::: Transfers info - menu ::::: #*/
.ss4PrevBox{margin-left:10px;}
.ss4PrevBox span{background-color:#000;border:2px solid #000;padding:2px 6px;border-radius:8px;color:#E9ECEF;display:inline-block;line-height:23px;transition:0.25s}
.ss4PrevBox span:last-child{margin-left:5px;background:none;color:#000;}
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a:hover .ss4PrevBox span:first-child, 
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a.active .ss4PrevBox span:first-child{color:var(--primary-50);}
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a:focus .ss4PrevBox span:first-child{color:#E9ECEF;}

.leftMenu .ss4MsgList{margin:var(--padding-size) 0;display:block;}
.leftMenu .ss4MsgList > div {margin-bottom:10px;}
.leftMenu .ss4MsgList .ss4Info{display:flex;padding:9px 16px;align-items:center;border-radius:8px;background:#000;margin-bottom:10px;transition:0.25s;}
.leftMenu .ss4MsgList .ss4Info p{font-size:14px;line-height:19px;font-weight:500;color:var(--primary-50);margin:0;padding:0;transition:0.25s;}
.leftMenu .ss4MsgList .ss4Info img{margin-right:10px;max-width:16px;max-height:17px;transition:0.25s;}
.leftMenu .ss4MsgList .ss4Info.success{background:#27AE60;}
.leftMenu .ss4MsgList .ss4Info.error{background:#DA1F3D;}
.leftMenu .ss4MsgList .ss4Info.success p,
.leftMenu .ss4MsgList .ss4Info.error p{color:#fff;}
.leftMenu .ss4MsgList .ss4Info:last-child,
.leftMenu .ss4MsgList > div:last-child{margin:0;}

.layout-atlas .mx-scrollcontainer-shrink:not(.mx-scrollcontainer-open) .leftMenu .ss4MsgList .ss4Info{width:56px;height:50px;padding:13px 20px;justify-content:center;}
.layout-atlas .mx-scrollcontainer-shrink:not(.mx-scrollcontainer-open) .leftMenu .ss4MsgList .ss4Info p{text-indent:-9999px;}
.layout-atlas .mx-scrollcontainer-shrink:not(.mx-scrollcontainer-open) .leftMenu .ss4MsgList .ss4Info img{margin:0;}

/* OperatingAccount */
.opAccount .widget-gallery-item {background-color: var(--gray-100); padding: 1rem 1.5rem 1.5rem 1rem; border-radius: 8px;}
.opAccount.mx-listview > ul {display: flex; flex-wrap: wrap; width: 101%; margin: 0 -0.5%;}
.opAccount.mx-listview > ul > li {border: 0; background-color: var(--gray-100) !important; padding: 1rem 1.5rem 1.5rem 1rem; border-radius: 8px; flex:0 1 auto; width: 24%; margin: 0.5%;}
.opAccount.mx-listview > ul > li.selected {background-color: #f5f5f5 !important;}
.opAccount.darkAccount .widget-gallery-item {background-color: #000; color: #fff;}
.opAccount.darkAccount h4, .opAccount.darkAccount label, .opAccount.darkAccount .pln {color: #fff !important;}
.opAccount.darkAccount label {margin-bottom: 28px;}
.opAccount.darkAccount .form-control-static {border-bottom: 1px solid rgba(255,255,255,0.2);}
.opAccount .inputBalance {margin: 0; width: 100%;}
.opAccount .pln {right: 0;}
.actAmount {position: absolute; top:23px; left: 0; font-weight: 700; color: var(--success);}
.redA {color: var(--danger);}
.subGallery {flex: 0 1 auto; }
.blockActions .btn {pointer-events: none; opacity: 0.6;}
.blockActions .widget-datagrid::before {position: absolute; width: 100%; height: 100%; background-color: rgba(255,255,255,0.5); z-index: 100; content: '';}
.alertPublication {position: absolute; width: 600px; left: 50%; transform: translate(-50%, 0); z-index: 101;}
.accTransfer .widget-accordion-group {border: 0; background-color: unset; border-bottom: 1px solid var(--gray-300);} 
.accTransfer .widget-accordion-group-header-button {padding: 0 !important; border-radius: 0 !important; }
.accTransfer .widget-accordion-group-header-button-icon {display: none;}
.accTransfer .widget-accordion-group-content {padding: 0 !important; margin: 0 !important; border: 0 !important;}
.closedAcc {display: none;}
.widget-accordion-group-collapsed .closedAcc {display: inline-block;}
.openAcc {display: inline-block;}
.widget-accordion-group-collapsed .openAcc {display: none;}


/* Assign transfers */
.transferGrid {margin:-15px 9px 0 0; display: block;}
.transferGrid .widget-datagrid-grid-body {display: block;}
.transferGrid .tr {display: flex; flex-wrap: wrap; width: 100%;}
.transferGrid .column-header span {text-wrap: unset !important;}
.transferGrid .th:last-child {display: none;}
.transferGrid .th .column-container {flex-direction: row !important;}
.scrollCont .infinite-loading {max-height: calc(100vh - 345px) !important; padding-right: 10px; padding-bottom: 90px;}
.scrollCont .mx-scrollcontainer-wrapper {overflow: hidden !important;}
.scrollCont .infinite-loading::-webkit-scrollbar {width: 5px;}
.scrollCont .infinite-loading::-webkit-scrollbar-track {background: #fff;}
.scrollCont .infinite-loading::-webkit-scrollbar-thumb {background: rgba(0,0,0,0.3); border-radius: 5px;}
.scrollCont .infinite-loading::-webkit-scrollbar-thumb:hover {background: rgba(0,0,0,0.5);}
.transferGrid .tr .th:nth-child(1), .transferGrid .tr .td:nth-child(1) {width: 50px;}
.transferGrid .tr .th:nth-child(2), .transferGrid .tr .td:nth-child(2) {flex:4;}
.transferGrid .tr .th:nth-child(3), .transferGrid .tr .td:nth-child(3) {flex:2;}
.transferGrid .tr .th:nth-child(4), .transferGrid .tr .td:nth-child(4) {flex:2;}
.transferGrid .tr .th:nth-child(5), .transferGrid .tr .td:nth-child(5) {flex:4;}
.transferGrid .tr .th:nth-child(6), .transferGrid .tr .td:nth-child(6) {flex:2;}
.transferGrid .tr .th:nth-child(7), .transferGrid .tr .td:nth-child(7) {flex:2;}
.transferGrid .tr .th:nth-child(8), .transferGrid .tr .td:nth-child(8) {flex:2;}
.transferGrid .tr .td:nth-child(9) {width: 100%; flex:0 1 auto; padding: 15px 1rem 13px 1rem !important; border-top:1px solid #e9ecef !important}
.transferGrid .table .tr:hover .td {background-color: unset;}
.transferGrid .table .tr.assignT .td {background-color: #fff;}
.transferGrid .table .tr .td {border:unset; padding-top: 10px; padding-bottom: 10px; cursor: default;}
.transferGrid .widget-datagrid-grid-body .tr:nth-child(n + 2) {border:1px solid #bdbdbd; border-radius: 8px; margin-top: 16px; background-color: #fbfbfb;}
.benMatch {display: inline-flex; border:1px solid #4a4a4a; border-radius: 4px; margin: 0 7px 7px 0; overflow: hidden;}
.benMatch.split {border: 0; border-radius: 0; margin: 5px 0 0 10px;  border-right: 1px solid #ccc;  padding-right: 10px;}
.benMatch.split:last-child {border: 0;}
.benMatch:not(.benSelected):hover {border: 1px solid #000; background-color: #f5f5f5; }
.onTransfer {display: inline-block;}
.benMatch .matchPercent {background-color: #F2F2F2; padding: 5px 10px;}
.benMatch .matchName {padding: 5px 10px;} 
.benSearch {display: inline-block; width: 230px; position: relative; margin-bottom: 7px;}
.benSearch .glyphicon-menu-down {display: none;}
.benSearch .form-control {padding-right: 0;}
.benTransfer {width: 100%;}
.benTransfer .glyphicon-remove {color: #fff; width: 21px; height: 21px; border-radius: 11px; background-color: var(--danger); padding: 5px; font-size: 12px;}
.hideCancel .glyphicon-remove {display: none;}
.popFoot {padding: 1rem; text-align: right;}
.popFoot .btn {margin-left: 6px;}
.assignMenu {    position: absolute; bottom: 0; z-index: 40; background-color: #fff;right: -10px; left: 0; padding-top: 15px; flex-wrap: wrap;}
.transferScroll .hideOnScroll, .transferScroll .mx-tabcontainer-tabs {display: none;}
.transferScroll .transferGrid .tr:first-child {position: fixed; top:90px; width:calc(100vw - 453px); z-index: 40; left: 429px; box-shadow: 0 2px 10px rgba(92,99,107,.15);}
.transferScroll .scrollCont .infinite-loading { max-height: calc(100vh - 80px) !important; }
.transferScroll .mx-scrollcontainer-open .transferGrid .tr:first-child {width:calc(100vw - 653px);  left: 629px;}
.transferGridBooked .block {line-height: 1.4em;}
.subGreen {background-color: #27AE60;  color: #fff; padding: 4px 6px;  border-radius: 6px; font-weight: 600; margin-right: 5px;}
.posValue {background-color: #D1E7DD; color:#0F5132; padding: 4px 9px; border-radius: 20px; }
.negValue {background-color: #EBEBEB; color:#393939; padding: 4px 9px; border-radius: 20px;  } 
.transferGridBooked {width: 100%; }
.ss4Drop.mx-groupbox > .mx-groupbox-header {background-color: unset; font-weight: 600; text-decoration: underline; border: 0; padding: 10px 0;}
.ss4Drop.mx-groupbox > .mx-groupbox-body {border: 0; padding: 0;}
.ss4Drop .mx-groupbox-collapse-icon {display: none;}
.ss4Drop .mx-groupbox-header::after {background-image: url(/images/drop.svg); transform: rotate(180deg); background-repeat: no-repeat; background-position: center center; content: ''; display: inline-block; width: 16px; height: 8px; margin:0 10px;}
.ss4Drop.collapsed .mx-groupbox-header::after  {transform: rotate(0deg);}
.dropTime .form-control {background-color: unset; padding: 7px 30px 7px 10px !important;  border-width: 1px !important; margin: 0;}
.dropTime {margin: 0;}
.open > .btn-info.dropdown-toggle {background-color: #fff; color: var(--gray-700);}
.hoverLink {padding: 3px 6px; display:  block; cursor: pointer;}
.hoverLink:hover {background-color: var(--gray-100);}
.transferGrid .widget-datagrid-content.infinite-loading {overflow-y: auto;}


/* Note transfers */

.noteTransfers { display: block;}
.noteTransfers .widget-datagrid-grid-body {display: block;}
.noteTransfers .tr {display: flex; flex-wrap: wrap; width: 100%;}
.noteTransfers .column-header span {text-wrap: unset !important;}
.noteTransfers .tr .th:nth-child(1), .noteTransfers .tr .td:nth-child(1) {flex:3}
.noteTransfers .tr .th:nth-child(2), .noteTransfers .tr .td:nth-child(2) {flex:1;}
.noteTransfers .tr .th:nth-child(3), .noteTransfers .tr .td:nth-child(3) {flex:4;}
.noteTransfers .tr .th:nth-child(4), .noteTransfers .tr .td:nth-child(4) {flex:2;}
.noteTransfers .tr .th:nth-child(5), .noteTransfers .tr .td:nth-child(5) {flex:2;}
.noteTransfers .tr .th:nth-child(6), .noteTransfers .tr .td:nth-child(6) {flex:3;}
.noteTransfers .tr .th:nth-child(7) {display: none;}
.noteTransfers .tr .td:nth-child(7) {flex:0 1 auto; width: 100%; padding: 0px !important;}
.hideHead .th {display: none;}
.noteTransfers .td:last-child {border: 0 !important;}
.noteTransfers .td-custom-content:empty {display: none;}
.noteTransfers .infinite-loading {margin-bottom: 0 !important;}
.noteTransfers .noteTransfers .td {background-color: var(--gray-100);}
.noteTransfers .noteTransfers .td:last-child {padding-right: 5px !important; border-bottom: 1px solid var(--gray-200) !important;}

/* RadioSlide */
.radioSlide {margin-bottom: 0;}
.radioSlide .mx-radiogroup {display: flex; flex-direction: column !important;}
.radioSlide.nm .radio {margin-right: 0 !important;}
.radioSlide .radio label, .radioSlide .radio input ~ label:after {-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
.radioSlide .radio {margin:0;   padding-top: 0px; display: inline !important; position: static;}
.radioSlide .radio label {position: relative;   cursor: pointer;    height: 28px; line-height: 28px !important;   padding:0 9px !important; border-radius: 14px !important; margin:0 !important; color:rgba(255,255,255,0);  width: 100%;}
.radioSlide .radio:first-child label {   padding-right: 34px !important; }
.radioSlide .radio:last-child {margin-top: -28px !important; }
.radioSlide .radio:last-child label {padding-left: 34px !important;}
.radioSlide .radio label::after {content: ''; position: absolute; height: 22px; width: 22px;  background-color:#fff; border-radius: 11px; top:3px; font-weight: 700; text-indent: 0; text-align: center; line-height: 24px; color: #F29850; font-size: 18px;}
.radioSlide .radio:last-child input:checked ~ label:after, .radioSlide .radio:first-child input ~ label:after {left: 3px; margin-left: 0;}
.radioSlide .radio:first-child input:checked ~ label:after, .radioSlide .radio:last-child input ~ label:after {left: 100%; margin-left: -26px; content: '!'; }
.radioSlide input {display: none;}
.radioSlide label {text-indent: -5000px; width: 50px !important;}
.textRight .radioSlide label {text-indent: 5000px;}
.radioSlide .radio:first-child input:checked ~ label, .radioSlide .radio:last-child input:checked ~ label { color:rgba(255,255,255,1); z-index: unset;}
.radioSlide .radio input ~ label { z-index: 2;}
.radioSlide .radio:first-child input:checked ~ label { background-color: #F29850; }
.radioSlide .radio:last-child input:checked ~ label { background-color: #E5E7EB;}
.radioSlide input:disabled:checked ~ label {color:rgba(255,255,255,0.6) !important;}
.form-group.radioSlide.no-columns:not(.label-after) {align-items: flex-start;}
.radioSlide.horizontal {flex-direction: row !important;}
.radioSlide.horizontal .mx-radiogroup {order: -1; padding-right: 10px;}
.radioSlide.horizontal .control-label {padding-top: 4px;}


/*# ::::: Ss4 Application - Preview ::::: #*/

.ss4Application a:hover{opacity:0.5;transition:0.35s;}

.ss4Application .titleBar{margin-bottom:30px;}
.ss4Application .titleBar .flex{display:flex;align-items:center;}
.ss4Application .titleBar > div:first-child{margin-bottom:5px;}
.ss4Application .titleBar > div:last-child{margin-top:10px;}
.ss4Application .titleBar h2{font-size:33px;font-weight:800;margin:0;}
.ss4Application .titleBar a{margin-left:10px;width:21px;height:21px;display:flex;}
.ss4Application .titleBar a img{margin:0;max-width:100%;max-height:100%;}
.ss4Application .titleBar span.markerStatus{margin-left:25px;}

.ss4Application .titleBar p{color:#6C757D;font-size:14px;margin:0 25px 0 0;}

.ss4Application .titleBar .mx-checkbox{margin:0 25px 0 0;display:flex;align-items:center;}
.ss4Application .titleBar .mx-checkbox input{margin:0 !important;}
.ss4Application .titleBar .mx-checkbox input[type="checkbox"]:disabled::before{background-color:#eaeaea;border-color:#d2d2d2;}
.ss4Application .titleBar .mx-checkbox .control-label{font-size:14px;width:unset;margin:0 0 0 5px;color:#6C757D;}

.ss4Application section{margin-bottom:20px;}
.ss4Application section:last-child{margin-bottom:20px;}
.ss4Application section h3{font-size:16px;font-weight:500;font-family:'Poppins',sans-serif;padding:0;line-height:24px;margin:0 0px 20px;}

.ss4Application section .customFormGroup,
.ss4Application section .form-group{border-bottom:1px solid rgba(0,0,0,0.1);margin-bottom:20px;}
.ss4Application section .form-group{display:flex;flex-direction:column;padding-left:0;padding-right:0;}

.ss4Application section .control-label,
.ss4Application section .form-group.mx-checkbox .control-label,
.ss4Application section .customFormGroup > label,
.ss4Application section .customFormGroup > .titleWithTooltip > label,
.ss4ApplicationPop .control-label,
.ss4ApplicationPop .form-group.mx-checkbox .control-label,
.ss4ApplicationPop .customFormGroup > label{font-size:16px;font-weight:400;color:#6C757D;margin:0px 0 2px 0;text-align:left;text-overflow:ellipsis;overflow:hidden;cursor:default;line-height:1.5em;padding:0;width:inherit;}

.ss4Application section .form-control-static,
.ss4Application section .customFormGroup > span,
.ss4Application section .customFormGroup > p {font-weight:700;letter-spacing:0.01em;padding:3px 0 1px;border:none;font-size:14px;line-height:1.5em;margin:0;}


.ss4Application section .customFormGroup{display:flex;align-items:flex-end;}
.ss4Application section .customFormGroup .form-group{border:none;margin:0;}
.ss4Application section .customFormGroup > span{margin-left:auto;font-weight:400;color:#6C757D;}
.ss4Application section .customFormGroup > .tooltipBox{margin-left:auto;}

.ss4Application section .bigText .form-control-static , .ss4ApplicationPop .bigText .form-control-static {font-size:22px;line-height:1.5rem;padding:0px 0 1px;}
.ss4Application section .grayC .form-control-static{color:#6C757D;}

.ss4Application section .customFormGroup.colD{flex-direction:column;align-items:flex-start;}
.ss4Application section .customFormGroup.colD .flex{align-items:center;}
.ss4Application section .customFormGroup a{margin-left:10px;margin-bottom:3px;width:18px;height:18px;display:flex;}
.ss4Application section .customFormGroup a img{margin:0;max-width:100%;max-height:100%;}

.ss4Application section .customFormGroup span.marker{margin-right:10px;padding:3px 4px 3px;margin-bottom:0px;font-size:13px;}
.ss4Application section .customFormGroup.colD .flex a{margin:0 0 0 10px;width:16px;height:auto;}

.ss4Application section .customFormGroup > .titleWithTooltip{display:flex;gap:5px;margin-bottom:2px;align-items:center;}
.ss4Application section .customFormGroup > .titleWithTooltip *{margin:0 !important;}

.ss4Application section .widget-accordion{}
.ss4Application section .widget-accordion .widget-accordion-group{margin-bottom:35px;border:none;}
.ss4Application section .widget-accordion.nm .widget-accordion-group{margin-bottom:0;}
.ss4Application section .widget-accordion .widget-accordion-group > .widget-accordion-group-header > .widget-accordion-group-header-button{padding:0;}
.ss4Application section .widget-accordion-group > .widget-accordion-group-header > .widget-accordion-group-header-button > :first-child{flex:0 1 auto;align-items:center;}
.ss4Application section .widget-accordion-group > .widget-accordion-group-header h3{margin:0;}
.ss4Application section .widget-accordion-group > .widget-accordion-group-header .arrowText{color:var(--primary-50);text-decoration:underline;font-size:14px;font-weight:700;margin-left:20px;}
.ss4Application section .widget-accordion .widget-accordion-group > .widget-accordion-group-header > .widget-accordion-group-header-button .widget-accordion-group-header-button-icon,
.ss4Application section .widget-accordion .widget-accordion-group > .widget-accordion-group-header > .widget-accordion-group-header-button.widget-accordion-group-header-button-clickable:hover .widget-accordion-group-header-button-icon, 
.ss4Application section .widget-accordion .widget-accordion-group > .widget-accordion-group-header > .widget-accordion-group-header-button.widget-accordion-group-header-button-clickable:focus .widget-accordion-group-header-button-icon, 
.ss4Application section .widget-accordion .widget-accordion-group > .widget-accordion-group-header > .widget-accordion-group-header-button.widget-accordion-group-header-button-clickable:active .widget-accordion-group-header-button-icon{margin-left:10px;fill:var(--primary-50) !important;}
.ss4Application section .widget-accordion .widget-accordion-group > .widget-accordion-group-content-wrapper > .widget-accordion-group-content{padding:0;border:none;margin:20px 0 -30px;}

.ss4Application section .widget-accordion-group .arrowText span:first-child{display:block;}
.ss4Application section .widget-accordion-group .arrowText span:last-child{display:none;}
.ss4Application section .widget-accordion-group:not(.widget-accordion-group-collapsed) .arrowText span:first-child{display:none;}
.ss4Application section .widget-accordion-group:not(.widget-accordion-group-collapsed) .arrowText span:last-child{display:block;}


/*# ::::: SS4 Applications - custom button ::::: #*/
.btn-disabled,
.btn-disabled:hover,
.btn-disabled:focus,
.btn-disabled:active{border-color:#929292;cursor:default;color:#929292;}

/*# ::::: SS4 Applications - custom alerts ::::: #*/
.alert.alert-orange{background-color:#fbf1e9;border-color:#fbf1e9;border-radius:4px;padding:20px 25px !important;margin-bottom:20px;width:fit-content;}
.alert.alert-orange > h4,
.alert.alert-orange > p,
.alert.alert-orange > span{color:#d27523;font-size:16px;line-height:1.5rem;margin-bottom:0px;display:block;}
.alert.alert-orange > h4{margin-bottom:3px;}
.alert.alert-orange > span{font-style:italic;}

.alert.alert-orange.ver2{border-radius:10px;padding:22px 25px !important;border-color:#ffdec1;background-color:#fff5ec;}
.alert.alert-orange.ver2 > h4,
.alert.alert-orange.ver2 > p,
.alert.alert-orange.ver2 > span{color:var(--primary-60);font-size:14px;margin-bottom:10px;}
.alert.alert-orange.ver2 > h4{font-size:16px;}
.alert.alert-orange.ver2 > *:last-child{margin-bottom:0px;}
.alert.alert-orange.ver2 .form-group{margin-bottom:6px;}

.alert.alert-gray{background-color:#f2f2f2;padding:15px 25px !important;border-radius:4px;border:2px solid #f2f2f2;margin-bottom:20px;width:fit-content;}
.alert.alert-gray p{color:#6C757D;font-size:16px;padding:0;margin:0;line-height:1.5rem;display:block;}
.alert.alert-gray p ~ button{margin-top:12px;}
.alert.alert-gray.ver2{border-color:#d3d6d8;padding:15px 20px 20px !important;background:#e2e3e5;}

.alert.alert-lgray{background-color:#f8f9fa;border:2px solid #e9ecef;padding:15px !important;width:fit-content;}
.alert.alert-lgray p{color:#6C757D;font-size:16px;padding:0;margin:0;line-height:1.5rem;display:block;}

.alert.alert-orange.fullW,
.alert.alert-gray.fullW{width:100%}


/*# ::::: SS4 Applications - markers [status use Karol colors from Actualization, normal use colors from Ss4 transfer table] ::::: #*/
.ss4Application .markerStatus, .ticketStatus .markerStatus{background-color:#e9ebec;color:var(--ss4-darkGrey);padding:5px 8px;border-radius:16px;display:inline-block;font-size:var(--small-font);line-height:var(--small-font);}
.ss4Application .markerStatus.ss4blue, .ticketStatus .markerStatus.ss4blue {background-color:#CFE2FF;color:#084298;}
.ss4Application .markerStatus.ss4orange, .ticketStatus .markerStatus.ss4orange {background-color:#FFF3CD;color:#997404;}
.ss4Application .markerStatus.ss4green, .ticketStatus .markerStatus.ss4green{background-color:#D1E7DD;color:#0F5132;}
.ss4Application .markerStatus.ss4red, .ticketStatus .markerStatus.ss4red{background-color:#FBF4F4;color:#B02A37;}
.ss4Application .markerStatus.ss4purple, .ticketStatus .markerStatus.ss4purple{background-color:var(--ss4-purpleLight);color:var(--ss4-purpleDark);}
.ticketStatus .markerStatus {padding: 10px 15px;  font-size: 17px;  font-weight: 600; width: 100%; text-align: center;  white-space: nowrap;}
.inLine.ticketStatus .markerStatus {font-size: 14px; padding: 7px 12px; width: auto;}

.ss4Application .marker{background-color:var(--ss4-mediumGrey);border-radius:4px;padding:3px 7px;text-transform:uppercase;font-weight:600;display:inline-block;font-size:var(--small-font);line-height:var(--small-font);color:#fff;text-align:center;}
.ss4Application .marker.ss4blue{background-color:var(--ss4-blueMedium);}
.ss4Application .marker.ss4orange{background-color:var(--ss4-orangeMedium);}
.ss4Application .marker.ss4green{background-color:var(--ss4-greenMedium);}
.ss4Application .marker.ss4red{background-color:var(--ss4-redMedium);}
.ss4Application .marker.ss4grey{background-color:var(--ss4-mediumGrey);}
.ss4Application .marker.ss4purple{background-color:var(--ss4-purpleDark);}

/*# ::::: SS4 Applications - docs dataGrid2 ::::: #*/
.ss4Application .widget-datagrid .table .th{padding:15px 5px;}
.ss4Application .widget-datagrid .table .td{padding:12px 5px;}
.ss4Application .widget-datagrid .table .th:first-child,
.ss4Application .widget-datagrid .table .td:first-child{padding-left:15px;}
.ss4Application .widget-datagrid .table .th:last-child,
.ss4Application .widget-datagrid .table .td:last-child{padding-right:15px;}
.ss4Application .widget-datagrid .table .td-custom-content .flex{align-items:center;}

.ss4Application .widget-tooltip{margin:0 5px 0 0;}
.ss4Application .widget-tooltip .widget-tooltip-trigger img{max-width:18px;}
.ss4Application .widget-tooltip .widget-tooltip-content{max-width:600px;font-weight:400;text-align:left;padding:1rem;box-shadow:unset;} 
.ss4Application .widget-tooltip .widget-tooltip-arrow, 
.ss4Application .widget-tooltip .widget-tooltip-arrow:before{box-shadow:unset;top:-3px}

.ss4Application .widget-tooltip.tWarning .widget-tooltip-content{color:#d27523;border:1px solid #ffdec1;background-color:#fff5ec;}
.ss4Application .widget-tooltip.tWarning .widget-tooltip-arrow,
.ss4Application .widget-tooltip.tWarning .widget-tooltip-arrow:before{background-color:#fff5ec;border-left:1px solid #ffdec1;border-top:1px solid #ffdec1;}


/*# ::::: SS4 Applications - popup ::::: #*/
.ss4ApplicationPop {width: 98vw !important; height: 98vh !important;}
.ss4ApplicationPop.withoutPrev{width:900px !important;}
.ss4ApplicationPop.widePop{width:1340px !important;}
.ss4ApplicationPop.smallPop {width: 1000px !important; height: auto !important; max-height: 98vh !important;}
.ss4ApplicationPop.mediumPop {width: 1240px !important; height: auto !important; max-height: 98vh !important;}
.ss4ApplicationPop .mx-window-body,
.ss4ApplicationPop .mx-dataview-content{}
.ss4ApplicationPop .docForm {flex: 1;  display: flex; flex-direction: column; justify-content: space-between; }
.ss4ApplicationPop .formDetails {max-height: calc(100vh - 300px); overflow-y: auto; }
.ss4CreateTransfer .formDetails {height: calc(100vh - 300px); }
.ss4ApplicationPop .docPreview {flex: 2;}
.ss4ApplicationPop.wideForm .docPreview{flex:1;}
.ss4ApplicationPop .pdf-div iframe {height: calc(100vh - 167px);}
.ss4ApplicationPop .mx-scrollcontainer-wrapper {overflow: hidden !important;}
.ss4ApplicationPop .fullHeight > .mx-dataview-content {height: 100% !important;}
.ss4ApplicationPop .form-control-static,
.ss4ApplicationPop .customFormGroup > span,
.ss4ApplicationPop .customFormGroup > p{font-weight:700;letter-spacing:0.01em;padding:3px 0 1px;font-size:14px;line-height:1.5em;margin:0;}
.ss4ApplicationPop .imgPreview {position: absolute; width: 100%; height: 100%; background-color: #000; overflow: hidden;}
.ss4ApplicationPop .imgPreview img {width: auto !important; height: auto !important;}
.ss4ApplicationPop .form-control[disabled] { opacity: 0.8;}
.ss4ApplicationPop .form-control {background-color: #fff;}
.zoom { width: 100%;  height: 100%;  transform-origin: 0px 0px;  transform: scale(1) translate(0px, 0px);  cursor: grab;}
.asOneInput:not(.onListGallery) {border-bottom: 1px solid rgba(0, 0, 0, 0.1);  margin-bottom: 20px;}
.asOneInput:not(.onListGallery) .widget-gallery-item {display: inline-block; font-weight: 700;  letter-spacing: 0.01em;  padding: 3px 0 1px;  font-size: 14px;  line-height: 1.5em;}
.asOneInput.onListGallery {display: inline-block; }
.asOneInput .widget-gallery-item::after {content: ','; margin: 0 5px 0 0;}
.asOneInput .widget-gallery-item:last-child::after {display: none;}
.asOneInput.widget-gallery .widget-gallery-items {display: block;}
.osUpo::before {content: 'Osoby upoważnione'; font-size: 16px;  font-weight: 400;  color: #6C757D;  margin: 0px 0 2px 0;  text-align: left;  text-overflow: ellipsis;  overflow: hidden;  cursor: default;  line-height: 1.5em;  padding: 0;  width: inherit; display: block;}
.darkLabel .control-label, label.darkLabel {font-weight: 700 !important; color:  #000 !important; font-size: 15px;}
label.darkLabel {margin-bottom: 3px;  margin-top: -2px;  display: block;}
.ss4Application .textWithWidget {min-height: 20px; margin: 0; flex-wrap: wrap;}
.ss4Application .form-control[disabled] {background-color: var(--gray-100);}
.asSrs {  border: 1px solid var(--gray-600);  color: var(--text-base-color);  padding:11px 16px;  line-height: 1em;  font-size: 1rem;  background-color: var(--gray-100);  font-weight: 400;     border-radius: 4px; margin-bottom: 1rem;}
.ss4Application .widget-gallery-empty {margin-bottom: 0 !important;}
.actionButtons {position: absolute;  top: 33px;  right: 11px;  width: 56px;}
.actionButtons img {display: inline-block; margin-right: 4px;}
.ss4ApplicationPop .customRadio .mx-radiogroup{margin-top:8px;}
.ss4ApplicationPop .selectList .lineBox {padding: 0.5rem 0.6rem;}

.sourceOption select option {display: none;}
.sourceOption select option[value="FreeAmount"] {display: block;}
.sourceOption .ahf select option[value="FundraisingEvent"] {display: block;}
.sourceOption .ahp select option[value="PurposefulDonation"] {display: block;}
.sourceOption .ahn select option[value="NotPurposefulDontation"] {display: block;}

.maxWidthU {max-width: unset !important;}

.hideEnumVal.har select option[value="Representative"] {display:none;}
.hideEnumVal.hap select option[value="Authorized_person"] {display:none;}


.table .th .column-header span {text-wrap: wrap;}
.ss4 .table .th .column-header svg {align-self: end; margin-bottom: 3px;}

.objCounter2 .td {counter-increment: object-counter;}
.objCounter2 .transferObjH::after {content: " " counter(object-counter);}
.noHoverGrid .td {background-color: unset !important;}
.ss4ApplicationPop .widget-datagrid .td.widget-datagrid-col-select, .ss4ApplicationPop .widget-datagrid .th.widget-datagrid-col-select {align-items: flex-start; padding-top: 15px !important;}
.acceptTransfers {z-index: 100;  right: 0;  position: absolute;  top: 6px;}

.ss4ApplicationPop .customCh.mx-checkbox{margin:0 25px 14px 0;display:flex;align-items:center;}
.ss4ApplicationPop .customCh.mx-checkbox input{margin:0 !important;}
.ss4ApplicationPop .customCh.mx-checkbox input[type="checkbox"]:disabled::before{background-color:#eaeaea;border-color:#d2d2d2;}
.ss4ApplicationPop .customCh.mx-checkbox .control-label{width:unset;margin:0 0 0 5px;color:#6C757D;}

.mx-grid-searchbar {background-color: var(--gray-100); padding: 10px;  border-radius: 8px; position: relative;}
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-input .form-control { width: 100%;   padding: 7px;  border-color: var(--gray-300);  background-color: #fff;  font-size: var(--small-font);  color: var(--gray-600);}
.mx-grid .mx-grid-search-item > div {display: block !important; width: auto !important;}
.mx-grid .mx-grid-searchbar .mx-grid-search-input .mx-button {padding: 0.7rem 0.5rem;}
.mx-grid .mx-grid-search-label {text-align: left;  font-size: var(--small-font);  line-height: 1.1em; font-weight: 600;}
.mx-grid .mx-grid-search-controls {position: absolute; left: 0; bottom:-56px;}
.mx-grid .mx-grid-toolbar { padding-left: 213px;}
.mx-grid .mx-grid-search-item {width: 20%;}
.mx-grid .mx-grid-searchbar .mx-button .glyphicon {margin-right: 0;}
.mx-grid .mx-datagrid-data-wrapper {font-size: 0.95rem !important;}

.mx-grid.compact .mx-grid-search-controls{bottom:-48px;}
.mx-grid.compact .mx-grid-toolbar{padding-left:195px;display:flex;flex-wrap:wrap;gap:0.3em;}
.mx-grid.compact .mx-grid-search-controls .btn, 
.mx-grid.compact .mx-grid-search-controls .mx-button,
.mx-grid.compact .mx-grid-toolbar .btn, 
.mx-grid.compact .mx-grid-toolbar .mx-button{padding:0.7rem 1.2rem;margin-bottom:0px;}
.mx-grid.compact .mx-grid-toolbar .btn, 
.mx-grid.compact .mx-grid-toolbar .mx-button{margin:0px;}
.mx-grid.compact .mx-grid-pagingbar{margin:3px 0;}
.mx-grid.compact .mx-grid-pagingbar button{margin:0;}
.mx-grid.compact .mx-grid-pagingbar .mx-grid-paging-status{padding:0 8px;}


/*# ::::: SS4 Applications PopUp - custom referenceSelector ::::: #*/
.ss4ApplicationPop .currencySel{width:100px;}
.ss4ApplicationPop .currencySel .form-control{padding:11px 26px 11px 16px;height:39px;position:relative;}
.ss4ApplicationPop .currencySel .srs-icon-row{right:16px;}
.ss4ApplicationPop .currencySel .glyphicon{font-size:13px;color:#9A9D9F;font-weight:100;}


/* Abs search */
.absSearch .th {position: static;}
.appStatus {position: absolute;  top: -53px;  width: 260px; right: 538px;}
.appType {position: absolute;  top: -53px;  width: 200px; right: 322px;}
.appTypeDate {position: absolute;  top: -53px;  width: 157px; right: 149px;}
.appTypeDateTablet {right: 202px;}
.advSearchOpen .appTypeDateTablet {top: -126px;}
.appTypeDate:not(.appTypeDateTo)::after, .appAmount2::after, .appDateFrom::after {content: ''; height: 1px; width: 6px; background-color: var(--gray-700); margin: 18px 0 0 3px;} 
.appTypeDateTo {right: 0px; width: 146px;}
.appTypeDateTablet.appTypeDateTo {right: 52px;}
.appAmount {position: absolute;  top: -53px;  width: 93px; right: 324px;}
.appAmount2 {width: 102px;}
.appWs {width: 200px;}
.appTypeOp {position: absolute;  top: -53px;  width: 200px; right: 665px;}
.appTypeOpD {right: 539px;}
.profile-tablet .appTypeOp {right: auto; left: 0px;  width: calc(100% - 540px);}
.appAmountOp {right: 450px;}
.appAmountOpD {right: 324px;}
.profile-tablet .appAmountOp {right: 324px;}
.appDateFrom {width: 156px;}
.flexAdvSearch {width: 50px; }
.appTypeT {right: 0px !important;}
.fLeft {right: unset;  left: 0;  width: calc(100% - 209px);}
.appStatusT {right: 213px !important; width: 200px;}

.lagoShort, .panelHide {display: none;}
.ss4drop .btn {max-width: 245px; white-space: normal; }
.ss4 .timeline {width: 600px; max-width: 100%; margin: 0;}
.ss4 .widget-timeline-events-wrapper {margin-left: 20px;}

.leafletPreviewCont {flex-basis: 48%; min-width: 450px;}
.profile-tablet .leafletPreviewCont, .profile-phone .leafletPreviewCont {flex-basis: 100%; }
.leafletPreview {margin-right: 1rem;}

.leafletPreviewCont .btn-danger {color: #fff; border-color: #e33f4e; background-color: #e33f4e;}
.leafletPreviewCont .projectStatus {text-align:center; font-weight: 500; border-radius: 30px; margin: 1rem 0 0 0; padding: 1rem !important; font-size: var(--medium-font);}
.header-filters .flex div {overflow: hidden;}
/*kasia-overflow visibility in PB to show accessibility keyboard focus outline (below)*/
.role-beneficiary .header-filters .flex div {overflow: visible !important;}

/* Tablet profile */
.ss4TopMobile .mx-scrollcontainer-wrapper, .menuBottomMobile .mx-scrollcontainer-wrapper {overflow: visible !important;}
.ss4TopMobile {background-color: #193c66;}
.profile-tablet .avalonLogo {margin: 10px 15px 0 25px;}
.profile-tablet .ss4drop .btn {height: 80px;}
.ss4TopMobile .ss4drop .btn {background-color: unset !important; color: #fff !important;}
.ss4TopMobile .initials {background-color: #fff; color: #102c4e;}
.ss4TopMobile .mobileBenMenu {border-left: 1px solid rgba(255,255,255,0.3); padding: 0 15px;}
.ss4TopMobile .bell {border-left: 1px solid rgba(255,255,255,0.3); padding: 0 5px; }
.ss4TopMobile .bell .glyphicon {color: #fff;}
.flexHorizontal {display: flex;  flex-direction: column; position: absolute; width: 100%; height: 100%; top:0; left: 0;}
.mobilePageHead {height: 58px; padding: 1rem;}
.mobilePageContent {flex-grow: 1; padding: 1rem; background-color: #fff; border-top: 1px solid #e3e3e3;}
.profile-tablet .benPanel, .profile-tablet .ss4Content, .profile-phone .benPanel, .profile-phone .ss4Content {height: 100% !important; min-height: unset !important; max-height: 100% !important; }
.profile-tablet .benContent, .profile-phone .benContent {padding: 0 !important; height: 100%; max-height: 100%;}
.ss4contScroll, .profile-tablet .benContent > .mx-placeholder, .profile-phone .benContent > .mx-placeholder, .hFull {height: 100%; max-height: 100%;}
.profile-tablet .ss4 h1 {font-size: 1.5rem;}
.profile-tablet .ss4 h2 {font-size: 1.25rem;}
.profile-tablet .ss4 h3 {font-size: 1.15rem;}
.menuBottomMobile .mx-navbar {height: 100%; background-color: unset;}
.menuBottomMobile .mx-navbar ul {display: flex; height: 100%; width: 100%;}
.menuBottomMobile .mx-navbar ul li {flex: 1; border-top: 1px solid #e3e3e3; border-right: 1px solid #e3e3e3;}
.menuBottomMobile .mx-navbar ul li:last-child {border-right: 0;}
.menuBottomMobile .mx-navbar ul li a {flex-direction: column; text-align: center; line-height: 15px; height: 100%; border-radius: 0 !important;}
.menuBottomMobile .mx-navbar ul.nav > li.mx-navbar-item > a:hover, .menuBottomMobile .mx-navbar ul.nav > li.mx-navbar-item > a:focus, .menuBottomMobile .mx-navbar ul.nav > li.mx-navbar-item > a.active {background-color: #efefef !important;}
.profile-tablet .menuBottomMobile .mx-navbar ul li a img {width: auto !important;  height: 37px !important;  margin: 0 0 4px 0;}
.mobileCont {display: block !important;}
.ss4RightMobile {display: block !important; position: fixed; height: calc(100vh - 160px); top:80px; right: -400px; width: 400px !important;  transition-property: right !important; transition: right 0.5s ease; z-index: 50;}
.ss4RightMobile .ss4Right {position:  relative !important; width: 100% !important; padding: 20px !important; height: auto;  min-height: 100%;}
.ss4RightMobile .mx-scrollcontainer-wrapper {height: 100vh; overflow-y: auto;}
.mx-scrollcontainer-open .ss4RightMobile  {right: 0}
.showRightPanelM {position: fixed; top:120px; z-index: 5; right: 0; width: 24px; height: 40px; line-height: 40px; border-top-left-radius: 20px; border-bottom-left-radius: 20px; background-color: #173354; padding-left: 7px; transition-property: right !important;  transition: right 0.5s ease; z-index: 50;}
.mx-scrollcontainer-open .showRightPanelM {right: 400px}
.mx-scrollcontainer-open .showRightPanelM .glyphicon {transform: rotate(180deg);}
.hSearch {margin-top: 10px;}
.advSearch {width: 38px; height: 38px; border: 1px solid var(--ss4-lightGrey) !important; border-radius: 5px; margin-top:26px; text-align: center; line-height: 35px;}
.advSearch img {display: inline-block;}
.chUp, .hSearch, .hOnMobile {display: none !important;}
.advSearchOpen .chUp  {display: block !important}
.advSearchOpen .hSearch,  .advSearchOpen .hOnMobile {display: flex !important;}
.advSearchOpen .chUp {display: inline-block !important;}
.advSearchOpen .chDown {display: none !important;}

.comboBox p {margin: 0; padding: 0; display: inline-block;}
.comboBox .widget-combobox-input-container {padding: 10px 3px 10px 10px; border: 1px solid var(--gray-600);  color: var(--text-base-color);  line-height: 1em; font-size: 1rem;  background-color: var(--gray-100);  font-family: 'ProximaNova', sans-serif;  font-weight: 400;}
.kt {border-radius: 3px;  background-color: #27ae60;  display: inline-block;  padding: 8px 10px;  text-decoration: none !important;  color: #fff !important;}
.kt.dis {background-color: #ddd; color: #777  !important;}

/*# ::::: Tablet profile  :::::  #*/

/*# ::::: Add only tablet to media declarations  :::::  #*/

.profile-tablet .mx-navbar ul.nav > li.mx-navbar-item > a {justify-content:center;padding:8px;}
.profile-tablet .dgFlexCol{display:flex;flex-direction:column;gap:1px;}

.profile-tablet .menuBottomMobile .mx-navbar ul li:nth-child(n+8){display:none;}
.profile-tablet .mobileMoreBottom .dropdown-menu a:nth-child(-n+2){display:none;} 

.profile-tablet .ss4TopMobile .flex{align-items:center;}
.profile-tablet .ss4TopMobile .avalonLogo{margin:0 0 2px 25px;height:50px;}
.profile-tablet .ss4TopMobile .popList{max-width:50vw;width:350px;}
.profile-tablet .showRightPanelM{top:95px;}

.profile-tablet .mobilePageHead{padding:1rem;height:unset;}
.profile-tablet .mobilePageHead h1{margin:0px;}
.profile-tablet .mobilePageHead .genRep{margin:0 0 0 1.2rem;padding-left:1rem;}
.profile-tablet .mobilePageHead .tableDetails{margin-top:-0.4rem;text-align:right;}
.profile-tablet .mobilePageHead .pDetails{text-align:right;padding-left:10px;}
.profile-tablet .mobilePageHead .flexRight.pDetails div > .inLine:last-child{margin-right:0;}
.profile-tablet .mobilePageHead .bArr{transform:rotate(180deg);margin-top:2px;margin-right:7px;margin-left:-5px;}
.profile-tablet .mobilePageHead .subT{margin-left:7px;}
.profile-tablet .mobilePageHead .news-single-image-img{width:auto;margin-right:9px;}
.profile-tablet .mobilePageHead .education-details-category{margin-right:0;font-size:12px;padding:3px 8px;background:var(--primary-50);margin-bottom:2px;line-height:18px;}
.profile-tablet .mobilePageHead .news-details-files{margin:0;}

.profile-tablet .mobilePageContent{padding:1rem;background-color:#fff;border-top:1px solid #e3e3e3;}
.profile-tablet .mobilePageContent.wTabs{padding:0;border-top:none;background:#f4f5fa;}
.profile-tablet .mobilePageContent.wTabs .ss4tab{height:100%;max-height:100%;display:flex;flex-direction:column;}
.profile-tablet .mobilePageContent.wTabs .ss4tab .nav-tabs{margin-bottom:-1px;}
.profile-tablet .mobilePageContent.wTabs .ss4tab .nav-tabs li a {
  background:#e3e3e3 !important;
  box-shadow:none;
  margin:0 0.55rem 1px 0 !important;
  border-radius:0 !important;
  font-size:15px;
  padding:0.8rem 1rem 1rem 1rem !important;
  border-top-color:#e3e3e3 !important;
}
.profile-tablet .mobilePageContent.wTabs .ss4tab .nav-tabs li:last-child a {margin:0 !important;}
.profile-tablet .mobilePageContent.wTabs .ss4tab .nav-tabs li.active a{z-index:2;background:#fff !important;border-top-color:var(--primary-50) !important;}

.profile-tablet .mobilePageContent.wTabs .ss4tab .tab-content{background:#fff;border-top:1px solid #e3e3e3;position:relative;z-index:1;padding:1rem;flex-grow:1;}
.profile-tablet .mobilePageContent .widget-datagrid .table-footer{margin:1rem 0 0.25rem;}

.profile-tablet .mobilePageContent .newApplication{height:100%;}

.profile-tablet .mobilePageContent .education-category-list{display:block;margin-top:1rem;}
.profile-tablet .mobilePageContent.category_orange_top{border-top:5px solid var(--primary-50);}

.profile-tablet .mx-datepicker .btn .glyphicon{margin-right:0px;}

.profile-tablet .flexAdvSearch{width:38px;}
.profile-tablet .flexAdvSearch .advSearch{line-height:33px;}

@media (max-width: 1000px) {
  .profile-tablet .menuBottomMobile .mx-navbar ul li:nth-child(n+7){display:none;}
  .profile-tablet .mobileMoreBottom .dropdown-menu a:nth-last-child(-n+2){display:block;}
}

@media (max-width: 900px) {
  .profile-tablet .menuBottomMobile .mx-navbar ul li:nth-child(n+6){display:none;}
  .profile-tablet .mobileMoreBottom .dropdown-menu a:nth-child(-n+3){display:block;}
  .profile-tablet .mobilePageContent .applicationType:last-child{flex-basis:100%;}
}

@media (max-width: 800px) {
  .profile-tablet .mx-navbar ul.nav > li.mx-navbar-item > a {padding:5px;font-size:13px;}
  .profile-tablet .mx-navbar ul.nav > li.mx-navbar-item > a img{height:32px !important;margin-bottom:3px;}
  .profile-tablet .subGreen,
  .profile-tablet .posValue,
  .profile-tablet .negValue {display:inline-block;line-height:18px;}

  .profile-tablet .ss4 .widget-datagrid .table .td > .td-text, 
  .profile-tablet .ss4 .widget-datagrid .table .td *{font-size:13px;}
  .profile-tablet .regularFont{font-size:13px !important;}

  .profile-tablet .mobilePageHead > .flex{align-items:center;}
  .profile-tablet .mobilePageHead .tableDetails{margin-top:0;}
  .profile-tablet .mobilePageHead h1{font-size: 1.4rem;margin-right:0;display:block !important;}
  .profile-tablet .mobilePageHead .genRep{display:flex !important;margin:5px 10px 0 0;border:none;padding:0;align-items:center;}
  .profile-tablet .mobilePageHead .genRep > img{max-height:22px;}
  .profile-tablet .mobilePageHead .tableTitle{font-size: 1.1rem;}

  .profile-tablet .ss4{font-size:14px;}

  .profile-tablet .showRightPanelM{top:95px; z-index: 51;}

  .profile-tablet .mobilePageContent .steps{font-size:15px;}

}

/*# ::::: End of Tablet profile  :::::  #*/





/* Phone profile */
.profile-phone .ss4drop .btn {height: 65px;}
.profile-phone .ss4 h1 {font-size: 1.2rem;}
.profile-phone .ss4 h2 {font-size: 1.1rem;}
.profile-phone .ss4 h3 {font-size: 1.05rem;}
.profile-phone .avalonLogo {margin: 12px 10px 0 14px;}
.profile-phone  .mobilePageHead {height: 38px; padding: 0.5rem;}
.profile-phone .ss4TopMobile .mobileBenMenu, .profile-phone .ss4TopMobile .bell  {padding: 0;}
.profile-phone .bell .glyphicon {font-size: 21px;  line-height: 26px}
.profile-phone .menuBottomMobile .mx-navbar ul li a {font-size: 10px; text-transform: uppercase; padding: 7px 5px 5px 5px;}
.profile-phone .menuBottomMobile .mx-navbar ul li a img {margin: 0; width: auto; height: 30px;}
.profile-phone .showRightPanelM {top:65px; width: 20px; height: 30px; line-height: 30px; z-index: 51;}
.profile-phone .ss4RightMobile {right: -300px; width: 300px !important; height: calc(100vh - 120px); top:60px;}
.profile-phone .mx-scrollcontainer-open .showRightPanelM {right: 300px}
.profile-phone .mx-scrollcontainer-open .ss4RightMobile  {right: 0}
.mobileMoreBottom {border-top: 1px solid #e3e3e3; border-left: 1px solid #e3e3e3;}
.profile-phone .ss4 {font-size: 13px;}
.profile-phone .ss4 .form-group .control-label, .profile-phone .ss4 label {font-size: 12px;}
.profile-phone .header-filters .ml1 {margin-left: 0.5rem !important;}
.profile-phone .advSearch {margin-top: 21px;}
.profile-phone .widget-datagrid .table .th {padding: 5px 7px;}






/*# ::::: Phone profile  :::::  #*/

/*# ::::: Add only phone to media declarations  :::::  #*/

.profile-phone .ss4TopMobile .flex{align-items:center;}
.profile-phone .ss4TopMobile .avalonLogo{margin:0 0 1px 0.75rem;height:35px;}
.profile-phone .ss4TopMobile .ss4drop .btn{padding:0.25rem 0.75rem 0.25rem 0.75rem;}

.profile-phone .mx-navbar ul.nav > li.mx-navbar-item > a {padding:5px 5px 10px 5px;;font-size:10px;justify-content:center;}
.profile-phone .mx-navbar ul.nav > li.mx-navbar-item > a img{height:26px;margin-bottom:1px;}


.profile-phone .mobilePageHead{padding:0.75rem;height:unset;}
.profile-phone .mobilePageHead h1{margin-right:0;}
.profile-phone .mobilePageHead .genRep{margin:0 0 0 12px;padding-left:10px;}
.profile-phone .mobilePageHead .genRep > img{max-height:22px;}
.profile-phone .mobilePageHead .genRep > img:last-child{margin:0;}
.profile-phone .mobilePageHead .tableDetails{margin-top:2px;}
.profile-phone .mobilePageHead .pDetails{text-align:right;}
.profile-phone .mobilePageHead .flexRight.pDetails div > .inLine:last-child{margin-right:0;}
.profile-phone .mobilePageHead .bArr{transform:rotate(180deg);margin-top:1px;margin-right:7px;margin-left:-5px;}
.profile-phone .showRightPanelM{top:66px;}
.profile-phone .mobilePageHead .subT{margin-left:7px;}
.profile-phone .mobilePageHead .news-single-image-img{width:auto;margin-right:9px;}
.profile-phone .mobilePageHead .education-details-category{margin-right:0;font-size:12px;padding:3px 8px;background:var(--primary-50);margin-bottom:2px;line-height:18px;}
.profile-phone .mobilePageHead .news-details-files{margin:0;}


.profile-phone .mobilePageContent{padding:0.75rem;background-color:#fff;border-top:1px solid #e3e3e3;}
.profile-phone .mobilePageContent.wTabs{padding:0;border-top:none;background:#f4f5fa;}
.profile-phone .mobilePageContent.wTabs .ss4tab{height:100%;max-height:100%;display:flex;flex-direction:column;}
.profile-phone .mobilePageContent.wTabs .ss4tab .nav-tabs{margin-bottom:-1px;}
.profile-phone .mobilePageContent.wTabs .ss4tab .nav-tabs li a {
  background:#e3e3e3 !important;
  box-shadow:none;
  margin:0 0.25rem 1px 0 !important;
  border-radius:0 !important;
  font-size:13px;
  letter-spacing: -0.5px;
  padding:0.6rem 0.5rem 0.7rem 0.5rem !important;
  border-top-color:#e3e3e3 !important;
}

.profile-phone .subGreen,
.profile-phone .posValue,
.profile-phone .negValue {display:inline-block;line-height:17px;padding:3px 8px;}

.profile-phone .ss4 .widget-datagrid .table .td > .td-text, 
.profile-phone .ss4 .widget-datagrid .table .td *{font-size:12px;}
.profile-phone .regularFont{font-size:12px !important;}
.profile-phone .dgFlexCol{display:flex;flex-direction:column;gap:1px;}

.profile-phone .mobilePageContent.wTabs .ss4tab .nav-tabs li:last-child a {margin:0 !important;}
.profile-phone .mobilePageContent.wTabs .ss4tab .nav-tabs li.active a{z-index:2;background:#fff !important;border-top-color:var(--primary-50) !important;}

.profile-phone .mobilePageContent.wTabs .ss4tab .tab-content{background:#fff;border-top:1px solid #e3e3e3;position:relative;z-index:1;padding:1rem;flex-grow:1;}
.profile-phone .mobilePageContent .widget-datagrid .table-footer{margin:1rem 0 0.25rem;}

.profile-phone .mobilePageContent .newApplication{height:100%;}

.profile-phone .mobilePageContent .education-category-list{display:block;margin-top:1rem;}
.profile-phone .mobilePageContent.category_orange_top{border-top:5px solid var(--primary-50);}

.profile-phone .mx-datepicker .btn .glyphicon{margin-right:0px;}

.profile-phone .flexAdvSearch{width:38px;}
.profile-phone .flexAdvSearch .advSearch{line-height:33px;}

.datePhone {width: 142px;}

.profile-phone .leafletImg {padding: 8px; margin-bottom: 1rem; border-radius: 10px;}
.profile-phone .leafletPreviewCont {min-width: unset;}
.profile-phone .steps, .profile-phone .stepsOrder, .profile-phone .stepsCard {font-size: 12px;}
.profile-phone .stepsOrder, .profile-phone .stepsCard {margin-left: 13px;margin-right: 13px;}
.profile-phone .mx-imagezoom img, .profile-tablet .mx-imagezoom img {max-width: 90vw;}

.resetFilters {position: absolute; cursor: pointer; overflow: visible !important; padding: 5px 5px 5px 13px;  background-color: var(--ss4-tableBorder);  font-size: 14px;  font-weight: 500;  width: 130px;  text-align: center;  border-top-right-radius: 10px; display: flex; right: -21px;  top: -21px; border-bottom-left-radius: 10px;}
.resetFilters:hover {background-color: #c9d2db; }
.resetFiltersM {position: absolute; right: 0px; top:-3px; cursor: pointer;}
.profile-tablet .resetFilters {right: -16px;  top: -16px; border-top-right-radius: 0; font-size: 13px; width: 115px; padding: 3px 3px 3px 9px; }
.profile-phone .resetFilters {right: -11px;  top: -11px; border-top-right-radius: 0; font-size: 12px; width: 108px; padding: 3px 3px 3px 10px; }
.profile-phone .mx-name-menuBar1-3 {line-height: 11px !important;}

.showDonation:hover::before, .showApplication:hover::before, .showFund:hover::before {position: absolute; margin: -5px 0 0 30px; background-color: #fff; padding: 5px 10px; border: 1px solid rgba(0, 0, 0, 0.1); content: 'Zobacz darowiznę'; white-space: nowrap; font-size: 14px; border-radius: 5px;}
.showApplication:hover::before {content: 'Zobacz wniosek';} 
.showFund:hover::before {content: 'Zobacz akcję kwestarską';}

/*# ::::: End of Phone profile  :::::  #*/

.role-beneficiary {overflow: hidden; max-height: 100vh;}
.donCont {min-width: 1300px; position: relative;}


@media only screen and (max-width: 1800px) {
  .ss4TopBen .mx-navbar-item a {padding: 0 0.6rem !important;}
}



@media only screen and (max-width: 1700px) {
  .ss4TopBen .mx-navbar-item a {padding: 0 0.5rem !important;}
  .chair {display: none;}
  .ss4Right {width: 395px; min-width: 395px;}
  body.panel-open .ss4Right {  margin-right: 0;}
  body.panel-closed .ss4Right {margin-right: -305px;}
  body.panel-closed .lagoShort {display: block;}
  body.panel-closed .lagoFull {display: none;}
  body.panel-closed.profile-desktop  .rightPanel {display: none;}
  .panelHide {top: 47px; padding: 0; margin: 0; width: 24px; height: 24px; border-radius: 12px; background-color: var(--primary-50); display: block;  position: absolute;  z-index:110; left:-12px;  transition: left 250ms ease-in; text-align: center;}
  .panelHide img {margin: -3px 0 0 0 !important;}
  body.panel-open .panelHide img {-webkit-transform: scaleX(-1);   transform: scaleX(-1);}
  .ss4TopBen .mx-navbar-item a{font-size:0.9rem !important;height:60px; padding: 0 0.5rem !important;}
  .ss4TopBen{height:60px;}
  .ss4TopBen .mx-navbar{margin: 0 0.5rem;}
  .ss4TopBen .mx-navbar-item{height:60px;}
  .ss4drop .btn{height:60px;padding:0.5rem 0.75rem;}
  .ss4TopBen .ss4drop .glyphicon{font-size:24px;}
  .ss4TopBen .moveRight > div:last-child{padding:0 0.5rem 0 0.3rem !important;}
  .ss4TopBen .initials{width:30px;height:30px;font-size:12px;}
  .ss4drop .btn {height:60px;padding:0.5rem 1rem;font-size: 0.9rem; }
}

@media only screen and (max-width: 1450px) {
  .ss4Right {position: fixed; top:0; right: 0; z-index: 100; max-width: 100vw;}
  .profile-desktop .ss4Content {padding-right: 74px !important;}
}



.profile-phone .ss4Step:not(.ss4StepActive) > .mx-text {display: none;}
.profile-phone .ss4Step > .mx-text {font-size: 11px;}
.profile-phone .largeFont {font-size: 1.1rem !important;}
.profile-phone .ss4 .ss4osw input[type=checkbox] + label {font-size: 13px !important;}
.notPrev table {width: auto !important;}
.notPrev img {max-width: 100% !important; height: auto !important;}
.profile-phone .ss4Right {min-width: unset; max-width: 100%;  width: calc(100% - 40px) !important;}
body.panel-closed.profile-tablet  .rightPanel, body.panel-closed.profile-phone  .rightPanel {display: none;}
.profile-phone .ss4infT .ss4Right {width: 330px !important; margin-right: -316px !important; min-width: 330px !important}
.profile-phone.panel-open .ss4infT .ss4Right {margin-right: 0 !important;}
.profile-phone .sclog, .profile-tablet .sclog {max-height: calc(100vh - 2rem);  overflow: auto;}
.profile-phone .panelHide img {margin-top: 3px !important;}
.profile-tablet .ss4infT .ss4Content {padding-right: 110px !important;}
.profile-phone .ss4Foot {min-width: unset; }
.profile-tablet .ss4Foot {min-width: unset; padding-right: 90px; }
.profile-tablet .flexFoot, .profile-phone .flexFoot {flex-wrap: wrap;}
.profile-tablet .flexFoot > div {width: 100%;}
.profile-phone .flexFoot div {width: 100%; flex: 0 1 auto;}
.profile-tablet .flexFoot > div.flex2, .profile-phone .flexFoot > div.flex2 {order: -1;}
.profile-tablet .ss4FootLinks a {font-size: 14px;}
.profile-phone .ss4FootLinks a, .profile-phone .ss4Foot {font-size: 13px;}
.profile-phone .ss4FootLinks {flex-wrap: wrap;}
.profile-phone .ss4FootLinks div {width: 100%;}
.profile-phone .ss4Foot .mx-name-container6 {padding: 7px 0;}
.profile-phone .ss4 .widget-datagrid .header-filters .form-control {padding: 8px 10px; font-size: 12px;}
.profile-phone .ss4TopMobile .dropdown .dropdown-menu-right {position: fixed; top:58px; left: 5vw; right: 5vw; width: 90vw;}
.ss4MaxHeight {overflow-y: auto; max-height: calc(100vh - 40px);}
.ss4MaxHeight::-webkit-scrollbar {width: 10px; position: absolute;}
.ss4MaxHeight::-webkit-scrollbar-track {background: rgba(0, 0, 0, 0.05);}
.ss4MaxHeight::-webkit-scrollbar-thumb {background: rgba(0, 0, 0, 0.1);}
.ss4MaxHeight::-webkit-scrollbar-thumb:hover {background: rgba(0, 0, 0, 0.2);}




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


/*# ::::: ServiceDesk ::::: #*/
.avacomment {
  flex-direction: row-reverse; margin-left:auto;
}




/*# ::::: **************************************************************** ::::: #*/
/*# :::::   SS4 Applications PopUp - financial doc custom change process   ::::: #*/
/*# ::::: ................................................................ ::::: #*/

.ss4ApplicationPop.fdccProcess {width: 98vw !important; height: 98vh !important;}
.ss4ApplicationPop.fdccProcess.smallPop {width: 780px !important; height: auto !important; max-height: 98vh !important;min-height:600px !important;}
.ss4ApplicationPop.fdccProcess.mediumPop {width: 1240px !important; height: auto !important; max-height: 98vh !important;}
.ss4ApplicationPop.fdccProcess.widePop{width:1340px !important;}
.ss4ApplicationPop.fdccProcess .p1{padding:10px 20px 20px !important;} 

/*# ::::: SS4 Applications PopUp - moved due to merge issue ::::: #*/
.ss4ApplicationPop.fdccProcess .customFormGroup{border-bottom:1px solid rgba(0,0,0,0.1);margin-bottom:20px;}
.ss4ApplicationPop.fdccProcess .customFormGroup p{font-weight:700;letter-spacing:0.01em;padding:3px 0 1px;border:none;font-size:14px;line-height:1.5em;margin:0;}
.ss4ApplicationPop.fdccProcess .customFormGroup{display:flex;align-items:flex-end;}
.ss4ApplicationPop.fdccProcess .customFormGroup.colD{flex-direction:column;align-items:flex-start;}
.ss4ApplicationPop.fdccProcess .customFormGroup.colD .flex{align-items:center;}
.ss4ApplicationPop.fdccProcess .customFormGroup span.marker{margin-right:10px;padding:3px 4px 3px;margin-bottom:0px;font-size:13px;}
.ss4ApplicationPop.fdccProcess .marker{background-color:var(--ss4-mediumGrey);border-radius:4px;padding:3px 7px;text-transform:uppercase;font-weight:600;display:inline-block;font-size:var(--small-font);line-height:var(--small-font);color:#fff;text-align:center;}
.ss4ApplicationPop.fdccProcess .marker.ss4green{background-color:var(--ss4-greenMedium);}
.ss4ApplicationPop.fdccProcess .actionButtons{width:auto;top:32px;}
.ss4ApplicationPop.fdccProcess .actionButtons img{transition:all 0.2s ease-in-out;}
.ss4ApplicationPop.fdccProcess .actionButtons img:hover{opacity:0.75;}

/*# ::::: SS4 Applications PopUp - header ::::: #*/
.ss4ApplicationPop.fdccProcess .cHeader .mx-title{font-size:18px;margin-top:3px;font-weight:600;line-height:1.25em;}
.ss4ApplicationPop.fdccProcess .cHeader .flex{align-items:center;}
.ss4ApplicationPop.fdccProcess .cHeader .closeC{margin-left:20px;margin-top:0px;}

/*# ::::: SS4 Applications PopUp - Start page ::::: #*/
.ss4ApplicationPop.fdccProcess .popupContent{flex:1;display:flex;flex-direction:column;justify-content:space-between;padding-top:11px;}
.ss4ApplicationPop.fdccProcess .centerBox{display:flex;flex-direction:column;flex:1;justify-content:center;align-items:center;}
.ss4ApplicationPop.fdccProcess .cRadioSel{margin:50px 0;} 
.ss4ApplicationPop.fdccProcess .cRadioSel .mx-radiogroup{flex-direction:column;margin:0;}
.ss4ApplicationPop.fdccProcess .cRadioSel .mx-radiogroup .radio{margin:0;}

/*# ::::: SS4 Applications PopUp - Custom form groups ::::: #*/
.ss4ApplicationPop.fdccProcess .customFormGroup.colD .flex{width:100%;gap:5px;}
.ss4ApplicationPop.fdccProcess .bigText p, 
.ss4ApplicationPop.fdccProcess .bigText span{font-size:22px;line-height:1.5rem;padding:0px 0 1px;}
.ss4ApplicationPop.fdccProcess .oldVal{color:#6C757D;font-size:13px;}
.ss4ApplicationPop.fdccProcess .customFormGroup span.marker{margin-right:unset;background-color:var(--ss4-mediumGrey);padding:2.5px 4px 3px;font-size:16px;text-indent:-9999px;width:20px;height:20px;}
.ss4ApplicationPop.fdccProcess .customFormGroup span.marker::before{content:"-";text-indent:0;float:left;padding:0px 3px;}
.ss4ApplicationPop.fdccProcess .customFormGroup.mPos span.marker{background-color:var(--ss4-greenMedium);}
.ss4ApplicationPop.fdccProcess .customFormGroup.mPos span.marker::before{content:"\2191";padding:0px 1px;}
.ss4ApplicationPop.fdccProcess .customFormGroup.mNeg span.marker{background-color:var(--ss4-redMedium)}
.ss4ApplicationPop.fdccProcess .customFormGroup.mNeg span.marker::before{content:"\2193";padding:1px 1px;}
.ss4ApplicationPop.fdccProcess .customFormGroup.mPos p{color:var(--ss4-greenMedium);}
.ss4ApplicationPop.fdccProcess .customFormGroup.mNeg p{color:var(--ss4-redMedium);}

/*# ::::: SS4 Applications PopUp - DataGrid ::::: #*/
.ss4ApplicationPop.fdccProcess .widget-datagrid{display:block;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .widget-datagrid-content{margin:0;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .table .th .filter{display:none;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .table .th{border-radius:0;}

/*# ::::: SS4 Applications PopUp - DataGrid content ::::: #*/
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex span.marker{color:var(--ss4-mediumGrey);background:none;padding:0;font-size:22px;text-indent:-9999px;width:15px;height:22px;line-height:22px;display:none;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex span.marker::before{content:"-";text-indent:0;float:left;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex.mPos span.marker{color:var(--ss4-greenMedium);display:block;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex.mPos span.marker::before{content:"\2191";}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex.mNeg span.marker{color:var(--ss4-redMedium);display:block;padding-top:1px;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex.mNeg span.marker::before{content:"\2193";}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex p{margin:0;line-height:1.7em;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex.mPos p{color:var(--ss4-greenMedium);}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex.mNeg p{color:var(--ss4-redMedium);}
.ss4ApplicationPop.fdccProcess .widget-datagrid .flex .oldVal{margin-left:5px;}

/*# ::::: SS4 Applications PopUp - Datagrid rows ::::: #*/
.ss4ApplicationPop.fdccProcess .widget-datagrid .table .tr.mAdd .td{background:#D8FAD5;}
.ss4ApplicationPop.fdccProcess .widget-datagrid .table .tr.mDel .td{background:#F6D6D6;}

/*# ::::: SS4 Applications PopUp - Financial docs list ::::: #*/
.ss4ApplicationPop.fdccProcess .finDocList{margin:0;}
.ss4ApplicationPop.fdccProcess .finDocList .finDoc{background:#f3f3f3;margin:0 20px 22px;border:1px solid #cecccc;}
.ss4ApplicationPop.fdccProcess .finDocList .finDoc.mPos{border:1px solid var(--ss4-greenMedium);}
.ss4ApplicationPop.fdccProcess .finDocList .finDoc.mNeg{border:1px solid var(--ss4-redMedium);}

/*# ::::: SS4 Applications PopUp - Grant list ::::: #*/
.ss4ApplicationPop.fdccProcess .grantList{margin:0;}
.ss4ApplicationPop.fdccProcess .grantList .grant{background:#ececec;padding:20px;border:1px solid #c9c5c5;margin:10px 0 0;}
.ss4ApplicationPop.fdccProcess .grantList .grant .control-label{display:block;}
.ss4ApplicationPop.fdccProcess .grantList .grant .asSrs{margin-bottom:0px;display:flex;align-items:center;padding:11px 14px 11px 16px;}
.ss4ApplicationPop.fdccProcess .grantList .grant .asSrs .flexIcon{width:26px;}

/*# ::::: SS4 Applications PopUp - Bank account list ::::: #*/
.ss4ApplicationPop.fdccProcess .bankAccountList{margin-top:20px;}
.ss4ApplicationPop.fdccProcess .bankAccountList .mx-tabcontainer .mx-tabcontainer-tabs{border:0;margin:0;}
.ss4ApplicationPop.fdccProcess .bankAccountList .mx-tabcontainer .mx-tabcontainer-tabs > li > a{border:1px solid #eaeaea;border-radius:0;background:#eaeaea;margin:0;padding:15px 20px 14px;margin-right:10px;}
.ss4ApplicationPop.fdccProcess .bankAccountList .mx-tabcontainer .mx-tabcontainer-tabs > li.active > a, 
.ss4ApplicationPop.fdccProcess .bankAccountList .mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:hover, 
.ss4ApplicationPop.fdccProcess .bankAccountList .mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:focus, 
.ss4ApplicationPop.fdccProcess .bankAccountList .mx-tabcontainer .mx-tabcontainer-tabs > li a:hover, 
.ss4ApplicationPop.fdccProcess .bankAccountList .mx-tabcontainer .mx-tabcontainer-tabs > li > a:focus{background:#fff;border-color:var(--primary-40) var(--primary-40) #fff;z-index:2;position:relative;}
.ss4ApplicationPop.fdccProcess .bankAccountList .mx-tabcontainer .mx-tabcontainer-tabs > li a:hover{border-bottom-color:var(--primary-40);}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content{padding:20px;background:#fff;border:1px solid var(--primary-40);position:relative;}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content .mx-listview-searchbar{margin-bottom: 20px;}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content .mx-listview-searchbar .btn{padding:11px 14px;margin-left:10px;display:flex;align-items:center;}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content .btn .glyphicon{margin:0;}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content .mx-listview > ul {margin:0;}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content .selectList .lineBox{padding:10px 20px;margin-bottom:5px;}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content .selectList > ul > li:last-child .lineBox{margin-bottom:0px;}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content .selectList .lineBox .inLine{vertical-align:initial;}
.ss4ApplicationPop.fdccProcess .bankAccountList .tab-content .btn.mx-listview-loadMore{margin:20px 0 0;}

/*# ::::: SS4 Applications PopUp - Bank account selected ::::: #*/
.ss4ApplicationPop.fdccProcess .bankAccountSelected{padding:20px 20px 13px;background:#fff;border:1px solid var(--primary-40);margin-top:20px;}

/*# ::::: SS4 Applications PopUp - Alerts ::::: #*/
.ss4ApplicationPop.fdccProcess .alert {display:block;padding:12px 16px;}
.ss4ApplicationPop.fdccProcess .alert-info{color:#0c5460;background-color:#d1ecf1;border:1px solid #bee5eb;}
.ss4ApplicationPop.fdccProcess .alert-success{color:#155724;background-color:#d4edda;border:1px solid #c3e6cb;}
.ss4ApplicationPop.fdccProcess .alert-danger{color:#721c24;background-color:#f8d7da;border:1px solid #f5c6cb;}
.ss4ApplicationPop.fdccProcess .alert-gray{display:inline-block;color:#000;background-color:#fff;border:1px solid var(--primary-40);border-radius:0;}

/*# ::::: SS4 Applications PopUp - Timeline ::::: #*/
.timeline.cT{margin:0px;}
.timeline.cT .widget-timeline-events-wrapper{border-color:#ced0d3;}
.timeline.cT .widget-timeline-icon-wrapper{width:14px;height:14px;top:5px !important;}
.timeline.cT .widget-timeline-event .timelineIcon{width:100%;height:100%;margin:0;background:var(--gray-400);}
.timeline.cT .widget-timeline-event .timelineIcon.obInitl{background:var(--primary-40);}


/* Edit leaflet */

.popUpEditLeaflet {position: fixed; width: 100vw !important; height: 100vh !important; top:0 !important; left: 0 !important; overflow: auto; z-index: 121 !important; max-width: 100vw; overflow-x: auto;}
.popUpEditLeaflet > .modal-content {min-width: 1350px; border:unset !important; border-radius: 0 !important;}
.profile-tablet .popUpEditLeaflet > .modal-content, .profile-phone .popUpEditLeaflet > .modal-content {min-width: unset;}
.profile-phone .popUpEditLeaflet .leafletImg  {max-width: 90vw;}
.profile-tablet .popUpEditLeaflet .leafletImg {max-width: 90%;}
.popUpEditLeaflet .mx-window-content {background: unset;}
.leafletTop {position: absolute; left: 0;  top: 0;  z-index: 10;}
.leafletTop .leafletBut {background-color: #fff;  padding: 10px 15px;  border-radius: 10px; margin-bottom: 10px; display: inline-block; color: var(--gray-700); text-decoration: none; font-weight: 600;}
.leafletTop .leafletBut.standard:hover, .photoButtons .button:hover {background-color: #909090; color:white;}
.photoButtons .text:hover {color:white;}
/*keyboard focus*/
.leafletTop .leafletBut.cancel:focus,.leafletTop .leafletBut.send:focus, .leafletCont .textEditOptions .tox-tbtn:focus {outline: none; box-shadow: inset 0 0 0 3px #E47301, inset 0 0 0 5px white;}
.leafletTop .leafletBut.standard:focus, .photoButtons .button:focus {outline: none; box-shadow: inset 0 0 0 1px white, inset 0 0 0 5px #E47301;}

.leafletTop .leafletBut.cancel {background-color: #EB5757; color: white;}
.leafletTop .leafletBut.cancel:hover {background-color: #7F1010; }
.leafletTop .leafletBut.send, .leafletEditPhone .leafletBut.send {background-color: #28A745; color: white;}
.leafletTop .leafletBut.send:hover {background-color: #134E21; }
.leafletTop .leafletSwitchText {margin-bottom: 6px; color: #F8F9FA; text-decoration: none; font-weight: 600;}
.popUpEditLeaflet .widget-switch .checked, .popUpEditLeaflet2 .widget-switch .checked {background-color: #f47d21; border-color: #f47d21; box-shadow: inset 0 0 0 16px #f47d21;border-width: 3px}
.popUpEditLeaflet .widget-switch .un-checked, .popUpEditLeaflet2 .widget-switch .un-checked {border-color: lightgrey; background-color: lightgrey; border-width: 3px; box-shadow: inset 0 0 0 0 grey;}
.leafletTop .leafletSwitchText:focus,.popUpEditLeaflet .widget-switch:focus,.popUpEditLeaflet2 .widget-switch:focus {outline: none; box-shadow: inset 0 0 0 3px #ffffff, inset 0 0 0 5px white;}
.popUpEditLeaflet .tox-toolbar-overlord {position: absolute; left: -23px;}
.textEditOptions .mx-dataview-content::-webkit-scrollbar {width: 10px; border-radius: 5px;}
.textEditOptions .mx-dataview-content::-webkit-scrollbar-track {background: rgba(255, 255, 255, 0.05);}
.textEditOptions .mx-dataview-content::-webkit-scrollbar-thumb {background: rgba(255, 255, 255, 0.2);}
.textEditOptions .mx-dataview-content::-webkit-scrollbar-thumb-hover {background: rgba(255, 255, 255, 0.3);}
.leafletButClose {position: fixed;  right: 10px;  top: 10px;  width: 40px;  height: 40px; text-decoration: none !important;  background-color: var(--primary-60);  color: #fff;  font-size: 30px;  font-weight: 700;  text-align: center;  line-height: 36px;  border-radius: 20px;  cursor: pointer;  z-index: 101;}
.leafletButClose:hover {background-color: #fff; color: var(--primary-60);}
.textEditOptions > div {position: relative;}


/*aCCESSIBILITY buttons hover and keyborad focus states - to be tested* - previous version - to be deleted later/ 
 .ql-formats button:focus-visible, .ss4 .mx-button:focus-visible,  .profile-desktop button:focus-visible, .ql-formats>button[title="Right align"]:focus-visible, span.ql-picker-item:focus-visible, .textI:focus-visible, .textD:focus-visible, .ss4tab [role="tablist"]>li>a:focus-visible, .resetFilters:focus-visible, .ss4 input:focus-visible, .ss4 .widget-datagrid-content a[role="button"]:focus-visible, .ss4 .widget-datagrid-content .column-container > div[role="button"]:focus-visible  {outline: 4px solid var(--focus-outline) !important; outline-offset: 2px; box-shadow: 0 0 0 4px white; border: unset !important;}
.photoButtons .button:focus-visible, .changePhotoFileDropper div:focus-visible,.leafletPreviewCont img[role="button"]:focus-visible  {outline: 4px solid var(--focus-outline); outline-offset: 2px; box-shadow: 0 0 0 4px white; }
.ss4TopBen a[role="menuitem"]:focus-visible, .ss4TopBen button:focus-visible, .ss4TopBen .dropdown-menu-right>a:focus-visible, .ss4 [role="tablist"]>li:focus-visible, .ss4 input.dropdown-triggerer:focus-visible, .ss4 input:focus-visible, .ss4 .leafletInfoButton:focus-visible  {outline: none !important; box-shadow: inset 0 0 0 1px white, inset 0 0 0 5px var(--focus-outline) !important;}
.featuredNews [role="listitem"]:focus-visible {outline: none; box-shadow: inset 0 0 0 1px white, inset 0 0 0 5px #E47301;}
*/

/*aCCESSIBILITY buttons hover and keyborad focus states - to be tested*/ 
/*(ulotki-tak jak bylo)*/
.ql-formats button:focus-visible,  .ql-formats>button[title="Right align"]:focus-visible, span.ql-picker-item:focus-visible, .textI:focus-visible, .textD:focus-visible {outline: 4px solid var(--focus-outline) !important; outline-offset: 2px; box-shadow: 0 0 0 4px white; border: unset !important;}
.photoButtons .button:focus-visible, .changePhotoFileDropper div:focus-visible,.leafletPreviewCont img[role="button"]:focus-visible  {outline: 4px solid var(--focus-outline); outline-offset: 2px; box-shadow: 0 0 0 4px white; }


/*NEW Kasia Accessibility input keyboard focus - to be tested*/ 
.role-beneficiary .form-control:focus-visible, .role-beneficiary .resetFilters:focus-visible, .role-beneficiary .ss4 img[role="button"]:focus-visible, .role-beneficiary .ss4 .dropdown-content>ul>li:focus-visible, .role-beneficiary .widget-datagrid a[role="button"]:focus-visible, .role-beneficiary main .widget-gallery div[role="button"]:focus-visible, .role-beneficiary .ss4FootLinks a:focus-visible {outline: var(--focus-outline) solid 5px !important; outline-offset: -3px !important;}
.profile-phone .form-control:focus-visible,.profile-phone .resetFilters:focus-visible, .profile-phone .ss4 img[role="button"]:focus-visible, .profile-phone .ss4 .dropdown-content>ul>li:focus-visible, .profile-phone .widget-datagrid a[role="button"]:focus-visible, .profile-phone main .widget-gallery div[role="button"]:focus-visible, .profile-phone .ss4FootLinks a:focus-visible {outline: var(--focus-outline) solid 3px !important; outline-offset: -2px !important;}
.role-beneficiary .ss4 .widget-datagrid .btn-calendar:focus-visible {outline: var(--focus-outline) solid 5px !important; outline-offset: -3px !important; border:unset; box-shadow: inset 0 0 0 5px white; }
.role-beneficiary .ss4 .widget-datagrid .btn-calendar:focus::before {border:unset;}
.role-beneficiary .ss4TopBen a[role="menuitem"]:focus-visible, .role-beneficiary .ss4TopBen .dropdown-menu-right>a:focus-visible,.role-beneficiary .ss4 button.dropdown-button:focus-visible,.role-beneficiary .ss4tab [role="tablist"]>li>a:focus-visible {outline: none !important; box-shadow:  inset 0 0 0 5px var(--focus-outline) !important;}
.role-beneficiary .ss4 .mx-button:focus-visible,.role-beneficiary .ss4 .widget-datagrid-load-more:focus-visible, .role-beneficiary .ss4 .leafletInfoButton:focus-visible {outline: var(--focus-outline) solid 4px !important; outline-offset: -2px; box-shadow: inset 0 0 0 3px white !important;transition: unset;}
.role-beneficiary div[role="button"] .education-list-item:focus-visible {border: var(--focus-outline);border-width: thick; border-style: solid;border-radius: 10px;}
.role-beneficiary .ss4 .widget-datagrid .column-container {outline:unset; }
.role-beneficiary .ss4 .widget-datagrid .column-header[role="button"]:focus-visible, .role-beneficiary .ss4 .skip-button:focus-visible, .role-beneficiary .ss4 .paperLink:focus-visible, .ss4 .alert a[role="button"]:focus-visible, .freePrints div[role="button"]:focus-visible { box-shadow: inset 0 0 0 4px var(--focus-outline) !important; outline: 1px solid var(--focus-outline);}
.role-beneficiary .featuredNews [role="listitem"]:focus-visible {outline: none !important; box-shadow:  inset 0 0 0 5px orange !important; padding:3px;}
.role-beneficiary .applicationType:focus-visible {border-color: orange; outline: 5px solid orange; outline-offset: -3px;}
.ss4login .alert a[href]:focus-visible, .ss4login .formblock input:focus-visible, .ss4login .forgotPassword:focus-visible, .ss4login button:focus-visible, .ss4login .ss4Foot a[role="button"]:focus-visible,.ss4login .panelHide:focus-visible, .ss4login .rightPanel div[role="button"]:focus-visible {outline: var(--focus-outline) solid 4px !important; outline-offset: -2px; box-shadow: inset 0 0 0 3px white !important;transition: unset;}
.role-beneficiary .ss4 .fakeTabs a[role="button"]:focus-visible  {outline: none !important; box-shadow:  inset 0 0 0 5px var(--focus-outline), inset 0 -17px 0 -5px var(--focus-outline) !important;}


/* change photo */
.popUpEditLeaflet2 {position: fixed; width: 100vw !important; height: 100vh !important; top:0 !important; left: 0 !important; z-index: 125 !important; max-width: 100vw;}
.popUpEditLeaflet2 .mx-dataview-content {height:unset; align-items: center; display: flex;}
.popUpEditLeaflet2 .mx-window-content {background-color: rgba(0,0,0,0.7);}
.popUpEditLeaflet2 div.mx-window-body {justify-content: center; align-items: center; display:flex; }
.popUpEditLeaflet2 .title {font-size: 18px;color:#000; font-weight: bold;}
.popUpEditLeaflet2 .closeBut {width: 32px; height: 32px; text-align: center; border-radius: 16px; background-color: #ed7601; color: #fff;  font-size: 25px; line-height: 30px; text-decoration: none; font-weight: bold; }

.popUpEditPhoto {position: fixed; width: 600px !important; height: 600px !important;  z-index: 130 !important; top: 50%; left: 50%; }
.popUpEditPhoto2 {position: fixed;   z-index: 130 !important; top: 50%; left: 50%; }


.lpPopCont{background:#fff;margin:40px;width:600px;height:600px;border-radius:5px;}
.flexCont{display:flex;align-items:center;justify-content:space-between;align-content:space-between;flex-direction:column;height:100%;width:100%;}
.flexCont .main .picBox{display:flex;height:420px;align-items:center;justify-content:center;margin:25px;}
.flexCont .main .picBox .picPreview{max-width:100%;max-height:420px;width:auto;margin:0;}
.flexCont .foot{padding: 25px;}

.popUpCropImage {position: fixed;  z-index: 145 !important; top: 50%; left: 50%; width:auto;}
.popUpCropImage .modal-body {height:100%; width:auto}
.popUpCropImage .mx-scrollcontainer {display:flex !important; table-layout:unset !important;}

.photoTop .leafletBut {background-color: #fff;  padding: 10px 15px;  border-radius: 10px; margin-bottom: 10px; display: inline-block; color: var(--gray-700); text-decoration: none; font-weight: 600;}
.photoTop .leafletBut:hover {opacity: 0.9;}
.photoTop .leafletSwitchText {margin-bottom: 6px; color: #F8F9FA; text-decoration: none; font-weight: 600;}

.photoButtons .leafletBut { background-color: #fff;  padding: 10px 15px;  border-radius: 10px; margin-bottom: 10px; display: inline-block; color: var(--gray-700); text-decoration: none; font-weight: 600;}
.photoButtons .leafletBut:hover {opacity: 0.9;}

.photoButtons .button {background-color: white; padding: 10px 15px; border-radius: 10px; border-width: 2px; border-color: black; border-style: solid;transition: background-color 0.3s ease; height:40px ;}
/*.photoButtons .button:hover {background-color:var(--gray-400);}*/
.photoButtons .text {color: var(--gray-700); text-decoration: none; font-weight: 600;}
/*.leafletsChangePhotoPhone .button {height:30px ;} */
.leafletsChangePhotoPhone .button {border-radius: 4px ;}

/*leaflet generate*/
.leafletTemplates {background-color: orange; border-radius: 40px; box-shadow: inset 0 0 0 30px orange;}
.profile-phone .leafletTemplates {background-color: orange; border-radius: 20px; box-shadow: inset 0 0 0 30px orange;}


.native .infoDot {justify-content:center; }
.leafletCont .richTextEditor {padding: 0 !important;}
.contEditable p {padding: 0 !important; line-height: inherit !important; margin:0 !important}
.leafletCont:not(.lPreview) .contEditable {display: none;}
.leafletCont .leafletHtml {    user-select: none; -webkit-user-select: none; -moz-user-select: none;   -ms-user-select: none;}
.leafletCont .widget-rich-text-toolbar {position: absolute; background-color: unset !important; box-shadow: unset !important; left: -105px; width: 30px;}
.profile-tablet .leafletCont .widget-rich-text-toolbar {left: -80px;}
.leafletCont .widget-rich-text-toolbar .icons, .leafletCont .widget-rich-text-toolbar .ql-picker-item, .leafletCont .textChange  {margin: 0 0 5px 0; background-color: var(--ss4-orangeMedium) !important; color: #fff !important; border-radius: 20px; line-height: 37px !important; width: 40px !important; height: 40px !important; text-align: center;}
.leafletCont .widget-rich-text-toolbar .icons:hover, .leafletCont .widget-rich-text-toolbar .ql-picker-item:hover, .leafletCont .textChange:hover {background-color: var(--ss4-black) !important; color: #fff;}
.leafletCont .widget-rich-text-toolbar .ql-picker-label {display: none;}
.leafletCont .widget-rich-text-toolbar .ql-picker, .leafletCont .widget-rich-text-toolbar .ql-picker:hover {background-color: unset !important;}
.leafletCont .widget-rich-text-toolbar .ql-picker-options {display: block !important;  height: 90px !important;  position: relative !important;  box-shadow: unset !important;  background: unset !important; padding: 0 !important; overflow: visible !important;}
.leafletCont .richTextEditor {padding: 0 !important; margin: 0 !important; position: absolute; top:0; left: 0; width: 100%; height: 100%;}
.leafletCont .widget-rich-text {height: 100%; min-height: 100% !important; overflow: visible; background: none !important; border: unset !important; font-size: inherit !important; font-family: inherit !important; font-weight: inherit !important; color: inherit !important; line-height: inherit !important;}
.leafletCont .tox .tox-toolbar__group {flex-direction: column;}
.leafletCont .richTextEditor .ql-container {font-family: inherit !important; font-size: inherit !important;}
.leafletCont .richTextEditor .ql-editor {word-wrap: inherit !important; line-height: inherit !important; padding: 14px !important; overflow-y: visible !important;  height: auto !important; min-height: 100% !important;  border: 1px dashed #ddd; border-radius: 5px;}
.role-beneficiary .leafletCont .richTextEditor .ql-editor:focus {padding: 10px !important; border: 5px solid var(--focus-outline);}
.leafletCont .richTextEditor .ql-editor p {line-height: inherit !important;}
.leafletCont .richTextEditor .widget-rich-text-container {min-height: 100% !important; overflow-x: hidden; overflow-y: auto;}
.leafletCont .richTextEditor .widget-rich-text .flexcontainer.flex-column {max-height: 100%; overflow: hidden;}
.textEditOptions .widget-rich-text-container::-webkit-scrollbar {width: 5px; border-radius: 5px; margin-right: -10px;}
.textEditOptions .widget-rich-text-container::-webkit-scrollbar-track {background: rgba(0, 0, 0, 0.05);}
.textEditOptions .widget-rich-text-container::-webkit-scrollbar-thumb {background: rgba(0, 0, 0, 0.2);}
.textEditOptions .widget-rich-text-container::-webkit-scrollbar-thumb-hover {background: rgba(0, 0, 0, 0.3);}
.textChange {position: absolute; z-index: 100; left: -95px; top:280px; cursor: pointer;}
.profile-tablet .textChange {left: -70px;}
.textChange.textD {top:325px;}
.textChange.cleanH {top:370px;}
.textChange img { margin: 8px auto;}
.textChange.disabled, .textChange.disabled:hover {background-color: var(--primary-50) !important; cursor: not-allowed;}
.largeDropper .filedropper__dropzone {height: 270px; padding:170px 35px 20px 35px !important; background: var(--gray-100) url(/images/FilePreview2.svg) no-repeat center 65px !important; background-size: 80px auto !important; margin-top: 115px !important; }
.jcrop-handle {width: 10px !important; height: 10px !important;  background-color: #000 !important; opacity: 0.7 !important;}
.profile-desktop .leafletCont .widget-rich-text-toolbar .icons::after, .profile-desktop .leafletCont .widget-rich-text-toolbar .ql-picker-item::after, .profile-desktop .leafletCont .textChange::after {position: absolute; font-size: 15px; height: auto;  right: 32px;  border-radius: 21px; color: #000; padding: 0px 10px; white-space: nowrap;  width: auto;  background: #fff;  font-family: 'ProximaNova';  opacity: 0.8;  font-weight: 600;  margin-top: -2px;}
.profile-desktop .leafletCont .widget-rich-text-toolbar .icons::after:hover, .profile-desktop  .leafletCont .widget-rich-text-toolbar .ql-picker-item::after:hover, .profile-desktop  .leafletCont .textChange::after:hover {opacity: 0.9;}
.profile-desktop  .leafletCont .ql-bold::after {content: 'Pogrubienie';}
.profile-desktop .leafletCont .ql-italic::after {content: 'Kursywa';}
.profile-desktop .leafletCont .icon-Text-align-left::after {content: 'Tekst do lewej';}
.profile-desktop .leafletCont .icon-Text-align-right::after {content: 'Tekst do prawej';}
.profile-desktop .leafletCont .ql-picker-item:first-child:after {content: 'Tekst wyśrodkowany';  right: 48px;}
.profile-desktop .leafletCont .ql-picker-item:last-child:after {content: 'Tekst wyjustowany';  right: 48px;}
.profile-desktop .leafletCont .textI::after {content: 'Powiększ czcionkę'; top: 3px;  right: 50px;}
.profile-desktop .leafletCont .textD::after {content: 'Pomniejsz czcionkę'; top: 3px;  right: 50px;}
.profile-desktop .leafletCont .cleanH::after {content: 'Wyczyść style'; top: 3px;  right: 50px;}
.profile-tablet .flex .leafletPreview:last-child, .profile-phone .flex .leafletPreview:last-child {margin-right: 0;}
.role-beneficiary .leafletCont .leafletHtml::after {position: absolute; content: 'SZKIC'; top: 324px; left: 50%; margin-left: -300px; color: rgba(0, 0, 0, 0.7); border: 30px solid rgba(0, 0, 0, 0.7); border-radius: 300px; width: 600px; height: 600px; font-size: 150px;  font-weight: 700;  text-align: center;  z-index: 10000;  line-height: 550px;}
.role-beneficiary .lCard.leafletCont .leafletHtml::after { top: 100px;  margin-left: -200px; border: 20px solid rgba(0, 0, 0, 0.7); width: 400px; height: 400px; font-size: 100px; font-weight: 700;  line-height: 350px;}
.role-beneficiary .lCard.leafletCont:nth-child(2) .leafletHtml::after, .role-beneficiary .lCard.cardPage2 .leafletHtml::after {display: none;} 
.lfbor.leafletPreview {position: relative;}
.role-beneficiary .lfbor.leafletPreview::after {content:'SZKIC'; position: absolute;  color: rgba(0, 0, 0, 0.5); left: 50%; font-size: 2vw; top:50%; position: absolute; transform: translate(-50%, -50%);  border: 0.4vw solid rgba(0, 0, 0, 0.5); border-radius: 300px; width: 40%; aspect-ratio: 1 / 1; font-weight: 700;  text-align: center;  z-index: 2;   display: flex;  justify-content: center;  align-items: center; }
.profile-tablet  .lfbor.leafletPreview::after {font-size: 30px; border-width: 7px;}
.profile-tablet .tprev.leafletPreview::after {font-size: 20px; border-width: 4px;} 
.profile-phone .tprev.leafletPreview::after {font-size: 20px; border-width: 4px;} 
.imgPopUp {max-width: 874px; margin: 20px auto 0 auto;}
.topDownload, .leafletNoEdit, .leafletCardMessage {position: fixed;  top: 0;  left: 50vw; padding: 15px 20px; background-color: rgba(0, 0, 0, 0.9); border-bottom-left-radius: 7px; border-bottom-right-radius: 7px;  height: 60px; width: 208px;  margin-left: -104px;}
.leafletNoEdit, .leafletCardMessage {font-size: 1.3rem;  color: #fff;  font-weight: 600;  white-space: nowrap;  width: auto;  padding: 20px; left: 50%; transform: translate(-50%, 0); margin-left: 0;}
.leafletCardMessage { width: 300px;  z-index: 1;  height: auto;  border-radius: 10px;  text-align: center;  opacity: 0.8; top:50%; transform: translate(-50%, -50%); position: absolute;}

.topDownload img:hover {margin-top:-8px; }
.topDownload img {-webkit-transition: margin 0.2s ease !important;}




/*web*/

.jcrop-holder > div > div > .jcrop-tracker::before {background:url(/images/face.svg) no-repeat center; width: 70%; height: 70%; position: absolute; background-size: 100% 100%; content: ''; opacity: 0.3; top:15%; left: 15%;}

/*Leaflets-create buttons*/
.newOrderButton {position: absolute !important; right: 0px;top: -50px;}
.profile-tablet .newOrderButton {right: 20px;  top: -128px;}
.profile-phone .newOrderButton {right: 20px;  top: -163px;}
.newDraftButton {position: absolute !important; right: 260px;top: -50px;}
.newProjectButton {position: absolute !important; right: 0px;top: -97px; width:200px;}
.mobilePageContent .newProjectButton1 {position: absolute !important; right: 27px;top: -130px; width:200px;}
.leafletInfoButton {line-height: 1.3em; position: absolute; top:-54px; left:91px;}
.profile-tablet .leafletInfoButton {position: relative; top:unset; left: unset;}
.freePrints {position: absolute; top:-60px; right: 0;}
.profile-tablet .freePrints {right: 40px;  top: 70px;}
.profile-phone .freePrints {position: relative; right: unset; top:unset}
.leafletInfoButton:hover {text-decoration: underline;}
.leafletInfoButton > span {margin-left:15px; font-size: 14px; margin-left: 10px; font-size: 14px; color: #416CB1; font-weight: 500; margin-top: 3px;}

/*Leaflet creator - buttons*/

.leafletCont .textEditOptions .tox-tbtn {width: 60px; height: 60px; background-color: white; border-radius: 30px;  }
.leafletCont .textEditOptions .tox-tbtn:hover >span>svg {background-color: #909090; fill:white;}
.leafletCont .textEditOptions .tox-tbtn:hover {background-color: #909090;}
.leafletCont .textEditOptions .tox-tbtn::after {position: absolute; color: white; font-weight: 600; font-size: 17px; margin-left: 500px; display:inline-block; vertical-align:middle; width:400px; }
.leafletCont .textEditOptions .tox-toolbar__primary {background-color: unset;}
.leafletCont .textEditOptions .tox-toolbar-overlord {position: absolute; margin-left: 920px; background-color: unset;}
.tablet .leafletCont .textEditOptions .tox-toolbar-overlord {position: absolute; margin-left: -220px; background-color: unset; top: 200px;}

/*.ql-formats>button[title="Bold"]:focus, .ql-formats>button[title="Italic"]:focus, .ql-formats>button[title="Left align"]:focus, .ql-formats>button[title="Right align"]:focus, span.ql-picker-item[data-value="center"]:focus, span.ql-picker-item[data-value="justify"]:focus, .textI:focus, .textD:focus {box-shadow: inset 0 0 0 3px #547DC0,  inset 0 0 0 5px white;}*/

    

span.ql-picker-item[data-value="center"]:focus-visible, span.ql-picker-item[data-value="justify"]:focus-visible { outline-color: unset; outline-style: unset; outline-width: unset;}

.leafletCont .textEditOptions .tox-toolbar__primary {background-image: none !important; }

/*ticket notes history*/
.ticketNotesHistory .history {width:100%}

/*ticket details*/
.ticketOrder {background: var(--gray-100); margin-top: 20px; padding:20px;}
.ticketOrderCrm {background: var(--gray-100); margin-top: 20px; padding:20px; border-radius: 20px; margin-bottom: 20px;}
.rightPopPanel {top:0 !important; z-index: 145 !important;}
.rightPopPanel::before, .popUpCropImage::before {position: fixed; content: ''; top:0; right:0; width: 200vw; height: 200vw; background-color: rgba(0,0,0,0.5); z-index: 145 !important;}
.rightPopPanel .modal-content, .popUpCropImage .modal-content {z-index: 146 !important;}   


/*leaflet text validation*/
.leafletCont div.mx-validation-message {font-size: 18px; margin-top: 22px; font-weight: 600;}

/*# ::::: ComboBox ::::: #*/
.widget-combobox-menu{z-index:10;}

.leafletTabletEdit {position: fixed; bottom: 0;  background-color: #fff;  left: 0;  width: 100vw;  font-size: 0.9rem;}
.leafletTabletEdit > div {flex: 1; display: flex;}
.leafletTabletEdit a {color: #000; padding: 5px;  font-size: 12px;    justify-content: center; align-items: center; height: 80px;  border-right: 1px solid #e3e3e3; width: 100%; display: flex; text-align: center; text-transform: uppercase; font-weight: 600; line-height: 1.2em; }
.leafletTabletEdit > div:last-child a {border-right: 0;}
.leafletTabletEdit .leafletBut.cancel {background-color: #EB5757; color: white;}
.leafletTabletEdit .leafletBut.cancel:hover {background-color: #7F1010; }
.leafletTabletEdit .leafletBut.send {background-color: #28A745; color: white;}
.leafletTabletEdit .leafletBut.send:hover {background-color: #134E21; }
.lefTablWrap {padding-bottom: 80px;}
.lefTablWrap > .mx-dataview-content {padding: 20px 0 !important;}
.picCont {width:600px;  height:600px;  display: flex !important;  align-items: center !important;  flex-direction: column !important; position: relative;}
.picCont div {max-width: 600px;  max-height: 475px;}
.picPreview {margin: 20px auto 0 auto; max-width: 90%; max-height: 100%;}

/* PWA install */

.profile-phone .installapp {bottom: 80px;}
.installApp h6 {font-family: 'Open Sans', sans-serif;}
.installApp {position: fixed;  width: 90vw;  bottom: 10px; font-family: 'Open Sans', sans-serif; font-size: 1rem; background-color: #fff; border-radius: 10px; transform: translate(-50%, 300px); padding: 15px; left: 50%;  max-width: 550px;  box-shadow: 0 0 50px rgba(92, 99, 107, .3); z-index: 102;  transition: transform 0.7s ease-in-out;}
.installappShow {transform: translate(-50%, 0); }
.installApp svg {width: 20px; vertical-align: middle; display: inline-block; margin: 0 10px 8px 0;}
.installApp svg.icon2 {margin-bottom: 5px;}
.pClose {color: var(--primary-60); cursor: pointer;}

/* New appointment */
.AppointmentPop .formDetailsA {max-height: calc(100vh - 184px); }
.AppointmentPop {height: auto !important; width: auto !important; left: 50% !important; transform: translate(-50%, -50%); top:50% !important; }
.leftA, .rightA {width: 49vw; min-height: 400px; max-height: calc(100vh - 184px); overflow-y: auto;}
.rightA {height: calc(100vh - 184px); }
.AppointmentPop .widget-combobox-menu {position: absolute !important; left: 0 !important; top:40px !important}
.asButton label {border-radius: 5px !important; padding: 7px 12px !important; width: 100% !important; text-align: center !important; border: 1px solid var(--gray-300); color: var(--gray-400) !important; cursor: pointer !important;}
.asButton input {display: none !important;}
.asButton input:checked ~ label {color: var(--success) !important; border-color: var(--success) !important;}
.AppointmentPop .ss4Application .textWithWidget {flex-wrap: nowrap; min-height: 17px;} 
.AppointmentPop .ss4Application .textWithWidget p, .AppointmentPop .ss4Application .textWithWidget span, .AppointmentPopVis .textWithWidget p {line-height: 17px; margin-bottom: 0; white-space: nowrap;}
.AppointmentPop .ss4Application .textWithWidget span {margin: -5px 0 -5px 5px;}
.AppointmentPop .modal-body, .AppointmentPop .mx-scrollcontainer-wrapper, .AppointmentPop .mx-dataview-content {height: auto !important; overflow: visible !important;}
.widget-combobox-placeholder-empty .widget-combobox-caption-text {color: var(--gray-500);}
.flexTop .td {align-items: flex-start !important;}
.editLink {display: inline-block;  margin: -5px 0 0 5px !important; cursor: pointer;}
.AppointmentPopVis .mx-scrollcontainer-wrapper, .AppointmentPopVis .mx-window-content, .AppointmentPopVis .mx-window-body {overflow: visible !important;}

.mbsc-popup-wrapper {z-index: 100 !important;}
.mbsc-schedule-event:not(.mbsc-schedule-event-dragging)[data-id^="mbsc"] {display: none !important;}

.AppointmentPop .mx-tabcontainer .mx-tabcontainer-tabs > li > a {font-size: 15px; padding: 10px;}