.slds-backdrop {
	background: rgba(0,0,0,.65);
}

.slds-modal__container {
	border-radius: 0;
	max-width: 650px;
	width: 650px;
}

.slds-modal__header {
	background: #0077b5;
	color: #fff;
	display: flex;
	align-items: center;
	border-bottom: none;
	border-radius: 0;
	padding: 14px 12px;
}
.slds-modal__header h2 {
	font-weight: 400;
	font-size: 18px;
	margin: 0;
	margin-left: 25px;
	padding: 0;
}
.slds-modal__header .slds-modal__close {
	position: relative;
	right: -7px;
	top: 0;
}
.slds-modal__header .btn {
	margin: 0;
	margin-left: auto;
	color: #fff;
	padding: 0;
	margin-right: 10px;
}
.slds-modal__header .btn:not(.btn-raised):not(.btn-link):hover {
	background: inherit;
}

.slds-modal__header, .slds-modal__header_still {
	transition: background ease-out .2s;
}

.slds-modal__header_still {
	background: #0077b5;
	color: #fff;
	padding: 10px 16px;
	position: relative;
}
.slds-modal__header_still input {
	background: transparent;
	border: none;
	color: #fff;
	width: 100%;
	padding: 7px 0;
	text-overflow: ellipsis;
}

.slds-modal__content:last-child {
	box-shadow: none;
}

.slds-modal__header_still ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #fff;
	font-weight: 300;
	font-size: 16px;
	font-family: "Roboto", ​sans-serif;
}
.slds-modal__header_still ::-moz-placeholder { /* Firefox 19+ */
	color: #fff;
	font-weight: 300;
	font-size: 16px;
	font-family: "Roboto", ​sans-serif;
}
.slds-modal__header_still :-ms-input-placeholder { /* IE 10+ */
	color: #fff;
	font-weight: 300;
	font-size: 16px;
	font-family: "Roboto", ​sans-serif;
}
.slds-modal__header_still :-moz-placeholder { /* Firefox 18- */
	color: #fff;
	font-weight: 300;
	font-size: 16px;
	font-family: "Roboto", ​sans-serif;
}

.btn-modal-event {
	width: 100%;
}

.btn-modal-event-off-duty, .btn-modal-event-train, .btn-modal-event-sick, .btn-modal-event-phol, .btn-modal-event-oth, .btn-modal-event-techz,
.btn-modal-event-trainz,.btn-modal-event-confz,.btn-modal-event-casualz,.btn-modal-event-hbw {
	font-weight: 400;
	text-transform: none;
	padding-top: 55px;
}
.btn-modal-event-off-duty:hover, .btn-modal-event-train:hover, .btn-modal-event-sick:hover, .btn-modal-event-phol:hover, .btn-modal-event-oth:hover, .btn-modal-event-techz:hover, .btn-modal-event-trainz:hover, .btn-modal-event-confz:hover, .btn-modal-event-casualz:hover, .btn-modal-event-hbw:hover,
.btn-modal-event-off-duty.active, .btn-modal-event-train.active, .btn-modal-event-sick.active, .btn-modal-event-phol.active, .btn-modal-event-oth.active, .btn-modal-event-techz:active,.btn-modal-event-trainz:active, .btn-modal-event-confz:active, .btn-modal-event-casualz:active, .btn-modal-event-hbw:active {
	background: #eaeaea;
}
.btn:not(.btn-raised):not(.btn-link).not-editable:hover {
	background: none;
	cursor: default;
}

.btn-modal-event-off-duty:before, .btn-modal-event-train:before, .btn-modal-event-sick:before, .btn-modal-event-phol:before, .btn-modal-event-oth:before,
.btn-modal-event-techz:before, .btn-modal-event-trainz:before, .btn-modal-event-confz:before, .btn-modal-event-casualz:before, .btn-modal-event-hbw:before {
	font-family: "Material Icons";
	font-size: 34px;
	position: absolute;
	content: '';
	top: 5px;
	left: 50%;
	transform: translateX(-50%);
}
.btn-modal-event-off-duty:before {
	content: "\E430";
	color: #f39c12; /* Off duty color */
}
.btn-modal-event-train:before {
	content: "\E80C";
	color: #9b59b6; /* Training color */
}
.btn-modal-event-sick:before {
	content: "\E53A";
	color: #c0392b; /* Sick color */
}
.btn-modal-event-phol:before {
	content: "\E16B";
	color: #0077B5; /* Phol color */
}
.btn-modal-event-oth:before {
	content: "\E878";
	color: #1abc9c; /* Other color */
}
.btn-modal-event-techz:before{
	background: url('images/techz-34.png') no-repeat center;
	width: 34px;
    height: 48px;
}
.btn-modal-event-trainz:before{
	content: "\E90F";
	color: #9895ee; /* Train'z color */
	transform: translateX(-50%) rotate(200deg);
}
.btn-modal-event-confz:before{
	background: url('images/confz-34.png') no-repeat center;
	width: 34px;
    height: 48px;
}
.btn-modal-event-casualz:before{
	background: url('images/casualz-34.png') no-repeat center;
	width: 34px;
    height: 48px;
}
.btn-modal-event-hbw:before{
	background: url('images/hbw-34.png') no-repeat center;
	width: 34px;
    height: 48px;
}

