body {
	padding-top: 55px;
}

.btn-lg.btn-animate-vertical span > .icon {
	top: -3px;
}

.btn-lg.btn-animate-vertical:hover span {
	-webkit-transform: translate(0, 172%);
	transform: translate(0, 172%);
}

/*
	Styling taken and modified from toastr
*/
.toast-message {
	-ms-word-wrap: break-word;
	word-wrap: break-word;
	color: #f2f2f2;
}
.toast-message .clickable:hover {
	text-decoration: underline;
}
.toast-theme .user-notify-box {
	top: 0;
	right: 0;
	width: 100%;
	position: fixed;
	z-index: 1700;
	pointer-events: none;
}
.toast-theme .user-notify-box .toast {
	margin: 0 0 6px;
	margin-bottom: 0;
	padding: 15px 20px;
	padding-left: 50px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	border-radius: 0;
	color: #f2f2f2;
	position: relative;
	overflow: hidden;
	pointer-events: auto;
	border: 1px solid rgba(0, 0, 0, .1);
	opacity: .95;
}
.toast {
  background-color: #F5F5F5;
}
.toast.info {
  background-color: #62a8ea;
}
.toast.error {
  background-color: #e9595b;
}
.toast.warning {
  background-color: #f2a654;
}
.toast-theme .user-notify-box * {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.toast-theme .user-notify-box > :hover {
	cursor: pointer;
	filter: alpha(opacity=100);
	opacity: 1;
}
.toast-theme .user-notify-box > .toast.info:not(.toast-just-text):before,
.toast-theme .user-notify-box > .toast.warning:not(.toast-just-text):before,
.toast-theme .user-notify-box > .toast.error:not(.toast-just-text):before {
  position: absolute;
  top: 50%;
  left: 12px;
  font-family: "FontAwesome";
  font-size: 30px;
  font-style: normal;
  font-weight: 300;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
       -o-transform: translate(0, -50%);
          transform: translate(0, -50%);
  text-rendering: auto;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* fa-info-circle */
.toast-theme .user-notify-box > .toast.info:before {
	content: "\f05a";
}
/* fa-exclamation-triangle */
.toast-theme .user-notify-box > .toast.warning:before {
	content: "\f071";
}
/* fa-exclamation-circle */
.toast-theme .user-notify-box > .toast.error:before {
  content: "\f06a";
}

/* End of toast styling */

/* Sweet Alert Custom Styling to change size */
.sweet-alert {
	padding: 5px 15px;
	border-radius: 0px;
}

.sweet-alert .sa-icon {
	width: 60px;
	height: 60px;
	margin: 10px auto;		
}

.sweet-alert h2 {
	margin-top: 11px;
	margin-bottom: 11px;
    font-weight: 400;
    line-height: 1.2;
    color: #37474f;
}

.sweet-alert p {
	text-align: justify;
	color: #111;
	line-height: 1.4;
	font-weight: 100;
}

.sweet-alert .sa-icon.sa-warning .sa-body {
	height: 30px;
}

.sweet-alert .sa-icon.sa-error .sa-line {
	top: 28px;
}

.sweet-alert .sa-icon.sa-error .sa-line.sa-left {
	left: 8px
}

.sweet-alert .sa-icon.sa-error .sa-line.sa-right {
	right: 8px
}


.sweet-alert .sa-icon.sa-info {
	border-color: #62a8ea;
}

.sweet-alert .sa-icon.sa-info::after {
	top: 11px;
	background-color: #62a8ea;
}

.sweet-alert .sa-icon.sa-info::before {
	bottom: 10px;
	background-color: #62a8ea;
}

.sweet-alert .sa-button-container button {
	margin-top: 11px;
	margin-bottom: 11px;
}

.sweet-alert .confirm.btn-info,
.sweet-alert button.confirm {
	background-color: #62a8ea;
	border-color: #62a8ea;
}

.sweet-alert .sa-icon.sa-success .placeholder {
	width: 60px;
	height: 60px;
}

.sweet-alert .sa-icon.sa-success .sa-line.sa-tip {
	top: 34px;
	left: 11px;
	width: 19px;
}

.sweet-alert .sa-icon.sa-success .sa-line.sa-long {
	top: 29px;
	right: 6px;
	width: 35px;
}

.sweet-alert .sa-icon.sa-success::before {
	top: -5px;
	left: -24px;
	border-radius: 90px 0 0 90px;
	-webkit-transform-origin: 45px 45px;
	-ms-transform-origin: 45px 45px;
	-o-transform-origin: 45px 45px;
	transform-origin: 45px 45px;
}

.sweet-alert .sa-icon.sa-success::after {
	top: -8px;
	left: 22px;
	border-radius: 0 90px 90px 0;
	-webkit-transform-origin: 0 45px;
	-ms-transform-origin: 0 45px;
	-o-transform-origin: 0 45px;
	transform-origin: 0 45px;
}

.sweet-alert .cancel,
.sweet-alert .confirm {
	min-width: 100px;
}

.sweet-alert .sa-icon.sa-success::after,
.sweet-alert .sa-icon.sa-success::before {
	width: 49px;
	height: 90px;
}

@-webkit-keyframes animateSuccessTip {
  0% {
    top: 14px;
    left: 1px;
    width: 0;
  }
  54% {
    top: 14px;
    left: 1px;
    width: 0;
  }
  70% {
    top: 28px;
    left: -6px;
    width: 38px;
  }
  84% {
    top: 36px;
    left: 16px;
    width: 13px;
  }
  100% {
    top: 34px;
    left: 13px;
    width: 16px;
  }
}
@-o-keyframes animateSuccessTip {
  0% {
    top: 14px;
    left: 1px;
    width: 0;
  }
  54% {
    top: 14px;
    left: 1px;
    width: 0;
  }
  70% {
    top: 28px;
    left: -6px;
    width: 38px;
  }
  84% {
    top: 36px;
    left: 16px;
    width: 13px;
  }
  100% {
    top: 34px;
    left: 13px;
    width: 16px;
  }
}
@keyframes animateSuccessTip {
  0% {
    top: 14px;
    left: 1px;
    width: 0;
  }
  54% {
    top: 14px;
    left: 1px;
    width: 0;
  }
  70% {
    top: 28px;
    left: -6px;
    width: 38px;
  }
  84% {
    top: 36px;
    left: 16px;
    width: 13px;
  }
  100% {
    top: 34px;
    left: 13px;
    width: 16px;
  }
}
@-webkit-keyframes animateSuccessLong {
  0% {
    top: 40px;
    right: 35px;
    width: 0;
  }
  65% {
    top: 10px;
    right: 34px;
    width: 0;
  }
  84% {
    top: 26px;
    right: 0;
    width: 41px;
  }
  100% {
    top: 28px;
    right: 6px;
    width: 35px;
  }
}
@-o-keyframes animateSuccessLong {
  0% {
    top: 40px;
    right: 35px;
    width: 0;
  }
  65% {
    top: 10px;
    right: 34px;
    width: 0;
  }
  84% {
    top: 26px;
    right: 0;
    width: 41px;
  }
  100% {
    top: 28px;
    right: 6px;
    width: 35px;
  }
}
@keyframes animateSuccessLong {
  0% {
    top: 40px;
    right: 35px;
    width: 0;
  }
  65% {
    top: 10px;
    right: 34px;
    width: 0;
  }
  84% {
    top: 26px;
    right: 0;
    width: 41px;
  }
  100% {
    top: 28px;
    right: 6px;
    width: 35px;
  }
}

@-webkit-keyframes showSweetAlert {
  0% {
    -webkit-transform: scale(.5);
            transform: scale(.5);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@-o-keyframes showSweetAlert {
  0% {
    -webkit-transform: scale(.5);
            transform: scale(.5);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes showSweetAlert {
  0% {
    -webkit-transform: scale(.5);
            transform: scale(.5);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

/* End Sweet Alert */

/*
	Responsive Table Start. Taken from http://codepen.io/geoffyuen/pen/FCBEg
	with some modifications
*/
.rwd-table {
	min-width: 300px;
	overflow: hidden;
}

.rwd-table tr {
	border-bottom: 1px solid #ddd;
	border-color: #76838f;
}

.rwd-table th {
	display: none;
}

.rwd-table td {
	display: block;
}

.rwd-table td:before {
	content: attr(data-th) ": ";
	font-weight: bold;
	font-size: 13px;
	width: 8em;
	display: inline-block;
}


.label-exception {
  display: block;
  width: 100%;
}

div.no-receipt-approval {
  font-size: 12px;  
}

.expense-heading {
  font-weight: bold;
  font-size: 13px;
  color: #62a8ea;
  padding-top: 5px;
  padding-bottom: 3px;
}

.checkbox-no-receipt-approve {
  display: inline-block;
  margin-top: 0;
  margin-bottom: 0;
}

span.danger {
  color: #e9595b;
}

@media (max-width: 480px) {
	.rwd-table.table > tbody > tr > td {
		border-top: none;
	}
	
	.expense-review .expense-split-table.rwd-table tr td {
        display: flex;
    }
}

@media (min-width: 480px) {
	.rwd-table td:before {
		display: none;
	}
	
	.rwd-table th,
	.rwd-table td {
		display: table-cell;
	}
	
	.rwd-table tr {
		border-bottom: none;
	}
	
	.rwd-table td.centre-md {
		text-align: center;
	}
}

/* Responsive Table End */

.page-top-header {
    padding: 10px 15px;
    background-color: #1a1f32;
    text-transform: uppercase;
}

.page-top-header .page-title {
	color: #f2f2f2;
    font-size: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.page-top-header a {
	color: inherit;
	font-size: 20px;
}

.page-top-header .nav .dropdown a {
	padding: 1px;
	margin-top: 2px;
}

.page-top-header .nav a,
.page-top-header .nav a:hover,
.page-top-header .nav a:focus,
.page-top-header .nav .open>a,
.page-top-header .nav .dropdown>a:hover,
.page-top-header .nav .dropdown.open>a:focus {
	background-color: transparent;
}

.page-top-header .logoff-link .icon {
	margin-right: 1px;
}

h1.ems-header {
	color: #0A6CB5;
	font-size: 20px;
	text-transform: uppercase;
}

.nav-bar-menu {
	background-color: #f2f2f2;
	border-top: 1px solid #ddd;
}

.square-borders .btn,
.btn.square-borders {
	border-radius: 0px;
}

.main-menu.nav-bar-menu .menu-element,
.main-menu.nav-bar-menu .menu-element:hover {
	background-color: #f7f7f7;
	border: none;
	text-decoration: none;
	padding-top: 10px;
	padding-bottom: 10px;
	color: #8d8d8d;
}

.nav-bar-new-btn {
	position: absolute;
	z-index: 1500;
	bottom: 80px;
	right: 15px;
	color: #f2f2f2;
	background-color: #0A6cb5;
}

.nav-bar-new-btn.btn-floating.btn-lg {
	width: 55px;
	height: 55px;
	font-size: 20px;
}

.nav-bar-new-btn:hover {
	color: #f2f2f2;
	background-color: #4183c4;
}

.nav-bar-new-btn .icon {
	margin-top: 13px;
}

.nav-bar-container {
    position: absolute;
    z-index: 1500;
    bottom: 80px;
    right: 15px;
}

.nav-bar-container .btn {
    width: 55px;
    height: 55px;
    font-size: 20px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    background-color: #0A6cb5;
    transition: all .4s ease;
}

/*
.nav-bar-container .new-receipt-option {
    font-size: 20px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    background-color: #0A6cb5;
    transition: all .4s ease;
    width: 200px;
    max-width: 0px;
    overflow: hidden;
}

.nav-bar-container.is-open .new-receipt-option {
    max-width: 200px;

 }
 */

.nav-bar-container .btn .icon {
    margin-top: 13px;
    color: #f2f2f2;
}

.nav-bar-container .toggle-btn {
    z-index: 300;
}

.nav-bar-container .new-receipt-btn,
.nav-bar-container .new-purchase-order-btn {
    z-index: 100;
    transform: scale(0);
}

.nav-bar-container.is-open .new-receipt-btn,
.nav-bar-container.is-open .new-purchase-order-btn {
    transform: scale(1);
}

/* Create an overlay so that the user can't click on claims when the menu is open */
.nav-bar-container.is-open::before {
    content: "";
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100vh;
    height: 100vh;
    z-index: 1;
}

.nav-bar-container.is-open .toggle-btn {
    transform: rotate(45deg);
    background-color: #8d8d8d;
 }

.nav-bar-container.is-open .new-receipt-btn {
    bottom: 75px;
}

.nav-bar-container.is-open .new-purchase-order-btn {
    bottom: 150px;
}

.nav-bar-container .btn[data-label]::before {
    content: attr(data-label);
    font-weight: bold;
    font-size: 13px;
    display: inline-block;
    position: absolute;
    top: 10px;
    left: 0px;
    background-color: #0A6cb5;
    color: #f2f2f2;
    border-radius: 5px;
    padding: 0px;
    width: 0px;
    max-width: 0px;
    transform: scale(0);
    transition: all .3s ease;
 }

.nav-bar-container.is-open .btn[data-label]::before {
    left: -170px;
    width: 150px;
    max-width: 150px;
    padding: 8px;
    transform: scale(1);
 }

.main-menu.nav-bar-menu .btn-group.active a.menu-element {
	color: #007aff;
}

.main-menu .btn-group .icon,
.nav-bar-menu .btn-group .icon {
	font-size: 20px;
}

.thumbnail-viewport {
	width: 100%;
	height: 81px;
	text-align: center;
	overflow: hidden;
	position: relative;
	
	background-position: top;
	background-repeat: no-repeat;
	background-size: 100% auto;
}

.list-element .thumbnail-viewport {
	height: 80px;
	max-width: 120px;
	border-radius: 5px;
}

.thumbnail-viewport img {
	height: 100%;
    position: absolute;
    top: -9999px;
    bottom: -9999px;
    left: -9999px;
    right: -9999px;
    margin: auto;
}

.icon-thumbnail {
	text-align: center;
	background-color: #f7f7f7;
	height: 100%;
    font-size: 50px;
    color: #aaa;
}

.list-element .icon-thumbnail {
	font-size: 32px;
}

.icon-thumbnail i {
	margin-top: 5px;
}

.list-element .icon-thumbnail i {
    margin-top: 23px;
}

.full-image-viewport {
	text-align: center;
}

.full-image-viewport img.image {
	max-width: 100%;
}

.loading-image-container {
	display: none;
}

.loading-image-container.visible {
	display: block;
	text-align: center;
	height: 180px;
}

.loading-image-container .loading-image {
	display: inline;
	vertical-align: middle;
}

.vertical-align-helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.list .list-element {
	padding-top: 5px;
	padding-bottom: 5px;
}

.list a.list-element-link {
	color: inherit;
}

.list > .list-element:hover,
.list > .list-element:nth-of-type(odd):hover {
	background-color: #F5F5F5;
}

.list > .list-element:nth-of-type(odd) {
	background-color: #f3f7f9;
}

.list .list-element,
.claim-list .header,
.claim .claim-notes {
	border-bottom: 1px solid #F5F5F5;
}

.claim .note-list .image.initials {
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    line-height: 32px;
    letter-spacing: 1px;
    vertical-align: middle;
    background: #e3f2fc;
    color: #4ba6ef;
    width: 30px;
    height: 30px;
}

.document-expense-list .document-expense .supplier {
	font-size: 16px;
}

.claim-info-box .expense-total,
.claim-list .expense-total,
.document-expense-list .document-expense .amount,
.expense-info-box .amount {
	font-size: 20px;
	font-weight: 500;
	margin-top: -5px;
}

.claim-info-box .expense-total {
	margin-top: -3px;	
}

.expense-info-box .expense-field .name {
	font-weight: bold;
	font-size: 13px;
	flex: 0 0 90px;
}

.expense-info-box .expense-field .value {
    padding-left: 3px;
}

.claim-list .claim-id,
.claim-list .claim-type-desc,
.claim-list .modified,
.document-expense-list .document-expense .description,
.document-expense-list .document-expense .expense-date {
	font-size: 14px;
}

.claim-list .expense-total,
.claim-list .claim-status,
.claim-info-box .expense-total,
.document-expense-list .amount {
	text-align: right;
}


.claim-list .header {
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 5px;
}

.claim-list .claim-status-container {
	line-height: 8px;
}

.claim-list .claim-status {
	font-size: 8px;
}

.document-editor,
.document-expense-editor,
.expense-with-rate {
	margin-top: 10px;
}

.document-editor .thumbnail {
	margin-top: 10px;
}

.photo-btn,
.photo-btn.btn-success,
.photo-btn.btn-danger {
	padding: 0px;
	height: 100%;
}

.photo-btn .add-photo-icon,
.photo-btn .pdf-container {
	font-size: 56px;	
}

.photo-btn .add-photo-icon > sup > i {
	font-size: 24px;	
}

.app-content {
	padding-bottom: 120px;
}

.info-box {
	padding-bottom: 5px;
	background-color: ##f7f7f7;
	margin-top: -5px;
	padding-top: 5px;
}

.info-box .info {
	font-size: 18px;
}

/* Set to same blue as ems style guide placeholder to be consistent with new mobile vue app */
input.form-control,
select.form-control,
.ui-select-container .btn.form-control.ui-select-toggle {
 color: #057fda;
}

.input-group.thin-addon .input-group-addon {
	padding-left: 0px;
	padding-right: 0px;
}

.text-xlg,
.text-xlg > .input-group-addon {
	font-size: 32px;
}

.claim-list .expense-total,
.document-expense-list .document-expense .amount,
.document-expense-editor .foreign-amount {
	color: #62a8ea;
}

.document-expense-list .document-expense .amount.text-danger,
.amount.text-danger {
	color: #f96868;
}

.document-expense-list .document-expense .label-container {
	margin-top: 4px;
}

.col-no-padding {
	padding-left: 0px;
	padding-right: 0px;
}

.col-no-padding-left {
	padding-left: 0px;
}

.col-no-padding-right {
	padding-right: 0px;
}

/* fa-check */
.checkbox-custom input[type=radio]:checked+label::after,
.checkbox-custom input[type=checkbox]:checked+label::after {
	font-family: "FontAwesome";
	content: "\f00c";
}

.modal-body.contains-table {
	padding: 5px;
}

.checkbox-info input[type="checkbox"]:checked + label::before,
.checkbox-info input[type="radio"]:checked + label::before {
  background-color: #62a8ea;
  border-color: #62a8ea;
}

form.show-invalid-inputs input[required].ng-invalid {
    background-image: linear-gradient(#f96868,#f96868),
        linear-gradient(#f96868,#f96868);
}

.ui-select-lg .form-control.ui-select-toggle {
	font-size: 18px;
}

.form-material .ui-select-lg.ng-invalid .form-control.ui-select-toggle {
    background-image: -webkit-gradient(linear,left top,left bottom,from(#F5F5F5),to(#F5F5F5)),-webkit-gradient(linear,left top,left bottom,from(#f96868),to(#f96868));
    background-image: -webkit-linear-gradient(#F5F5F5,#F5F5F5),-webkit-linear-gradient(#f96868,#f96868);
    background-image: -o-linear-gradient(#F5F5F5,#F5F5F5),-o-linear-gradient(#f96868,#f96868);
    background-image: linear-gradient(#F5F5F5,#F5F5F5),linear-gradient(#f96868,#f96868);	
}

.form-material .ui-select-lg.ng-invalid .form-control.ui-select-search {
	background-image: -webkit-gradient(linear,left top,left bottom,from(#f96868),to(#f96868)),-webkit-gradient(linear,left top,left bottom,from(#F5F5F5),to(#F5F5F5));
    background-image: -webkit-linear-gradient(#f96868,#f96868),-webkit-linear-gradient(#F5F5F5,#F5F5F5);
    background-image: -o-linear-gradient(#f96868,#f96868),-o-linear-gradient(#F5F5F5,#F5F5F5);
    background-image: linear-gradient(#f96868,#f96868),linear-gradient(#F5F5F5,#F5F5F5);
}

.form-control.ui-select-toggle .ui-select-placeholder {
	color: #76838f;
}

.form-material input[readonly].form-control.ng-invalid {
    background-image: -webkit-gradient(linear,left top,left bottom,from(#f96868),to(#f96868)),-webkit-gradient(linear,left top,left bottom,from(#F5F5F5),to(#F5F5F5));
    background-image: -webkit-linear-gradient(#f96868,#f96868),-webkit-linear-gradient(#F5F5F5,#F5F5F5);
    background-image: -o-linear-gradient(#f96868,#f96868),-o-linear-gradient(#F5F5F5,#F5F5F5);
    background-image: linear-gradient(#f96868,#f96868),linear-gradient(#F5F5F5,#F5F5F5);
}


input.input-lg,
select.input-lg {
    height: 37px;
}

.document-editor .expense-date,
.document-expense-editor .expense-date {
	height: 45px;
}

.expense-date-thumbnail.row {
	padding-bottom: 8px;
}


/* Status Icons */

.e_reassign,
.e_personal,
.e_dispute,
.e_over,
.e_split,
.e_reimburse {
    font-family: Verdana, Arial, sans-serif;
    font-size:11px;
    font-weight: normal;
    line-height: 100%;
    padding: 3px 3px;
    margin: 2px 5px -2px 0;
    color: #f2f2f2;
    background: #46be8a;
    border: 1px solid #46be8a;
    text-transform: uppercase;
    cursor: default;
    float:left;
    border-radius: 0px;
    min-width: 9px;
    min-height: 9px;
    text-align: center;
}

.e_personal {
	color: #432100;
	background: #f2a654;
	border-color: #f2a654;
}

.e_dispute {
    background: #f96868;
    border-color: #f96868;
}

.e_over {
	background: #A57AFA;
	border-color: #A57AFA;
}

.e_split {
	color: #1c1c1c;
	background: #FFE54F;
	border-color: #FFE54F;
}

.e_reimburse {
    background: #6DA611;
    border-color: #6DA611;
}

/* Select UI Styling Start */

.ui-select-container.ui-select-bootstrap .ui-select-match .ui-select-toggle > a.btn {
	margin-top: 0px;
}

.ui-select-container.ui-select-bootstrap .ui-select-match-text {
	padding-top: 5px;
	padding-left: 2px;
}

.ui-select-container > .ui-select-match > .ui-select-toggle .ui-select-placeholder {
    line-height: 33px;
    color: #98a4a0;
}

/* Select UI Styling End */

.recipient-list {
	padding: 10px 13px;
	overflow-y: scroll;
	overflow-x: hidden;
	max-height: 250px;
}

.recipient-list .guest-name {
	font-weight: bold;
}

.recipient-list .guest-name {
    font-weight: bold;
}

.recipient-list .guest-category-container {
	font-size: 12px;
}

.recipient-list .guest-icon-container {
	display: inline-block;
	font-size: 25px;
	color: #2196f3;
	vertical-align: top;
	margin-right: 10px;
}

.recipient-list .guest-info {
	display: inline-block;
}

.expense-guest-modal .total-container {
	font-weight: bold;
	font-size: 20px;
}

.expense-guest-modal .modal-body {
	padding-top: 0px;
}

.favourite-split-select-modal .group-selection {
    overflow-y: scroll;
    max-height: 300px;
}

.recipient-list .delete-btn {
	display: inline-block;
	vertical-align: middle;
	margin-top: 10px;
}

.delete-btn .icon {
    color: #f96868;
    font-size: 20px;
    cursor: pointer; 
}

#navbar-profile-menu-modal .menu-item-label {
	font-size: 16px;
	margin-left: 5px;
}

#navbar-profile-menu-modal .modal-body {
	padding: 0px 15px;
}

#navbar-profile-menu-modal .menu-item {
	padding: 10px 5px;
}

#navbar-profile-menu-modal .logoff-link .icon {
    margin-right: 10px;
    color: #76838f;
    font-size: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

#navbar-profile-menu-modal .logoff-link .menu-item-label {
    margin-left: 5px;
    color: #76838f;
}

#navbar-profile-menu-modal .modal-title {
    font-size: 22px;
}

.navbar-profile-menu .logoff-link.logoff-btn .icon {
    color: #f2f2f2;
}

span.avatar-initials,
.avatar-initials {
	border-radius: 50%;
	display: inline-block;
	font-size: 16px;
	width: 35px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	vertical-align: middle;
	background-color: #7599B3;
	color: #f2f2f2;
	text-transform: uppercase;
}

.avatar-initials.info {
    background-color: #7599B3;
}

.avatar-initials.info2 {
    background-color: #9FA8DA;
}

.avatar-initials.primary {
    background-color: #2196f3;
}

.avatar-initials.success {
    background-color: #46be8a;
}

.avatar-initials.warning {
    background-color: #f89406;
}

.avatar-initials.danger {
    background-color: #df524e;
}

/*
.expense-guest-form .guest-add-btn-group {
	padding: 5px 0px;
}
*/

.expense-guest-form .guest-add-btn-group .btn-group + .btn-group {
	border-left: 3px solid #f2f2f2;
}

.expense-review .checkbox-no-receipt-approve.checkbox-custom input[type=checkbox] + label::before {
    border-color: #f96868;
}

.expense-review .expense-split-table tr td .column-value {
    display: inline-block;
}

.expense-with-rate .google-map-attributions {
	font-size: 11px;
}

.expense-with-rate .google-map-attributions > * {
	margin-bottom: 0px;
	text-align: right;
}

.expense-with-rate .places .add-place-btn.btn {
	width: 45px;
}

.expense-with-rate .google-static-map-container img {
	width: 100%;
}

.expense-with-rate .place .place-field {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: -o-flex;
	display: flex;
}

.expense-with-rate .place .place-marker {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: -o-flex;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	position: relative;
}

.expense-with-rate .place .place-marker.origin {
	font-size: 16px;
}

.expense-with-rate .place .place-marker.destination {
	font-size: 22px;
}

.expense-with-rate .place .place-value {
	flex: 1 1 0px;
}

.expense-with-rate .place .place-marker.origin::after,
.expense-with-rate .place .place-marker.waypoint::before,
.expense-with-rate .place .place-marker.waypoint::after,
.expense-with-rate .place .place-marker.destination::before {
	content: "";
	position: absolute;
	left: calc(50% - 1px);
	width: 2px;
	height: 100%;
	background-color: #76838f;
}

.expense-with-rate .place .place-marker.waypoint::before,
.expense-with-rate .place .place-marker.destination::before {
    bottom: 24px;
}

.expense-with-rate .place .place-marker.origin::after,
.expense-with-rate .place .place-marker.waypoint::after {
	top: 24px;
}

.alert .header {
    font-weight: bold;
}

.flex-display {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: -o-flex;
    display: flex;
}

.flex-item {
    flex: 1 1 0px;
}

.ui-select-container.multi-value-field .ui-select-toggle {
    height: 63px;
}

.ui-select-container.multi-value-field .multi-value {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: -o-flex;
    display: flex;
    flex-direction: column;
}

.ui-select-container.multi-value-field .multi-value .multi-value-element {
    overflow: hidden;
}

.ui-select-container.multi-value-field .multi-value .multi-value-element:nth-child(2) {
    font-size: 14px;
}

/* iOS Native styling - START */

.native-app.os-ios#ng-app {
    padding-top: 25px;
}

.native-app.os-ios .page-top-header {
    padding-top: 35px;
}

.native-app.os-ios .nav-bar-menu.navbar-fixed-bottom .menu-bar-btn {
    padding-bottom: 25px; 
}

.native-app.os-ios .page-top-header {
    padding-top: 35px;
}

.native-app.os-ios .nav-bar-menu.navbar-fixed-bottom .menu-bar-btn {
    padding-bottom: 25px; 
}

.native-app.os-ios .modal-dialog {
    margin-top: 35px;
}

.native-app.os-ios .toast-theme .user-notify-box .toast {
    padding-top: 40px;
}

.native-app.os-ios .modal-dialog,
.native-app.os-ios + .modal .modal-dialog {
    margin-top: 60px;
}

/* iOS Native styling - END */