:root {
	--color-main: #17375e;
}

@font-face {
	font-family: "Parisienne Regular";
	src: url("../fonts/Parisienne-Regular.ttf")
}

@font-face {
	font-family: 'Segoe UI Light';
	src: url('../fonts/segoe_ui_light.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}


@keyframes blink-animation {
    to {
      visibility: hidden;
    }
}

h1, h1 > span,
h2, h2 > span,
h3, h3 > span,
h4, h4 > span, 
h5, h5 > span {
	font-family: Arial, sans-serif;
}

.material-icons {
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;  /* Preferred icon size */
	display: inline-block;
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;
  
	/* Support for all WebKit browsers. */
	-webkit-font-smoothing: antialiased;
	/* Support for Safari and Chrome. */
	text-rendering: optimizeLegibility;
  
	/* Support for Firefox. */
	-moz-osx-font-smoothing: grayscale;
  
	/* Support for IE. */
	font-feature-settings: 'liga';
}

.material-symbols-outlined {
	font-variation-settings:
	'FILL' 0,
	'wght' 400,
	'GRAD' 0,
	'opsz' 48
}


.big-scrollbar, .big-scrollbar div {
	scroll-behavior: auto;
}	


body {
    padding-top: 40px;
    padding-bottom: 40px;
    background-color: white;
}

.admin-view {
	flex: 1;
	height: calc(100vh - 56px);
	max-height: calc(100vh - 56px);
	overflow: auto;
}

.admin-view::-webkit-scrollbar {
    width: 20px;
    height: 20px;
}

.handwritten {
	font-family: "Parisienne Regular";
	font-size: 32px;
	margin-bottom: 0;
}

.menu li {
	margin-bottom: 8px;
}

/* width */
.big-scrollbar::-webkit-scrollbar {
    width: 20px;
    height: 20px;
}

			
/* width */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
	cursor: pointer;
}

/* Track */
::-webkit-scrollbar-track {
    /* border-radius: 10px; */
    background: #204D8411;
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: #204D84;
	cursor: pointer;
    /* border-radius: 10px; */
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #17375E;
}


html,body {
    height:100%;
}

.clickable {
    cursor: pointer;
}

.clickable:focus {
    outline: none;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.allow-select-text {
    -webkit-touch-callout: text; /* iOS Safari */
    -webkit-user-select: text; /* Safari */
    -khtml-user-select: text; /* Konqueror HTML */
    -moz-user-select: text; /* Firefox */
    -ms-user-select: text; /* Internet Explorer/Edge */
    user-select: text; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.whc-view {
	visibility: hidden;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	background: white;
}

.whc-view-normal {
	display: none;
	background: white;
}

.whc-view-active {
	display: block !important;
}


.whc-tabs-header {
	height: 48px;
	position: static;
	background: white;
	z-index: 2;
	width: 90vw;
	margin-left: 5vw;
}

.whc-tabs-button {
	user-select: none;
	width: 166px;
	height: 48px;
	color: rgba(0,0,0,0.54);
	font-size: 14px;
	text-align: center;
	line-height: 24px;
	padding: 12px 16px;
	cursor: pointer;
	white-space: nowrap;
	position: relative;
	text-transform: uppercase;
	float: left;
	font-weight: 500;
	box-sizing: border-box;
	overflow: hidden;
	text-overflow: ellipsis;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	border-bottom: 2px solid rgba(0,0,0,0);
}

.whc-tabs-button:hover {
	background: #fafafa;
}

.whc-tabs-button.whc-tabs-button-active {
	border-bottom: 2px solid rgb(255,64,129);
}


		
.whc-appt-view {
	display: none !important;
	width: 100%;
	height: max-content;
	z-index: 0;
	background: white;
}

.whc-appt-view-active {
	display: block !important;
	z-index: 1;
}


.whc-appt-tabs-header {
	height: 48px;
	position: static;
	background: white;
	z-index: 2;
	width: 100%;
	margin-left: 0;
}

.whc-appt-tabs-button {
	user-select: none;
	width: 166px;
	height: 48px;
	color: rgba(0,0,0,0.54);
	font-size: 14px;
	text-align: center;
	line-height: 24px;
	padding: 12px 16px;
	cursor: pointer;
	white-space: nowrap;
	position: relative;
	text-transform: uppercase;
	float: left;
	font-weight: 500;
	box-sizing: border-box;
	overflow: hidden;
	text-overflow: ellipsis;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	border-bottom: 2px solid rgba(0,0,0,0);
}

.whc-appt-tabs-button:hover {
	background: #f1f1f1;
}

.whc-appt-tabs-button.whc-appt-tabs-button-active {
	border-bottom: 3px solid #22416699;
	color: #224166;
}







.md-datepicker-open input.md-datepicker-input {
	height: 39px !important;
}

.whc-event-edit-datepicker .md-datepicker-input-container {
	margin-left: 0px;
	width: 110px;
}

.whc-event-edit-datepicker.md-datepicker-open .md-icon-button+.md-datepicker-input-container {
	margin-left: 0px !important;
}

textarea {
	outline: 1px solid rgba(189, 189, 189, 1) !important;
}

textarea, textarea:focus {
	border: none !important;
	outline-offset: 0 !important;
}

textarea:focus {
	outline: 2px solid #5565be !important;
}

.hidden {
	display: none !important;
}

.nomargin {
	margin: 0 !important;
}

.textcut {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

:focus {
	outline: none;
}

			
.whc-button-small {
    height: 40px;
    min-height: 10px;
    padding-left: 30px;
    padding-right: 30px;
    line-height: 10px;
    padding-top: 14px;
    font-size: 10px;
    border: 1px solid #DDD;
    background: white;
    color: #999;
    display: inline-block;
    cursor: pointer;
    box-shadow: 0px 0px 10px rgba(100, 100, 100, 0.08);
    border-radius: 40px;
}	

.whc-button-small:hover {
	background: #17375E;
	border: 1px solid #17375E;
	color: white;
}

md-dialog[role=alertdialog] {
	max-width: 400px;
}

md-dialog {
	max-width: 100%;
    max-height: 100%;
	border-radius: 24px !important;
}

.md-dialog-disable-closing-animation md-dialog {
	-webkit-transition: none !important;
	transition: none !important;
	-webkit-animation-duration: 0s !important;
	animation-duration: 0s !important;
}

.whc-big-datepicker:hover {
    background: #17375ed2;
    color: white;
}

.whc-big-datepicker {
	padding: 15px 25px;
    box-sizing: content-box;
    border-radius: 80px;
    line-height: 0.95;
    margin-top: 10px;
    color: #17375E;
    background: #17375ef2;
    color: white !important;
    font-size: 35px;
    cursor: pointer;
    border: 3px solid #00000000;
    width: 183px;
    height: 33px;
    overflow: hidden;
}



.md-tooltip.md-show {
	-webkit-transition: none !important;
    transition: none !important;
    -webkit-transform: none !important;
}


md-tooltip {
	-webkit-transition: none !important;
    transition: none !important;
    -webkit-transform: none !important;
    
    min-height: 35px !important;
    max-height: 100px !important;
    height: max-content !important;
	border-radius: 0px !important;
	max-width: 600px !important;
	padding: 10px 15px 10px 15px !important;
    background-color: rgba(0, 0, 0, 0.8) !important;
	font-size: 13px !important;
	line-height: 14px !important;
	overflow: hidden;
	white-space: normal !important;
	text-overflow: ellipsis;

	margin: 0 !important;
}

md-tooltip div {
	border-radius: 0px !important;
	padding: 12px 15px !important;
    height: 42px !important;
    max-height: 42px !important;
    background-color: rgba(0, 0, 0, 0.8) !important;
	max-width: 1024px !important;
	font-size: 36px !important;
}

md-tooltip span {
	font-size: 36px !important;
	line-height: 17px;
	max-width: 1024px !important;
}

md-tabs.last-tab-hidden md-pagination-wrapper md-tab-item:last-of-type {
	display: none !important;
}

md-tabs.md-no-animation md-tab-content {
    transition: none;
}

md-tabs.md-no-animation md-ink-bar {
    transition: none;
}

md-tabs.md-no-animation md-tab-item {
    transition: none !important;
}















/** disable transitions and animations for tab-contents**/
md-tab-content.md-right:not(.md-active) {
    animation: none;
    -webkit-animation: none;
}

md-tab-content.md-left:not(.md-active) {
    animation: none;
    -webkit-animation: none;
}

md-tab-content.md-left:not(.md-active) * {
    transition: none !important;
    transition-duration: 0ms !important;
    transition-delay: 0ms !important;
}

md-tab-content.md-right:not(.md-active) * {
    transition: none !important;
    transition-duration: 0ms !important;
    transition-delay: 0ms !important;
}

.md-tab {
    transition: none !important;
    transition-duration: 0ms !important;
    transition-delay: 0ms !important;
}



























.height-100 {
	height: 100px;
}

.height-200 {
	height: 200px;
}

.height-300 {
	height: 300px;
}

.height-400 {
	height: 400px;
}

.whc-table {
	width: 100%;
	text-align: left; 
	border-radius: 8px;
    overflow: hidden;
    box-shadow: 0px -8px 12px 2px rgb(0 0 0 / 12%);
}

.whc-table-border {
	border: 1px solid #ccc;
}

.whc-table-header {    
	height: 30px;
    background: #17375ef2;
	width: 100%;
	padding-top: 5px;
    padding-left: 8px;
}

.child-highlighted .transparentable:not(.whc-card-selected) {
	opacity: 0.14;
	transition: transform 0.08s ease-in-out, opacity 0.08s ease-in-out !important;
}

.whc-table-header-cell {
	display: inline-block;
	width: 80px;
	color: white;
	font-size: 11px;
	line-height: 12px;
	padding-left: 5px;
	box-sizing: border-box;
	vertical-align: top;
	margin-top: 4px;
	cursor: pointer;
	height: 24px;
}

.whc-table-items {
	height: calc(100% - 20px);
	width: 100%;
	overflow: auto;
	padding-top: 6px;
	padding-bottom: 6px;
}

.whc-table-row {
	height: 40px;
	padding-top: 7px;
	font-size: 14px;
	box-sizing: border-box;
	width: 100%;
	color: #333;
	cursor: pointer;
	background: white;
	padding-left: 8px;
}

.whc-table-row:hover {
	background: #eee !important;
}

.whc-table-row.whc-table-row-selected {
	background: #17375E !important;
	color: white !important;
}

.whc-table-row:nth-child(odd) {
	background: #fff;
}

.whc-table-row:nth-child(even) {
	background: #fafafa;
}

.whc-table-cell {
	position: relative;
	display: inline-block;
	width: 80px;
	font-size: 13px;
	vertical-align: middle;
	min-height: 18px;
	padding-left: 3px;
	box-sizing: border-box;
	font-family: Open Sans;
	margin-left: 2px;
	margin-right: 2px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.whc-tooltip {
	visibility: hidden;
    background-color: rgba(0,0,0,0.8);
    color: #fff;
    border-radius: 6px;
    padding: 15px 20px;
    position: fixed;
    z-index: 9999;
    box-sizing: border-box;
    left: 15px;
    top: 15px;
    font-size: 14px;
    width: max-content;
    max-width: 500px;
}


.form-signin {
    max-width: 330px;
    padding: 15px;
    margin: 0 auto;
}

.form-signin .form-signin-heading,
.form-signin .checkbox {
    margin-bottom: 10px;
}

.form-signin .checkbox {
    font-weight: normal;
}

.form-signin .form-control {
    position: relative;
    height: auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px;
    font-size: 16px;
}

.form-signin .form-control:focus {
    z-index: 2;
}

.form-signin input {
    margin-top: 10px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.form-signin button {
    margin-top: 10px;
}

.has-error {
    color: red;
}

.whc-input-container-outer {
	margin-right: 15px;
	display: inline-block;
	vertical-align: top;
}

.whc-input-container-inner {
	padding: 0;
	margin: 0;
	margin-bottom: 0;
	width: 100%;
	font-size: 14px;
}


.input-label {
	color: #555;
	font-size: 12px;
	margin-bottom: 0px;
	text-align: left;
}

.input-label-lg {
	color: #555;
	font-size: 12px;
	margin-bottom: 0px;
	text-align: left;
}


.md-input-no-errors-space .md-errors-spacer {
	display: none;
}

.inline {
	display: inline-block;
}

.inline-middle {
	display: inline-block;
	vertical-align: middle;
}

.moment-picker-input {
    min-width: 130px;
    margin-top: 5px;
    font-family: Open Sans;
    letter-spacing: 0.5px;
    font-size: 16px;
	width: max-content;
}

.moment-picker-input:hover::before {
    font-size: 16px;
	content: ' ✎';
}

.event-type-0 {
    background: rgb(176, 70, 50);
    color: white;
}

.event-type-1 {
    background: rgb(210, 144, 52);
    color: white;
}

.event-type-2 {
    background: rgb(81, 152, 57);
    color: white;
}

.event-type-3 {
    background: rgb(182, 21, 204);
    color: white;
}
            
.event-type-4 {
    background: rgb(0, 121, 191);
    color: white;
}
            
.event-type-5 {
    background: rgb(71, 88, 152);
    color: white;
}
            
.event-type-6 {
    background: rgb(71, 152, 134);
    color: white;
}
        


@keyframes ghost {
    0% {
        opacity: 1;
    }

    1% {
        opacity: 1;
    }

    100% {
        opacity: 0.3;
    }
}

@keyframes unghost {
    0% {
        opacity: 0.3;
    }

    1% {
        opacity: 0.3;
    }

    100% {
        opacity: 1;
    }
}
            
.whc-card:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 30px 0 rgba(0, 0, 0, 0.1), 0 6px 40px 0 rgba(0, 0, 0, 0.09);
    transition: box-shadow 0.08s ease-in-out, transform 0.08s ease-in-out;
}

.klasa-testowa {
	background: red !important;
}

.whc-card-selected {
	/* height:200px !important; */
}
            
.whc-card-unselected {
    transform: scale(0.95) !important;
    opacity: 0.2 !important;
    transition: transform 0.08s ease-in-out, opacity 0.08s ease-in-out !important;
}

.whc-card {
    /* transition: box-shadow 0.15s ease-in-out, transform 0.15s ease-in-out, opacity 0.15s ease-in-out; */
    
    opacity: 1;
    position: relative;
    z-index: 5;
    font-family: Open Sans;
    font-size: 14px;
    line-height: 15px;
    border-radius: 50px 50px 50px 50px;
    margin: 10px 10px;
    display: inline-block;
    cursor: pointer;
	height: 50px;
    color: white;
    
    padding-left: 5px;
    padding-right: 25px;
    
    /* animation: unghost 0.5s ease-out; */
}

.whc-slot {
    /* transition: box-shadow 0.15s ease-in-out, transform 0.15s ease-in-out, opacity 0.15s ease-in-out; */
    
    opacity: 1;
    z-index: 5;
    font-family: Open Sans;
    font-size: 14px;
    line-height: 15px;
    border-radius: 50px 50px 50px 50px;
    margin: 10px 10px;
    display: inline-block;
    cursor: pointer;
    height: 50px;
    padding-left: 25px;
	padding-right: 25px;
	
	text-align: center;
    
    /* animation: unghost 0.5s ease-out; */
}

.whc-slot:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 30px 0 rgba(0, 0, 0, 0.1), 0 6px 40px 0 rgba(0, 0, 0, 0.09);
    transition: box-shadow 0.08s ease-in-out, transform 0.08s ease-in-out;
}

.slot-over-limit {
    background: rgb(216, 67, 21) !important;
}
.slot-within-limit {
    background: #2B496C !important;
}



.whc-card-icon-container {
    vertical-align: top;
    display: inline-block;
    height: 50px;
    width: 45px;
    margin: 0;
    padding: 0;
}

.whc-card-icon {
    margin-top: 8px;
    margin-left: 10px;
    height: 33px;
    width: 33px;
}

.whc-card-icon.light-parent svg[fill] {
	fill: rgba(0, 0, 0, 0.6);
}
.whc-card-icon.light-parent path:not([fill="none"]) {
	fill: rgba(0, 0, 0, 0.6);
}
.whc-card-icon.dark-parent svg[fill] {
	fill: white;
}
.whc-card-icon.dark-parent path:not([fill="none"]) {
	fill: white;
}












.whc-card-content {
    vertical-align: top;
    display: inline-block;
    margin: 0;
    padding: 0;
    height: 50px;
}

.whc-slot-content {
    vertical-align: middle;
    display: inline-block;
    margin: 0;
    padding: 0;
    height: 50px;
}

.whc-card-name {
    box-sizing: border-box;
    padding-top: 9px;
    font-size: 14px;
    height: 25px;
    max-width: 200px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
          
.whc-slot-name {
    box-sizing: border-box;
    padding-top: 16px;
    font-size: 14px;
    height: 50px;
    max-width: 200px;
    text-transform: uppercase;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
       
          
.whc-slot-first-line {
    box-sizing: border-box;
    padding-top: 10px;
    font-size: 14px;
    height: 26px;
    max-width: 200px;
    text-transform: uppercase;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}       

.whc-slot-second-line {
    box-sizing: border-box;
    padding-top: 0px;
    font-size: 10px;
    height: 14px;
    max-width: 200px;
    text-transform: uppercase;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
            
.whc-card-subtitle {
    box-sizing: border-box;
    padding-top: 1px;
    font-size: 14px;
    height: 25px;
}

.whc-date-day-name-container {
    font-size: 0;
    display: inline-block;
    vertical-align: middle;
    margin-left: 35px;
}

.whc__admin-timeline__appt-move-dialog__date-container {
    overflow-x: visible;
    text-align: left;
    padding: 20px 0;
    padding-left: 0px;
    box-sizing: border-box;
	border-top: 0;
    border-bottom: 0;
}

.whc-date-day-name-prefix {
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    background: #17375E;
    color: white;
    padding: 5px 20px;
    font-family: sans-serif;
    font-weight: 900;
    padding-bottom: 7px;
}

.whc-date-no-slots .whc-date-day-name-prefix {
    background: rgba(105, 114, 167, 0.4);
}

.whc-date-day-name {
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    background: #17375ee8;
    color: white;
    padding: 5px 20px;
    border-radius: 50px;
    font-family: sans-serif;
    font-weight: 900;
    padding-bottom: 7px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.whc-date-no-slots .whc-date-day-name {
    background: rgba(119, 132, 203, 0.4);
}
        
.schedule-day {
    width: 300px;
    height: 70px;
    display: inline-block;
    position: relative;
}



.title {
	font-family: Open Sans;
	font-weight: 300;
	color: #333;
	font-size: 24px;
	line-height: 25px;
	text-transform: uppercase;
	text-align: center;
	padding: 0 10vw;
	margin-bottom: 5px;
}

.title-strong {
	font-weight: 400;
	font-size: 22px;
}

strong {
	font-weight: 800;
}

.status-success {
	font-family: Open Sans;
	font-weight: 800;
	color: #070;
	font-size: 22px;
	line-height: 24px;
	text-transform: uppercase;
	text-align: center;
	padding: 0 10vw;
	margin-bottom: 5px;
}

.vsep-10 {
	height: 10px;
}

.vsep-20 {
	height: 20px;
}

.vsep-10vw {
	height: 10vw;
}

.btn-fixed-right-bottom {
	width: 100px;
	height: 50px;
	background: #17375E;
	color: white;
	position: fixed;
	bottom: 30px;
	right: 30px;
	text-align: center;
	padding-top: 15px;
}

.caption-sm {
	font-size: 10px;
	text-align: center;
}

.row-button {
	width: 100%;
	height: 50px;
	box-sizing: border-box;
	font-size: 14px;
	color: black;
	text-align: left;
	padding-top: 6px;
}

.row-button-lg {
	width: 100%;
	height: 75px;
	box-sizing: border-box;
	font-size: 14px;
	color: black;
	text-align: left;
	padding-top: 6px;
}

.table-header {
	width: 100%;
	height: 20px;
	box-sizing: border-box;
	font-size: 14px;
	color: black;
	text-align: left;
	padding-top: 6px;
}

.row-button:nth-child(even), .row-button-lg:nth-child(even) {
	background: rgb(250,250,250);
}

.row-button:nth-child(odd), .row-button-lg:nth-child(odd) {
	background: rgb(240, 240, 240);
}
	
.row-button.partial:nth-child(even), .row-button-lg.partial:nth-child(even) {
	background: rgb(230, 230, 230);
}

.row-button.partial:nth-child(odd), .row-button-lg.partial:nth-child(odd) {
	background: rgb(220, 220, 220);
}
	
.row-button.current, .row-button.partial.current, .row-button-lg.current, .row-button-lg.partial.current {
	background: #17375E;
	color: white;
}

.item-name {
	width: calc(100% - 20px);
	text-align: left;
	margin-left: 10px;
	margin-right: 10px;
}

.item-field {
	text-align: left;
	margin-left: 10px;
}

.item-quantity {
	float: right;
	margin-right: 10px;
}
	
.header-column-name {
	width: calc(85% - 90px);
	text-align: left;
	margin-left: 10px;
	font-size: 9px;
}

.header-column-field {
	width: calc(15%);
	text-align: left;
	margin-left: 10px;
	font-size: 9px;
}

.header-column-quantity {
	float: right;
	margin-right: 10px;
	font-size: 9px;
}

.vmiddle {
	vertical-align: middle;
}

.vtop {
	vertical-align: top;
}

.subview {
	max-width: 600px;
	margin: 10vw auto 0 auto;
	font-family: Open Sans;
	font-weight: 400;
	color: #333;
	font-size: 20px;
	text-align: center;
	overflow: hidden;
	background: #fafafa;
}

.note {
	margin-top: 10vw;
	border: 1px solid #3c4caa;
	border-radius: 10px;
	margin-left: 10%;
	width: 80%;
	font-size: 20px;
	line-height: 23px;
	overflow: hidden;
}

.note-header {
	background: #17375E;
	color: white;
	height: 32px;
	width: 100%;
	text-align: center;
	font-size: 16px;
	padding-top: 5px;
}

.note-buttons {
	font-size: 0;
}

.note-buttons div {
	font-size: 20px;
	text-align: center;
	padding-top: 20px;
	width: 50%;
	height: 64px;
	display: inline-block;
}

.success-container {
	background: rgb(208, 225, 208);;
	color: black;
	margin-top: 10vw;
	margin-bottom: 0px;
	border: 1px solid rgb(0, 102, 0);
	border-radius: 10px;
	width: 80%;
	margin-left: 10%;
	min-height: 100px;
	padding: 5vw 5vw;
	box-sizing: border-box;
	display: flex;
    flex-direction: column;
    justify-content: center;
    resize: vertical;
}

.success-message {
	color: rgb(0, 102, 0);
	font-size: 24px;
	line-height: 25px;
	text-align: center;
}

.error-container {
	background: #ffebe8;
	color: black;
	margin-top: 10vw;
	margin-bottom: 0px;
	border: 1px solid #dd3c10;
	border-radius: 10px;
	width: 80%;
	margin-left: 10%;
	min-height: 100px;
	padding: 5vw 5vw;
	box-sizing: border-box;
	display: flex;
    flex-direction: column;
    justify-content: center;
    resize: vertical;
}

.error-message {
	font-size: 24px;
	line-height: 25px;
	text-align: center;
}

.subheader {
	width: 100%;
	height: 32px;
	padding-left: 23px;
	background: hsla(231, 48%, 45%, 1);
	color: white;
	text-align: left;
	font-size: 12px;
	padding-top: 8px;
}

.fullscreen {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: white;
	z-index: 6;
}

.progress-wrapper {
	width: 80%; 
	height: 10px; 
	margin-left: 10%; 
	margin-top: 15px;
}

.progress {
	border-radius: 10px;
	width: 100%;
	height: 100%;
	background: #17375E;
	margin: none;	
}




/* MENU */
		
.menu-wrapper {
	height: 100%;
	position: relative;
}
		
.menu {
	box-sizing: border-box;
	padding: 10vw 0;
}
	
@media only screen and (max-width: 768px) {

	.menu {
		width: 100%;
		/* height: 100%; */
	}
	
}
	
@media only screen and (min-width: 768px) {

	.menu {
		left: 50%;
		width: max-content;
		position: absolute;
		top: 50%;
		transform: translateY(-50%) translateX(-50%);
		border-radius: 7px;
		padding: 0;
	}

	.full-wrapper-lg {
		height: calc(100vh - 76px);
		width: 100%;
		margin: 0;
		max-width: 100%;
	}
			
}

.menu a > div, .button {
	width: 80%;
	margin-left: 10%;
	height: 50px;
	background-color: #17375E;
	color: white;
	font-size: 13px;
	text-align: center;
	margin-bottom: 15px;
	/* border-radius: 7px; */
	font-family: Open Sans;
	font-weight: 800;
	padding-top: 15px;
}

.menu a > div:hover, .button:hover {
	background-color: rgb(45,57,128)
}

.menu-btn-red {
	background-color: rgb(176, 70, 50) !important;
}

.menu-btn-red:hover {
	background-color: rgb(125,50,35) !important;
}

.menu-title {
	font-family: Open Sans;
	font-size: 30px;
	text-align: center;
	font-weight: 800;
	color: #17375E;
	margin-bottom: 30px;
}

.ghost-hover {
	opacity: 0.3;
	background-color: #17375E !important;
}

.ghost-hover:hover {
	opacity: 1;
	background-color: #17375E !important;
}

/* END MENU */



/* SIZES */

.w95 {
	width: 95% !important;
}
.w100 {
	width: 100% !important;
}

/* END SIZES */



/* CENTERING */

.relative {
	position: relative;
}

.vmiddle-by-absolute, .vmiddle-a {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.vmiddle-by-vertical-align, .vmiddle-va {
    vertical-align: middle;
}

.hcenter-by-text-align, .hcenter-ta {
    text-align: center;
}

.hcenter-by-margins, .hcenter-m {
    margin-left: auto;
    margin-right: auto;
}

.hcenter-by-absolute, .hcenter-a {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.middle-by-absolute, .hvmiddle-by-absolute, .vhmiddle-by-absolute,
.middle-a, .hvmiddle-a, .vhmiddle-a, .hvmiddle, .vhmiddle, .middle {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

/* END CENTERING */


.desc {
    width: 90%;
    max-width: 300px;
    text-align: center;
    margin: 30px auto 0 auto;
    font-size: 15px;
    font-family: Open Sans, sans-serif;
    font-weight: 300;
    color: #17375E;
}

@media (min-width: 768px) {
    .font-size-responsive {
        font-size: 29px;
    }
}

@media (max-width: 768px) {
    .font-size-responsive {
        font-size: calc(20px + 1vw);
    }
}

.link {
    width: 80px;
    margin: 0 auto 0 auto;
    color: #17375E;
    text-transform: uppercase;
    text-align: center;
    font-size: 12px;
    box-sizing: border-box;
    cursor: pointer;
    font-family: Roboto, "Helvetica Neue", sans-serif;
    font-weight: 400;
    line-height: normal;
    height: 32px;
    padding-top: 10px;
    vertical-align: middle;

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */

    -webkit-tap-highlight-color:  rgba(255, 255, 255, 0);
}


.bc-md-select md-select {
	border: 1px solid rgba(0, 0, 0, 0.3);
	margin-top: 3px;
	border-radius: 4px;
	outline: none !important;
	max-height: 30px !important;
	background: white;
}



.bc-md-select md-select-value {
	border: none !important;
	outline: none !important;
}

.bc-md-select {
	margin-bottom: 25px;
}

.bc-md-select md-select-value span {
    text-align: left;
    padding-left: 6px;
}

.bc-md-select--lg .md-select-value .md-select-icon:after {
	font-size: 20px;
}
.bc-md-select--lg .md-select-value .md-select-icon {
	margin-right: 8px;
} 

.md-select-no-border-bottom md-select-value{
	border-bottom: 1px solid #FFF0 !important;
	text-transform: none;
	padding-bottom: 0 !important;
}

.md-select-menu-container {
	/* margin-top: 50px; */
}

.md-select-no-border-bottom md-select-value:not(.md-select-placeholder) {
	color: #17375E !important;
}

.md-select-no-border-bottom .md-select-placeholder {
	color: #17375Eaa !important;
}



.md-select-value {
	padding-bottom: 0px !important;
	border-bottom-width: 2px !important;
}
.md-select-value .tooltip-icon {
	display: none !important;
}



.md-option-lg {
	font-size: 20px;
}




.fixed-btn {
    position: fixed;
    right: 50px;
    bottom: 70px;
    z-index: 8;
    font-size: 16px !important;
    width: auto !important;
    padding-left: 30px !important; 
    padding-right: 30px !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
}

.fixed-btn-go-back {
    position: fixed;
    left: 355px;
    bottom: 70px;
    z-index: 8;
    font-size: 16px !important;
    width: auto !important;
    padding-left: 30px !important; 
    padding-right: 30px !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
    transition: left .5s ease-out;   
}
.menu--closed .fixed-btn-go-back {
    left: 50px;
    transition: left .5s ease-out;    
}




@media (max-width: 768px) {
    .fixed-btn {
        right: 20px;
        bottom: 50px;
        font-size: 14px !important;
        width: auto !important; 
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
    .fixed-btn-go-back, .menu--closed .fixed-btn-go-back {
        left: 20px;
        bottom: 50px;
        font-size: 14px !important;
        width: auto !important; 
        padding-left: 20px !important;
        padding-right: 20px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
}




.md-raised:not(.md-primary):not([disabled]) {
	box-shadow: none;
}
.md-raised:not(.md-primary):not([disabled]):active {
	box-shadow: none;
}
.md-raised:not(.md-primary):not([disabled]):hover {
	transition: all 0.3s;
    background-color: rgb(235, 235, 235) !important;
}
.md-raised.sm-hover-eff:hover {
	transition: all 0.3s;
	box-shadow: 0px 0px 16px 6px rgb(0 0 0 / 10%);
}





.md-raised:not(.md-primary):not([disabled]).fixed-btn-go-back {
    background-color: white !important;
	box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .16);
}
.md-raised:not(.md-primary):not([disabled]).fixed-btn-go-back:hover {
	box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .26);
}


.md-raised.md-primary {
	border-radius: 50px !important;
	background-color: rgb(34, 65, 102) !important;
	padding: 0 20px;
}
.md-raised.md-primary:hover:not([disabled]) {
    background-color: rgb(31, 59, 92) !important;
	box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .46);
}
.md-raised.md-primary[disabled] {
    background-color: rgba(34, 65, 102, 0.1) !important;
}

.md-button.md-default-theme.md-primary.md-fab:not([disabled]).md-focused, .md-button.md-primary.md-fab:not([disabled]).md-focused, .md-button.md-default-theme.md-primary.md-fab:not([disabled]):hover, .md-button.md-primary.md-fab:not([disabled]):hover, .md-button.md-default-theme.md-primary.md-raised:not([disabled]).md-focused, .md-button.md-primary.md-raised:not([disabled]).md-focused, .md-button.md-default-theme.md-primary.md-raised:not([disabled]):hover, .md-button.md-primary.md-raised:not([disabled]):hover {
    background-color: rgb(43, 73, 108);
}


/* Confirm buttons in mdDialogs - make bigger padding and smaller min-width */
.md-primary.md-confirm-button.md-button.md-default-theme {
	padding: 0 13px !important;
    min-width: 75px !important;
}
/* Cancel buttons in mdDialogs - make bigger padding and smaller min-width */
.md-primary.md-cancel-button.md-button.md-default-theme {
	padding: 0 13px !important;
    min-width: 75px !important;
	border-radius: 200px;
}





.md-fab:hover {
	transition: all 0.15s !important;
	box-shadow: 0px 0px 14px 5px rgb(0 0 0 / 10%);
	filter: contrast(130%);
}
.md-fab {
	transition: all .2s cubic-bezier(.55,0,.55,.2) !important;
}

.entity-button {
	font-size: 13px;
	float: right;
	background: #224166;
	color: white;
	border-radius: 5px;
	width: 130px;
	text-align: center;
	padding: 8px; 
}

.entity-button:hover {
	transition: all 0.2s;
	background: #224166cc;
}

.rounded-full {
	border-radius: 100px !important;
}

.w100 {
	width: 106px !important;
}

.fontsize11 {
	font-size: 11px !important;
}

.entity-button-bordered {
	font-size: 13px;
	float: right;
	border: 1px solid #22416666;
	color: #224166;
	background: rgba(0, 0, 0, 0);
	border-radius: 5px;
	width: 130px;
	text-align: center;
	padding: 8px; 
}

.entity-button-bordered:hover {
	transition: all 0.2s;
	background: #224166;
	color: white;
}

.red-hover:hover { 
	background: #ff0000 !important;
	border: 1px solid #ff0000 !important;
}

.entity-footer-info {
	font-size: 13px;
	float: right;
	text-align: center;
	padding: 4px 10px; 
	padding-top: 12px;
	font-style: italic;
}

.entity {
	height: 150px;
	padding: 0;
	margin: 20px;
	box-shadow: 0px -6px 18px 2px rgb(0 0 0 / 15%);
	border-radius: 8px;
	overflow: visible;
	box-sizing: border-box;
	transition: box-shadow 0.4s, transform 0.4s;
	background: white;
}

.entity:hover:not(.not-hover) {
	transition: box-shadow 0.25s, transform 0.25s;
	box-shadow: 0px -6px 36px 18px rgb(0 0 0 / 12%);
	transform: scale(1.08);
}

@media (max-width: 1200px) {
	.entity:hover:not(.not-hover) {
		transition: none;
		box-shadow: 0px -6px 18px 2px rgb(0 0 0 / 15%);
		transform: none;
	}
}

.entity__head {
	width: 100%;
	height: 55px;
	background: #17375ef2;
	display: flex !important;
	justify-content: start !important;
	align-items: center !important;
	position: relative;
}
.entity__head__caption {
	color: white;
	font-size: 15px;
	text-align: left;
	font-family: 'Helvetica';
	line-height: 1;
	width: calc(100%);
	padding: 20px;
}
.entity__head__caption.light-parent {
	color: rgba(0, 0, 0, 0.7) !important;
	font-size: 15px;
	text-align: left;
	font-family: 'Helvetica';
	line-height: 1;
	width: calc(100%);
	padding: 20px;
}
.entity__head__icon {
	position: absolute;
    top: 7px;
    right: 7px;
    width: 40px;
    color: white;
    font-size: 32px;
    cursor: pointer;
    text-align: center;
    /* height: 100%; */

	border-radius: 100px;
    height: 40px;
}
.entity__head__icon:hover {
    background: rgba(255,255,255,0.1);
}
.entity__head__icon img {
	width: 16px;
	height: 16px;
	margin-top: -10px;
}
.entity__body {
	padding: 10px 20px;
	padding-bottom: 20px;
	font-size: 15px;
	text-align: left;
}



.field {
    margin-bottom: 6px;
}
.field--far {
    margin-bottom: 8px;
}
.field-icon {
    vertical-align: middle;
    display: inline-block;
}
.field-text {
    vertical-align: middle;
    display: inline-block;
    margin-left: 5px;
    margin-top: 2px;
}
.icon-max-23 svg {
    max-width: 23px;
    max-height: 23px;
}
.icon-max-28 svg {
    max-width: 28px;
    max-height: 28px;
}
.icon-21 svg {
    max-width: 21px;
    max-height: 21px;
    width: 21px;
    height: 21px;
}
.icon-26 svg {
    max-width: 26px;
    max-height: 26px;
    width: 26px;
    height: 26px;
}
.icon-28 svg {
    max-width: 28px;
    max-height: 28px;
    width: 28px;
    height: 28px;
}
.icon-30 svg {
    max-width: 30px;
    max-height: 30px;
    width: 30px;
    height: 30px;
}
.icon-32 svg {
    max-width: 32px;
    max-height: 32px;
    width: 32px;
    height: 32px;
}
.icon-34 svg {
    max-width: 34px;
    max-height: 34px;
    width: 34px;
    height: 34px;
}



i {
	background: rgba(0, 0, 0, 0) !important;
	border-bottom: 4px solid #2241661f !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}


h1 i, h2 i {
	/* background: rgba(0, 0, 0, 0.03) !important;
	border-bottom: none !important;
	padding-left: 6px !important;
	padding-right: 6px !important;
	font-weight: 600;
	font-style: italic !important; */

	position: relative;

	/* background: rgba(0, 0, 0, 0.06) !important; */
    /* border-bottom: none !important; */
    /* padding-left: 9px !important; */
    /* padding-right: 6px !important; */
    /* font-weight: 600; */
    /* font-style: italic !important; */
    /* border: 1px solid #17375e; */
    /* padding: 9px 15px !important;
    border-radius: 100px;
    padding-right: 7px !important;
    margin-left: 5px;
    margin-right: 5px; */
}

h1 i:before, h2 i:before {
	content: " ";
	width: 30px;
	background: #17375e;
	height: 4px;
	border-radius: 30px;
	position: absolute;
	top: 33px;
	left: 12px;

	/* UNCOMMENT IF YOU WANT TO SHOW THIS SPECIAL MARK */
	opacity: 0;
}

.entity__body__uppercased {
	text-transform: uppercase;
}
.entity__footer {
	width: 100%;
	height: 55px;
	display: flex !important;
	justify-content: end !important;
	align-items: center !important;
	position: relative;
	padding-left: 20px;
	padding-right: 20px;
}
.entity__footer__right {
	margin-left: auto;
	width: max-content;
	display: block;
}
.entity__footer__left {
	margin-right: auto;
	width: max-content;
	display: block;
}


.entity-radio {
	width: 26px;
	height: 26px;
	border: 1.5px solid #17375ea2;
	border-radius: 100px;
	display: inline-block;
	vertical-align: middle;
	margin-left: 6px;
}

.entity-radio:hover{
	background: rgba(0, 0, 0, 0.05);
}

.entity-radio__inner {
	width: 12px;
	height: 12px;
	background: #17375eb2;
	border-radius: 100px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 5px;
}

.grid-cell {
	padding: 0 !important;
	float: none !important;
    margin: 0 auto !important;
	display: inline-block;
	max-width: 400px;
	vertical-align: middle;
}


.md-confirm-button {
	background: #9f0000 !important;
	color: white !important;
	border-radius: 100px !important;
}

.md-raised {
	border-radius: 100px !important;
}
.md-raised:not(.md-primary) {
	/* box-shadow: none !important;
	border: 1px solid #17375E !important;
	color: 1px solid #17375E !important; */
}

i {
    background:rgb(0 115 255 / 18%) ;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    font-style: normal;

    background: rgba(0, 0, 0, 0.06);
    color: #17375E;

    /* color: white; */
    /* font-weight: 800; */
    /* cursor: pointer; */
}

.info-icon {
    width: 14px;
    height: 14px;
    min-width: 14px;
    min-height: 14px;
}

.back-icon {
	cursor: pointer;
    margin-bottom: 6px;
    margin-right: 14px;
    max-width: 38px;
    max-height: 38px;
    min-width: 38px;
    min-height: 38px;
    border-radius: 100px;
	border: 1px solid #17375E;
    padding: 9px;
    color: white;
}

.back-icon:hover {
	background: #17375E;
}
.back-icon:hover path {
	fill: #ffffff;
}

.info-icon path {
    fill: rgba(0,0,0,0.4);
}


.view-800-centered {
	text-align: left;
    position: relative;
    width: 800px;
    margin-left: auto;
    padding-left: 20px;
    margin-right: auto;
}

.view-900-centered {
	text-align: left;
    position: relative;
    width: 900px;
    margin-left: auto;
    padding-left: 20px;
    margin-right: auto;
}

md-option span, md-select-value .md-text span {
	padding-left: 0;
}

.badge-primary {
    background-color: #17375e99;
}

md-dialog[aria-label="set-as-default"], md-dialog[aria-label="blue-buttons"], md-dialog[aria-label="set-max-width"] {
    max-width: 500px;
}

md-dialog[aria-label="set-max-width-900"] {
    max-width: 900px;
}

md-dialog[aria-label="set-max-width-1000"] {
    max-width: 1000px;
}

md-dialog[aria-label="set-max-width-1200"] {
    max-width: 1200px;
}

md-dialog[aria-label="set-as-default"] .md-confirm-button, md-dialog[aria-label="blue-buttons"] .md-confirm-button {
    background-color: #17375E !important;
	padding-left: 15px;
    padding-right: 15px;
}

md-dialog[aria-label="with-header"] {
	/* background: linear-gradient(180deg, rgba(39,50,112,1) 0%, rgba(255,255,255,1) 10%); */
}

/* #api-error-dialog-container {
	z-index: 91 !important;
}
#api-error-dialog-container md-backdrop.md-dialog-backdrop {
	z-index: 91;
}
#api-error-dialog-container .md-dialog-container {
	z-index: 92;
} */



.white-icon path, .white-icon polygon {
	color: white !important;
	fill: white !important;
}

.context-menu-icon {
	margin-top: -2px !important;
	max-width: 21px;
	max-height: 21px;
	min-width: 21px;
	min-height: 21px;
	opacity: 0.8;
}

.context-menu-icon svg {
	max-width: 21px;
	max-height: 21px;
	min-width: 21px;
	min-height: 21px;
}

.context-menu-icon-bg {
	margin-top: -2px !important;
	max-width: 26px;
	max-height: 26px;
	min-width: 26px;
	min-height: 26px;
	opacity: 0.8;
}

.context-menu-icon-bg svg {
	max-width: 26px;
	max-height: 26px;
	min-width: 26px;
	min-height: 26px;
}

md-select[disabled] {
	opacity: 0.7;
}

@keyframes append-animate {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.48;	
	}
}
@keyframes append-animate2 {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;	
	}
}
md-backdrop.md-opaque {
	animation: append-animate .4s linear;
}
md-backdrop {
	animation: append-animate2 .4s linear;
}

.md-default-theme .md-datepicker-input-mask-opaque, .md-datepicker-input-mask-opaque {
	background: white !important;
}

.cursor-normal-force {
	cursor: default !important;
}

.bc-md-select-with-search md-content {
	/*  */
}

.md-select-backdrop {
	background-color: rgba(0, 0, 0, 0.3);
}

md-select-menu md-content {
	padding-top: 8px !important;
}

h1, h2, h3, h4, h5, h6 {
	color: #17375e;
}















/*steps-ui*/
.steps-ui {
    overflow: hidden;
    /*CSS counters to number the steps*/
    counter-reset: step;
    width: 100%;
    margin: 0 auto 50px;
    padding-left: 16px;
}
.steps-ui li {
    list-style-type: none;
    color: #17375e;
    text-transform: uppercase;
    font-family: Roboto;
    font-size: 13px;
    width: 33.33%;
    float: left;
    position: relative;
    overflow: visible;
}
.steps-ui li:before {
    content: '';
    counter-increment: step;
    width: 16px;
    height: 16px;
    line-height: 16px;
    display: block;
    font-size: 14px;
    color: #333;
    border: 3px solid rgba(23, 55, 94, 0.8);
    border-radius: 50%;
    margin: 6px auto 5px auto;
    padding-left: 9px;
    padding-top: 3px;
    font-weight: 400;
}
.steps-ui li.current:before {
    width: 28px;
    height: 28px;
    margin: 0 auto 5px auto;
    border: 3px solid rgba(23, 55, 94, 0.6);
}
.steps-ui li.active:before {
    border: none;
}
.steps-ui li:not(.current):before, .steps-ui li:not(.current) div {
    opacity: 0.7;
}
.steps-ui li:not(.current) div {
    font-size: 0;
}
/*steps-ui connectors*/
.steps-ui li:after {
    content: '';
    width: calc(100% - 36px);
    height: 3px;
    background: rgba(23, 55, 94, 0.6) !important;
    position: absolute;
    left: calc(-50% + 18px);
    top: 13px;
    z-index: 0; /*put it behind the numbers*/
    opacity: 0.5;
}
.steps-ui li:first-child:after {
    /*connector not needed before the first step*/
    content: none; 
}
/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
.steps-ui li.active:before,  .steps-ui li.active:after{
    /*background: #17375e22;*/
    color: white;
}
.steps-ui li.current:before,  .steps-ui li.current:after{
    /*background: #17375e55;*/
    color: white;
    box-sizing: border-box;
}
.vtcha{
    max-width: 100%;
}
.vtcha .item-box,.vtcha .target-box{
    width: 170px;
    margin: 10px auto 0;
}

.radio-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #17375ecc;
    position: absolute;
    left: calc(50% - 6px);
    top: 8px;
}

.current .radio-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #17375e99;
    position: absolute;
    left: calc(50% - 8px);
    top: 6px;
}

.steps-ui__label {
    margin-top: 9px;
    text-align: center;
}

@media (max-width: 768px) {
    .steps-ui__label {
        display: none;
    }
}










.test-button {
	position: fixed;
	top: 80px;
	right: 80px;
	z-index: 999999;
	background: red;
	color: white;
}

@media (max-width: 767px) {
	.d-sm-none {
		display: none;
	}
}

.whc-close-button {
	position: absolute;
	top: 11px;
	right: 11px;
	cursor: pointer;
}

.whc-close-button svg {
	fill: #888;
}

.whc-close-button-new {
	position: absolute;
	top: 11px;
    right: 20px;
	cursor: pointer;
	width: 46px;
	height: 46px;
	padding-top: 8px;
	padding-left: 8px;
	border-radius: 100px;
}
.whc-close-button-new:hover {
	background-color: rgba(255, 255, 255, 0.3);
}
.whc-close-button-new svg {
	fill: #EEE;
}

.whc-close-button-new.dark-parent:hover {
	background-color: rgba(255, 255, 255, 0.3);
}
.whc-close-button-new.dark-parent svg {
	fill: #EEE;
}
.whc-close-button-new.light-parent:hover {
	background-color: rgba(0, 0, 0, 0.1);
}
.whc-close-button-new.light-parent svg {
	fill: rgba(0, 0, 0, 0.6);
}




.whc-appt-dialog-dots-btn {
	position: absolute;
	top: 12px;
    right: 70px;
	cursor: pointer;
	width: 46px;
	height: 46px;
	padding-top: 11px;
	padding-left: 13px;
	border-radius: 100px;
}
.whc-appt-dialog-dots-btn:hover {
	background-color: rgba(255, 255, 255, 0.3);
}
.whc-appt-dialog-dots-btn svg, .whc-appt-dialog-dots-btn path {
	fill: #EEE;
}

.whc-appt-dialog-dots-btn.dark-parent:hover {
	background-color: rgba(255, 255, 255, 0.3);
}
.whc-appt-dialog-dots-btn.dark-parent svg, 
.whc-appt-dialog-dots-btn.dark-parent path {
	fill: #EEE;
}
.whc-appt-dialog-dots-btn.light-parent:hover {
	background-color: rgba(0, 0, 0, 0.1);
}
.whc-appt-dialog-dots-btn.light-parent svg, 
.whc-appt-dialog-dots-btn.light-parent path {
	fill: rgba(0, 0, 0, 0.6);
}








.md-button.md-default-theme.md-primary.md-fab, .md-button.md-primary.md-fab, .md-button.md-default-theme.md-primary.md-raised, .md-button.md-primary.md-raised {
    color: rgba(255,255,255,0.87);
    background-color: rgb(43, 73, 108);
}

.info-box {
	vertical-align: top;
    width: 100%;
    margin: 0;
    margin-bottom: 15px;
    margin-top: 8px;
    background-color: #f1f3f1;
    border: 1px solid #376092;
    border-color: #c3e6cb;
    color: #155724;
    padding: 1rem 1.5rem;
}



#email-box-access-btns-container {
	display: none;
	cursor: pointer;
	position: fixed;
	left: 200px;
	bottom: -171px;
	background: linear-gradient(135deg, rgb(23 55 94) 0%, rgb(53, 103, 163) 100%) !important;
    color: white;
	box-shadow: 0px 0px 15px 10px rgba(0, 0, 0, 0.1);
	padding: 30px;
	padding-top: 15px;
	border-top-left-radius: 25px;
    border-top-right-radius: 25px;
	width: 340px !important;
	max-width: 340px !important;
	z-index: 77;
	transition: bottom 0.5s ease-in-out, transform 0.5s ease-in-out;
}


.email-box-access-btns-container-extended {
	bottom: -10px !important;
	transition: bottom 0.5s ease-in-out, transform 0.5s ease-in-out;
}

#expand-icon {
	transition: bottom 0.5s ease-in-out, transform 0.5s ease-in-out;
}
.email-box-access-btns-container-extended #expand-icon {
	transform: rotate(180deg);
	transition: bottom 0.5s ease-in-out, transform 0.5s ease-in-out;
}

@media (max-width: 1200px) {
	#email-box-access-btns-container {
		display: none;
	}
}

.email-box-access-btn {
	background: transparent;
	border-radius: 200px;
	color: white;
	border: 1px solid white !important;
	border: none;
	padding: 10px 15px;
	font: inherit;
	cursor: pointer !important;
	outline: inherit;
	width: 280px !important;
	font-size: 14px;
}

.email-box-access-btn:hover {
	background: #00000034;
}



.warning-msg {
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	max-width: 1200px;
	margin-bottom: 30px;
	margin-top: 8px;
	color: #b94a48;
	background-color: #f2dede;
	border: 1px solid #eed3d7;
	padding: 1rem;
}

.warning-msg--content-width {
    margin-left: 0;
    margin-right: 0;
    width: max-content;
    max-width: 1200px;
    margin-bottom: 0;
    margin-top: 0px;
    color: #b94a48;
    background-color: #f2dede;
    border: 1px solid #eed3d7;
    padding: 1rem 1.7rem;
}


.status-badge {
    padding: 5px 15px;
    border-radius: 100px;
    color: white;
    box-sizing: border-box;
    margin-top: 7px;
    width: max-content;
    display: block;
    margin-left: auto;
    margin-right: auto;
	font-weight: 800;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.status-badge-sm {
    padding: 1px 5px;
    border-radius: 6px;
    box-sizing: border-box;
    margin-top: 7px;
    width: max-content;
    display: block;
    margin-left: auto;
    margin-right: auto;
	font-weight: 900;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	font-size: 11px;
}



.footer {
	width: 100%;
	height: 30px;
	min-height: 30px;
	background: #17375e;
	color: white;
	text-transform: uppercase;
	font-size: 10px;
	padding-top: 8px;
	text-align: center;
	/* -width: 450px; */
	margin-left: auto;
	margin-right: auto;
	/* border-top-left-radius: 20px; */
	/* border-top-right-radius: 20px; */
}

.footer a, .footer a:visited {
	text-decoration: underline !important;
	text-decoration-color: rgba(255, 255, 255, 0.6);
	color: white !important;
}

.footer a:hover, .footer a:visited:hover {
	text-decoration: underline !important;
	text-decoration-color: rgba(255, 255, 255, 1);
}

@media (max-width: 500px) and (min-width: 400px) {
	.footer {
		padding-top: 8px;
		font-size: 9px;
		max-width: 100%;
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
	}
}

@media (max-width: 400px) and (min-width: 350px) {
	.footer {
		padding-top: 9px;
		font-size: 8px;
		max-width: 100%;
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
	}
}

@media (max-width: 350px) {
	.footer {
		padding-top: 10px;
		font-size: 7px;
		max-width: 100%;
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
	}
}




/* ================================================================= */
/* --> Error-message overlay (only for desktop) */
/* ================================================================= */

#only-desktop-error-screen {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999;
	background: white;
}

#only-desktop-error-screen.only-desktop-error-screen--show {
	display: block;
}
/* ================================================================= */



.sep5 {
	width: 100%;
	height: 5px;
}
.sep8 {
	width: 100%;
	height: 8px;
}
.sep10 {
	width: 100%;
	height: 10px;
}


md-switch.md-default-theme.md-checked.md-primary .md-thumb, md-switch.md-checked.md-primary .md-thumb {
	background-color: #2E598C;
}

md-switch.md-default-theme.md-checked.md-primary .md-bar, md-switch.md-checked.md-primary .md-bar {
    background-color: #2E598C77;
}

.lowercase {
	text-transform: lowercase;
}
.uppercase {
	text-transform: uppercase;
}

.add-attachment-btn {
	border-radius: 200px;
	border: 1px solid rgba(0, 0, 0, 0.3);
	text-align: center;
	height: 52px;
	box-sizing: border-box;
	padding-top: 10px;
	margin-left: 16px;
	width: 72%;
	cursor: pointer;
	margin-top: -1px;
}
.add-attachment-btn:hover {
	background: rgba(0, 0, 0, 0.06);
}


.btn-bottom-bar-bordered {
	border-radius: 200px;
	border: 1px solid rgba(0, 0, 0, 0.3);
	text-align: center;
	height: 52px;
	box-sizing: border-box;
	padding-top: 13px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: 8px;
	margin-right: 12px;
	cursor: pointer;
	margin-top: -1px;
	display: inline-block;
	vertical-align: middle; 
	font-size: 17px;
}
.btn-bottom-bar-bordered:hover {
	background: rgba(0, 0, 0, 0.06);
}

.btn-bottom-bar {
	border-radius: 200px;
	text-align: center;
	height: 52px;
	box-sizing: border-box;
	padding-top: 13px;
	padding-left: 20px;
	padding-right: 20px;
	margin-left: 8px;
	margin-right: 12px;
	cursor: pointer;
	margin-top: -1px;
	display: inline-block;
	vertical-align: middle; 
	font-size: 17px;
	background-color: #17375eee;
	color: white;
}
.btn-bottom-bar:hover {
	background-color: #17375e;
}


.preview-appt-dialog__bottom-bar {
	background-color: rgb(244 244 244);
	margin-bottom: -2.5%; 
	padding-top: 20px;
	padding-bottom: 22px; 
	margin-left: -30px; 
	margin-right: -30px; 
	padding-right: 2%;
	padding-left: 2%;
	font-size: 0;
}
.preview-appt-dialog__bottom-bar .data-grid-cell:not(.not-hover):hover {
	border-radius: 20px;
}

.add-appt-dialog__bottom-bar {
	background-color: rgb(244 244 244);
	margin-bottom: -2.5%; 
	padding-top: 20px;
	padding-bottom: 22px; 
	margin-left: -30px; 
	margin-right: -20px; 
	padding-right: 2%;
	font-size: 0;
}
.add-appt-dialog__bottom-bar .data-grid-cell:not(.not-hover):hover {
	border-radius: 20px;
}


.none-objects-info {
	font-family: 'Segoe UI', Sans-Serif; 
	font-size: min(12vw, 60px); 
	font-style: italic; 
	color: #224166; 
	opacity: 0.15; 
	margin-top: 19vh; 
	margin-bottom: 20px;
	text-align: center;

	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.hover-effect-background-gray:hover {
	background: rgba(245, 245, 245, 1);
}

.whc-button-xs {
    width: 100%;
    height: 22px;
    font-size: 10px;
    text-align: center;
    margin-bottom: 5px;
    margin-top: 0px;
    color: white;
    padding-top: 4px;
    font-family: Helvetica;
    opacity: 1;
    background-color: rgba(63, 81, 181, 0.9);
}

.whc-button-xs:hover {
    background-color: rgba(63, 81, 181, 1);
    opacity: 1;
}

.whc-button-xs-empty {
    width: 100%;
    height: 22px;
    font-size: 10px;
    text-align: center;
    margin-bottom: 5px;
    margin-top: 0px;
    color: black;
    padding-top: 5px;
    color: white;
    font-family: Helvetica;
    opacity: 1;
    background-color: rgba(216, 67, 21, 0.9);
}

.whc-button-xs-empty:hover {
    background-color: rgba(216, 67, 21, 1);
    color: white;
}

.whc-button-bordered {
    width: max-content;
    padding: 15px 20px;
    font-size: 10px;
    text-align: center;
    margin-bottom: 5px;
    margin-top: 0px;
    color: white;
    font-family: Helvetica;
    opacity: 1;
    color: #273270;
    border: 1px solid rgba(63, 81, 181, 0.5);
    /* border-radius: 60px; */
    border-top-left-radius: 0px;
    cursor: pointer;
}

.whc-button-bordered:hover {
	background-color:  rgba(63, 81, 181, 1);
	color: rgb(255, 255, 255);
	opacity: 1;
	transition: all 0.5s ease;
}


@media (max-width: 1200px) {
	.view-title-rwd, .appt-move-title {
		font-size: 32px !important;
	}
}

@media (max-width: 768px) {
	.view-title-rwd, .appt-move-title {
		text-align: left !important;
		font-size: 27px !important;
	}
	.view-title-rwd div, .appt-move-title div {
		margin-top: 4px;
	}
}

@media (max-width: 500px) {
	.view-title-rwd, .appt-move-title {
		text-align: left !important;
		font-size: 25px !important;
	}
	.view-title-rwd div, .appt-move-title div {
		margin-top: 4px;
	}
}

.no-clickable {
    cursor: default !important;

	-webkit-touch-callout: text; /* iOS Safari */
    -webkit-user-select: text; /* Safari */
    -khtml-user-select: text; /* Konqueror HTML */
    -moz-user-select: text; /* Firefox */
    -ms-user-select: text; /* Internet Explorer/Edge */
    user-select: text; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}


.order-status {
    padding: 1px 5px;
    border-radius: 6px;
    box-sizing: border-box;
    display: block;
    font-weight: 900;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    font-size: 13px;
    width: max-content;
}

.bc-md-select-max-height md-select-menu md-content, .bc-md-select-max-height md-select-menu {
    max-height: 80vh !important;
}



.corner-btn {
    position: fixed;

	clip-path: polygon(41.7% 30%, 0% 30%, 0% 0%, 41.7% 0%);





    
    right: max(-330px, calc(-10.5vw - 155px)); /* Przesunięcie do wyłonienia się z prawego dolnego rogu */
    bottom: max(-425px, calc(-13vw - 209px)); /* Przesunięcie do wyłonienia się z dolnego rogu */
    width: min(600px, calc(18vw + 300px)); /* Szerokość przycisku */
    height: min(600px, calc(18vw + 300px)); /* Wysokość przycisku (okrąg) */

    background-color: #17375E; /* Kolor przycisku */
    border-radius: 50%; /* Zaokrąglenie na okrąg */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Delikatny cień */
    cursor: pointer;
    transition: background-color 0.3s ease; /* Płynny efekt hover */
    z-index: 1;

	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.corner-btn div {
    width: fit-content;
    margin-left: min(130px, calc(4.0vw + 64px));
    margin-top: min(42px, calc(1.15vw + 20px));
    color: white; /* Kolor znaku "+" */
    font-size: min(134px, calc(3.2vw + 82px)); /* Rozmiar znaku "+" */
    line-height: 1;
	font-family: Arial, sans-serif;
}

.corner-btn:hover {
    background-color: #112B4B; /* Przyciemnienie przycisku o 15% */
}

.pagination__accent {
    background-color: #224166 !important;
    color: white !important;
}

.pagination__page-btn {
    background: rgba(0, 0, 0, 0.07);
    color: black;
    border-radius: 90px;
    width: 44px;
    height: 44px;
    padding-top: 11px;
    display: inline-block;
    margin: 0 8px;
    font-size: 16px;
    color: #224166;
}

.pagination__page-btn:hover, .pagination__page-btn.pagination__arrow:hover {
    background-color: #224166 !important;
    color: white !important;
}

.pagination__page-btn.pagination__arrow {
    background: rgba(0, 0, 0, 0.07);
    font-size: 26px;
    padding-top: 0px;
    color: #224166;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

md-select[disabled] {
    opacity: 1;
    background-color: rgba(0, 0, 30, 0.1);
}

.appt-id {
	display: inline-block;
	vertical-align: middle;
	font-weight: 800;
	font-style: normal;
	background: #224166;
    color: white;
    border-radius: 5px;
    padding: 0px 4px 1px 6px;
    font-size: 15px;
}




.next-button-icon.light-parent svg[fill] {
	fill: rgba(0, 0, 0, 0.6);
}
.next-button-icon.light-parent path:not([fill="none"]) {
	fill: rgba(0, 0, 0, 0.6);
}
.next-button-icon.dark-parent svg[fill] {
	fill: white;
}
.next-button-icon.dark-parent path:not([fill="none"]) {
	fill: white;
}


.empik-caution-box {
    border: 1px solid red;
    color: red;
    background: transparent;
    font-size: 18px;
    padding: 15px;
    width: 90%;
    height: 60px;
    border-radius: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
}

.caution-box {
    border: 1px solid red;
    color: red;
    background: transparent;
    font-size: 18px;
    padding: 15px;
    width: 90%;
	max-width: 1000px;
    height: 60px;
    border-radius: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
}

input::placeholder, textarea::placeholder {
	color: rgb(218, 218, 218);
	font-style: italic;
}

.md-button:not([role="menuitem"]):not(.md-icon-button) {
	border-radius: 200px !important;
}

.databox-required:before {
    content: " ";
    width: 6px;
    height: 6px;
    background: #fa3e3e;
    border-radius: 40px;
    position: absolute;
    left: 4px;
    top: 19px;
    animation: blink-animation 0.7s steps(2, start) infinite;
}

.data-grid-cell:not(.not-hover):hover .databox-required:before {
    left: 5px;
}

.databox-recommended:not(.databox-required):before {
    content: " ";
    width: 6px;
    height: 6px;
    background: rgba(34, 65, 102, 0.3);
    border-radius: 40px;
    position: absolute;
    left: 4px;
    top: 19px;
}

.fixed-buttons-container {
	position: fixed;
	z-index: 20;
	bottom: 50px;
	right: 85px;
}

.fixed-buttons-first {
	padding: 5px 20px !important;
	margin-right: 16px;
}

.fixed-buttons-second {
	padding: 5px 20px !important;
	margin: 0;
}

/* Notification decision dialogs - no animations */
md-dialog[aria-label="no-animation"].md-transition-in,
md-dialog[aria-label="blue-buttons-and-no-animation"].md-transition-in {
	opacity: 1;
	transition: none !important;
	animation: none !important;
}

md-dialog[aria-label="no-animation"].md-transition-out,
md-dialog[aria-label="blue-buttons-and-no-animation"].md-transition-out {
	opacity: 0;
	transition: none !important;
	animation: none !important;
}

/* blue-buttons-and-no-animation inherits blue-buttons styles */
md-dialog[aria-label="blue-buttons-and-no-animation"] {
    max-width: 500px;
}

md-dialog[aria-label="blue-buttons-and-no-animation"] .md-confirm-button {
    background-color: #17375E !important;
	padding-left: 15px;
    padding-right: 15px;
}

md-backdrop {
	transition: none !important;
	animation: none !important;
}