.slds-modal .input-group-addon {
	color: rgba(0,0,0,.5);
}
.slds-modal .input-group-addon + .togglebutton {
	margin-left: 20px;
	padding-top: 1px;
}
.slds-modal .togglebutton label {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	color: #333;
	margin: 6px 0;
}
.slds-modal .togglebutton label.label-grey {
	color: rgba(0,0,0,.5);
}

.modal-event-off-duty .slds-modal__header,
.modal-event-off-duty .slds-modal__header_still,
.btn.btn-raised.event-off-duty {
	background: #f39c12; /* Off duty color */
}
.btn.btn-raised.event-off-duty:hover, .btn.btn-raised.event-off-duty:focus {
	background: #f7b44a;
}
.modal-event-sick .slds-modal__header,
.modal-event-sick .slds-modal__header_still,
.btn.btn-raised.event-sick {
	background: #c0392b; /* Sick color */
}
.btn.btn-raised.event-sick:hover, .btn.btn-raised.event-sick:focus {
	background: #cc665b;
}
.modal-event-phol .slds-modal__header,
.modal-event-phol .slds-modal__header_still {
	background: #0077B5; /* Phol color */
}
.modal-event-other .slds-modal__header,
.modal-event-other .slds-modal__header_still {
	background: #1abc9c; /* Other color */
}

.modal-event-training .slds-modal__header,
.modal-event-training .slds-modal__header_still {
	background: #9b59b6; /* Training color */
}

.modal-event-casualz .slds-modal__header,
.modal-event-casualz .slds-modal__header_still {
  background: #1ec7be; /* Cazual'z color */
}

.modal-event-techz .slds-modal__header,
.modal-event-techz .slds-modal__header_still {
  background: #9BCD5F; /* Tech'z color */
}

.modal-event-confz .slds-modal__header,
.modal-event-confz .slds-modal__header_still {
  background: #fe8f60; /* Conf'z color */
}

.modal-event-trainz .slds-modal__header,
.modal-event-trainz .slds-modal__header_still {
  background: #9895ee; /* Train'z color */
}

.modal-event-hbw .slds-modal__header,
.modal-event-hbw .slds-modal__header_still {
  background: rgba(192, 170, 22, 0.75); /* Home based working color */
}

.btn.btn-raised.event-off-duty, .btn.btn-raised.event-sick {
	box-shadow: 0 0px 2px 0 rgba(0, 0, 0, 0.14), 0 0px 1px -2px rgba(0, 0, 0, 0.2), 0 -1px 5px 0 rgba(0, 0, 0, 0.12);
	color: #fff;
}

.form-group .form-control.textarea-modal {
	background: none;
	height: 74px;
}
.form-group .form-control.input-modal {
	background: none;
}

/* Notification modal */
.notification-modal strong {
	font-weight: 500;
}
.notification-modal .list-group .list-group-item .row-picture i {
	line-height: 50px;
}
.notification-modal .list-group .list-group-item .row-picture i.event-off {
	background: #f39c12;
}
.notification-modal .list-group .list-group-item .row-picture i.event-pending,
.notification-modal .list-group .list-group-item .row-picture i.event-corrected,
.notification-modal .list-group .list-group-item .row-picture i.event-deleted {
	background: repeating-linear-gradient(45deg, #34495e, #34495e 10px, #2c3e50 10px, #2c3e50 20px);
}
.notification-modal .list-group .list-group-item .list-group-item-text .row div {
	display: block;
}
.notification-modal .list-group .list-group-item-container:last-child .list-group-separator {
	display: block;
}

@media (max-width: 768px) {
	.slds-modal__header h2 {
		display: none;
	}

	.slds-modal__header_still ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
		font-size: 14px;
	}
	.slds-modal__header_still ::-moz-placeholder { /* Firefox 19+ */
		font-size: 14px;
	}
	.slds-modal__header_still :-ms-input-placeholder { /* IE 10+ */
		font-size: 14px;
	}
	.slds-modal__header_still :-moz-placeholder { /* Firefox 18- */
		font-size: 14px;
	}

	.slds-modal__container {
		width: 100%;
		max-width: 100%;
		margin: 0;
		padding: 0;
		justify-content: flex-start;
		background: #fff;
	}

	.slds-modal .input-group-addon .material-icons {
		font-size: 22px;
	}

	.slds-modal__content {
		height: 100%;
	}

	.form-group .form-control.textarea-modal {
		height: 100%;
	}

	/* Notification modal */
	.notification-modal .list-group .list-group-item .row-picture i {
		line-height: 35px;
    	font-size: 16px;
	}
}