/*
---------------------------------------------------------------
--------------------------- Form ------------------------------
---------------------------------------------------------------
*/

.section-title {
	color: #6772E5;
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 20px;
	padding: 5px 0 14px 0;
	border-bottom: 1px solid #e1e3fa;
}

.form-image {
	width: 100px;
	height: 100px;
	float: left;
	margin-right: 5px;
	border-radius: 3px;
	background-color: #f7f8fb;
	border: 1px solid #e0e2e7;
	margin-bottom: 1rem;
	overflow: hidden;
}

.form-image img {
	width: 99px;
	height: 99px;
}

.form-image-input-file {
	display: none;
}

@media (max-width: 1400px), (max-height: 750px) {
	.section-title {
		font-size: 15px;
	}
}

.input-changed-highlight {
	border-color: #f39c12;
}

.input-signal {
	background-color: #eff3f6;
	border: 1px solid rgba(27,31,35,.2);
	background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
	width: 20px;
    height: 20px;
	font-size: 13px;
    text-align: center;
    border-radius: 50%;
    line-height: 18px;
    margin-bottom: -28px;
    position: relative;
    cursor: pointer;
    margin-left: 4px;
    margin-top: 8px;
}

.btn-micro-group {
	margin-top: -28px;
}

.btn-micro-group .btn {
	height: 20px !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/*
---------------------------------------------------------------
----------------------- Onboarding Steps -------------------------
---------------------------------------------------------------
*/


.onboarding-steps {
	width: 750px;
	height: 95px;
	margin: 100px auto;
	position: relative;
}

.onboarding-steps-line {
	width: 575px;
	height: 5px;
	top: 18px;
	left: 85px;
	position: absolute;
	background-color: #c5c5c5;
	box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1);
}

.onboarding-steps-line-complete {
	width: 185px;
	height: 5px;
	background-color: #24b47e;
}

.onboarding-steps-line-complete.journey-ok {
	width: 360px;
}

.onboarding-steps-line-complete.journey-user-ok {
	width: 550px;
}

.onboarding-step {
	width: 25%;
	float: left;
	font-size: 14px;
	color: #6d7a90;
	position: relative;
}

.onboarding-step.checked {
	color: #24b47e;
}

.onboarding-step.current {
	color: #6772E5;
}

.onboarding-step-number {
	width: 40px;
	height: 40px;
	margin: 0 auto;
	line-height: 40px;
	border-radius: 50%;
	text-align: center;
	background-color: #c5c5c5;
	box-shadow: inset 0px 4px 10px 0px rgba(0, 0, 0, 0.2);
	overflow: hidden;
}

.onboarding-step.current .onboarding-step-number  {
	width: 60px;
	height: 60px;
	font-size: 24px;
	font-weight: bold;
	line-height: 52px;
	margin-top: -10px;
	background-color: #e1e3fa;
	border: 4px solid #6772E555;
	box-shadow: none;
}

.onboarding-step.checked .onboarding-step-number {
	text-indent: 50px;
	background-size: contain;
	background-color: transparent;
	background-image: url(../svg/check.svg);
	background-color: #d6facf;
	border: 2px solid #24b47e;
	box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1);
}

.onboarding-step-label {
	width: 100%;
	margin-top: 10px;
	text-align: center;
}

.onboarding-step-label.two {
	padding: 0 30px;
}

.onboarding-steps-footer {
	padding-top: 1rem;
	border-top: 1px solid #dee2e6;
}



/*
---------------------------------------------------------------
----------------------- Hit Timecard --------------------------
---------------------------------------------------------------
*/

.hit-work-timecard-label {
	font-size: 16px;
	border-bottom: 1px solid #dee2e6;
	padding-bottom: 17px;
}

.hit-work-timecard-check {
	border-radius: 50%;
	border: 1px solid #28a745;
}

.hit-work-timecard-icon-photo,
.hit-work-timecard-icon-location {
	width: 20px;
	height: 20px;
	fill: #28a745;
	margin-right: 2px;
	margin-top: -2px;
}

.hit-work-timecard-icon-location {
	width: 16px;
	height: 16px;
}

.hit-work-timecard-list-item {
	width: 100%;
	height: 36px;
	line-height: 34px;
	text-align: left;
	border: 1px solid #eaeaea;
	background-color: #fff;
	border-radius: 5px;
	margin: 5px 0;
	padding: 0 5px;
	box-shadow: 0 12px 18px 2px rgba(34,0,51,.04);
	color: #7e7e7e;
}

.hit-work-timecard-list-item-icon {
	float: left;
	width: 20px;
	height: 20px;
	margin: 7px;
}

.hit-work-timecard-list-item-icon.green {
	fill: #16a085;
}

.hit-work-timecard-list-item-icon.red {
	fill: #e74c3c;
	transform: rotate(180deg);
}

.hit-work-timecard-list-item-time {
	float: right;
	font-size: 16px;
	font-weight: 500;
	margin-right: 12px;
	color: #464457;
}

.hit-work-timecard-button {
	color: #6772E5;
	border-color: #6772E5;
	background-color: #e1e3fa;
	box-shadow: 0 3px 5px 1px rgba(0,1,1,.1);
}

.hit-work-timecard-button:hover {
	box-shadow: 0 3px 7px 2px rgba(0,1,1,.2);
}

.hit-work-timecard-location-failed {
	width: 100%;
	height: 220px;
	padding-top: 15px;
	text-align: center;
	background-image: url(../img/location-fail.png);
	background-repeat: no-repeat;
	background-position: center;
}

.hit-work-timecard-location-map {
	width: 494px;
	height: 350px;
	overflow: hidden;
	border-radius: 5px;
	margin-bottom: 7px;
	background-color: #fff;
	border: 1px solid rgba(0,0,0,.125);
	box-shadow: 0 3px 5px 0 rgba(0,1,1,.1);
}

.hit-work-timecard-for-drivers .hit-work-timecard-location-map {
	width: 459px;
}

.hit-work-timecard-for-drivers .col-md-4 {
	max-width: 297px !important;
	flex: 0 0 297px !important;
}

.hit-work-timecard-for-drivers .col-md-8 {
	max-width: 489px !important;
	flex: 0 0 489px !important;
}

/*
---------------------------------------------------------------
--------------------- Timecard updates ------------------------
---------------------------------------------------------------
*/

.timecard-updates-title {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 15px;
}

.timecard-updates-wrapper {
	height: 700px;
	height: calc(100vh - 155px);
	overflow-x: auto;
	background-color: #fff;
	border: 1px solid rgba(0,0,0,.125);
}

.timecard-updates-wrapper .cssload-wrapper {
	margin-top: 100px;
}

.timecard-updates-filters {
	background-color: #f5f5f5;
	margin-top: -0.75rem;
	margin-left: -1.25rem;
	margin-right: -1.25rem;
	margin-bottom: 0.75rem;
	border-bottom: 1px solid rgba(0,0,0,.125);
}

.timecard-updates-filter {
	float: left;
	width: calc((100% - 80px) / 3);
	height: 36px;
	cursor: pointer;
	border-left: 1px solid #ddd;
	padding: 0.50rem 1.25rem;
	text-align: center;
}

.size2 .timecard-updates-filter {
	width: calc((100% - 80px) / 4);
}

.timecard-updates-filter.first {
	width: 80px;
	border-left: none;
}

.timecard-updates-filter:hover {
	background-color: #e5e5e5;
}

.timecard-updates-filter.active {
	background-color: #e5e5e5;
	box-shadow: inset 0 0 5px rgba(27,31,35,.15) !important;
}

.timecard-updates-filter-icon {
	width: 24px;
	height: 24px;
	fill: #888;
	margin: -5px auto 0;
}

.timecard-updates-filter:hover .timecard-updates-filter-icon,
.timecard-updates-filter.active .timecard-updates-filter-icon {
	fill: #6772E5;
}

.timecard-updates-header {
	background-color: #f5f5f5;
	margin-top: -0.75rem;
	margin-left: -1.25rem;
	margin-right: -1.25rem;
	margin-bottom: 0.75rem;
	padding: 0.50rem 1.25rem;
	border-bottom: 1px solid rgba(0,0,0,.125);
}

.timecard-updates-header-total {
	float: right;
	padding: 2px 5px;
	margin: -3px -10px 0 0;
	border-radius: 3px;
	border: 1px solid rgba(0,0,0,.125);
	background-color: #fff;
}

.timecard-updates-list li {
	border-left: none;
	border-right: none;
}

.timecard-updates-list li:first-child {
	border-top: none;
}

.timecard-updates-list .default-thumb-size {
	width: 40px;
	height: 40px;
	margin-left: -10px;
}

.timecard-updates-time {
	float: left;
	width: 38px;
	margin-right: 5px;
	border-radius: 2px;
	border: 1px solid #e0e0e0;
	text-align: center;
	line-height: 1.5;
	height: 20px;
}

.timecard-updates-time-download {
	width: 36px;
	height: 16px;
	float: left;
	margin-top: 1px;
}

.timecard-updates-time-loading {
	width: 36px;
	height: 16px;
	float: left;
	opacity: 0.5;
	margin-top: 1px;
	background-size: contain;
	background-image: url(../img/loading.gif);
	background-repeat: no-repeat;
	background-position: center;
}

.timecard-updates-time .timecard-updates-time-loading,
.timecard-updates-time .timecard-updates-time-download,
.timecard-updates-time:hover .timecard-updates-time-label,
.timecard-updates-time.loading .timecard-updates-time-label,
.timecard-updates-time.loading .timecard-updates-time-download,
.timecard-updates-time.loading:hover .timecard-updates-time-download {
	display: none;
}

.timecard-updates-time:hover .timecard-updates-time-download,
.timecard-updates-time.loading .timecard-updates-time-loading {
	display: block;
}

.timecard-updates-ip,
.timecard-updates-photo,
.timecard-updates-device,
.timecard-updates-location {
	fill: #28a745;
	padding: 1px 3px;
	line-height: 1.5;
	height: 20px;
	margin-right: 5px;
	margin-top: -3px;
	text-align: left;
	display: inline-block;
	cursor: pointer;
}

.timecard-updates-ip,
.timecard-updates-device,
.timecard-updates-photo {
	padding: 0 2px;
}

.timecard-updates-ip:hover,
.timecard-updates-photo:hover,
.timecard-updates-device:hover,
.timecard-updates-location:hover {
	border: 1px solid #e0e0e0;
}

@media (max-width: 1400px), (max-height: 750px) {
	.timecard-updates-title {
		font-size: 16px;
		margin-bottom: 12px;
	}

	.timecard-updates-wrapper {
		height: 700px;
		height: calc(100vh - 111px);
	}

	.timecard-updates-header{
		padding: 8px 20px;
		margin-top: -8px;
		margin-left: -20px;
		margin-right: -20px;
		margin-bottom: 8px;
	}

	.timecard-updates-filters {
		margin-top: -8px;
		margin-left: -20px;
		margin-right: -20px;
		margin-bottom: 8px;
	}

	.timecard-updates-filter-icon {
		width: 22px;
		height: 22px;
		margin-top: -2px;
	}

	.list-group-item {
		padding: 8px 20px;
	}
}

/*-----   Status da Equipe     -----*/

.timecard-updates-balance {
	float: right;
	margin-top: 5px;
}

.timecard-updates-small {
	color: #777;
	font-size: 12px;
}


/*-----   Notifications -----*/

.notification-row {
	padding-left: 50px;
}

.notification-row.unread {
	background-color: #f6f5f7;
}

.notification-row-unread-label {
	color: #6772E5;
	padding: 0 5px;
	float: right;
	background-color: #e1e3fa;
	border-radius: 3px;
}

.notification-row-icon {
	width: 28px;
	height: 28px;
	float: left;
	opacity: 0.5;
	margin-left: -38px;
	position: relative;
}

.notification-row-icon.icon-done {
	fill: green;
}

.notification-row-icon.icon-deny {
	fill: red;
}

.notification-row-icon.icon-purple {
	fill: #6772E5;
}

/*
---------------------------------------------------------------
------------------------- Report -----------------------------
---------------------------------------------------------------
*/

.table-report th {
	color: #464457;
	padding: 2px 10px;
	text-align: center;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

.table-report td {
	color: #464457;
	padding: 0 5px;
	text-align: center;
	font-size: 11.5px;
	letter-spacing: 0.4px;
	vertical-align: middle;
}

.table-report .small-column {
	width: 70px;
}

.table-report .medium-column {
	width: 120px;
}

.table-report .table-icon.workday-observation {
    margin-top: -3px;
    margin-bottom: -3px;
	display: none;
}

.table-report tr:hover .table-icon.workday-observation {
	display: block;
}

.table-report.table-bordered thead td,
.table-report.table-bordered thead th {
	border-bottom-width: 1px;
}

.table-report .timecard {
	float: left;
	margin: 2px;
	padding: 1px 2px;
	border-radius: 2px;
	border: 1px solid #dee2e6;
}

.table-report .timecard.wait {
	color: #aaa;
}

.report-filter {
	padding-bottom: 20px;
	border-bottom: 1px solid #eee;
}

.report-user {
	float: left;
	width: 100%;
	padding-top: 20px;
	margin-bottom: 10px;
	border-top: 1px solid #eee;
}

.report-user-thumb {
	width: 50px;
	height: 50px;
	float: left;
	margin-right: 10px;
	border-radius: 50%;
	border: 1px solid #ccc;
}

.report-user.small .report-user-thumb {
	width: 42px;
	height: 42px;
	margin-right: 10px;
}

.report-user-name {
	font-weight: 600;
	font-size: 16px;
}

.report-user.small .report-user-name {
	line-height: 42px;
}

.report-user-info {
	float: left;
	padding: 3px 8px;
	font-size: 12px;
	border: 1px solid #e0e2e7;
	background-color: #fefefe;
	margin-right: 10px;
	border-radius: 3px;
	margin-bottom: 4px;
}

.report-user-info-icon {
	width: 14px;
	height: 14px;
	margin-top: -3px;
	margin-right: 3px;
}

.report-pagination {
	width: 100%;
	float: left;
	text-align: center;
	border-bottom: 1px solid #dee2e6;
	box-shadow: inset -5px -3px 5px 0 #0001010a;
}

.report-pagination.bottom {
	margin-top: 20px;
	border-bottom: none;
	border-top: 1px solid #dee2e6;
	box-shadow: inset -5px 3px 5px 0 #0001010a;
}

.report-pagination.bottom .report-pagination-page {
	margin-top: -1px;
	margin-bottom: 0;
	border-radius: 0;
}

.report-pagination-page-group {
	float: right;
}

.report-pagination-page {
	cursor: pointer;
	width: 30px;
	height: 30px;
	float: left;
	line-height: 28px;
	margin-bottom: -1px;
	border-top: 1px solid #1b1f2333;
	border-right: 1px solid #1b1f2333;
	border-bottom: 1px solid #1b1f2333;
	background-color: #eff3f6;
	background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
}

.report-pagination-page:hover {
	box-shadow: inset 0 .15em .3em #1b1f2326;
}

.report-pagination-page.active {
	background-color: #e9ecef;
	background-image: none;
	box-shadow: inset 0 .15em .3em #1b1f2326;
}

.report-pagination-page:first-child {
	border-left: 1px solid #1b1f2333;
	border-start-start-radius: 2px;
}

.report-pagination-page:last-child {
	border-start-end-radius: 2px;
}

.report-pagination-label {
	float: right;
	line-height: 30px;
	padding-right: 15px;
	font-size: 12px;
	color: #777;
}


/*
---------------------------------------------------------------
---------------------- Report Mirror --------------------------
---------------------------------------------------------------
*/

.table-report-timecards-adjusted {
	font-weight: bolder;
}

.table-report-timecards-success {
	color: #155724 !important;
	background-color: #d4edda;
}

.table-report-timecards-error {
	color: #721c24 !important;
	background-color: #f8d7da;
}

.table-report-pending-workday,
.table-striped tbody tr:nth-of-type(2n+1).table-report-pending-workday {
	background-color: #fff3cd;
}

/*
---------------------------------------------------------------
--------------------- Report Pendencies -----------------------
---------------------------------------------------------------
*/

.report-pendencies-timecard {
	border: 1px solid #ccc;
	padding: 0 2px;
	font-size: 11px;
	border-radius: 2px;
	display: inline-block;
	margin-right: 3px;
}

.report-pendencies-timecard.new {
	border-color: #2ecc71;
}

.report-pendencies-timecard.missing {
	width: 35px;
	opacity: 0.5;
	border-radius: 3px;
	text-align: center;
	color: #e74c3c;
	border-color: #e74c3c;
	margin-right: 0;
}

/*
---------------------------------------------------------------
----------------------- Box Rangking --------------------------
---------------------------------------------------------------
*/

.box-ranking {
	border: 1px solid #ddd;
	border-bottom: none;
	margin: -10px;
	border-radius: 3px;
	margin-top: -6px;
}

.box-ranking-item {
	padding: 5px;
	height: 42px;
	overflow: hidden;
	line-height: 32px;
	border-bottom: 1px solid #ddd;
}

.box-ranking-item img {
	float: left;
}

.box-ranking-item-name {
	width: calc(100% - 42px - 50px);
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	float: left;
}

.box-ranking-item-number {
	width: 50px;
	height: 32px;
	float: left;
	text-align: right;
}

/*
---------------------------------------------------------------
-------------------------- MapBox -----------------------------
---------------------------------------------------------------
*/

#map.no-location {
	width: 100%;
	height: 400px;
	background-size: 100%;
	border: 1px solid #dee2e6;
	background-position: center bottom;
	background-image: url(../img/location-notfound.png);
}

.mapboxgl-map {
	height: 400px;
}

.mapboxgl-canvas-container {
	float: left;
}

.mapboxgl-marker {
	width: 30px;
	height: 30px;
	background-image: url(../svg/pin.svg);
}


/*
---------------------------------------------------------------
----------------------- Request -------------------------
---------------------------------------------------------------
*/

.inline-first-filter {
	border-left: 1px solid #dee2e6;
	margin-left: 20px;
	padding-left: 20px;
}

/*
---------------------------------------------------------------
----------------------- Request Modal -------------------------
---------------------------------------------------------------
*/

.modal-request-box {
	float: left;
	width: 190px;
	margin-right: 15px;
	min-height: 141px;
	padding: 10px 15px;
	margin-top: 10px;
	border-radius: 3px;
	border: 1px solid #ddd;
	background-color: #fff;
}

.small-loading .modal-request-box {
	width: calc(50% - 10px);
}

.modal-request-box hr {
	margin: 10px 0;
}

.modal-request-box.reason {
	width: 355px;
	margin-right: 0;
}

.modal-request-box.dayoff {
	width: 270px;
}

.modal-request-box.dayoff + .reason {
	width: 480px;
}

.modal-request-box.dayoff .modal-request-box-label {
	width: 125px;
}

.modal-request-box-label {
	width: 80px;
	display: inline-block;
}

.modal-request-box-label.wait,
.modal-request-box-label.wait + strong {
	color: #95a5a6;
}

.modal-request-remove-wait {
	z-index: 10;
	float: right;
	display: none;
	position: relative;
	margin: 7px 5px 0 -32px;
}

.modal-request-show-on-hover:hover .modal-request-remove-wait {
	display: block;
}

.modal-request-compensation-total {
	font-size: 22px;
}

.modal-request-compensation-workdays {
	max-height: 226px;
	overflow: auto;
	padding-top: 1px;
	padding-left: 1px;
}

.modal-request-compensation-workday {
	float: left;
	width: 33.3333%;
	height: 46px;
	background-color: #fff;
	border: 1px solid #e0e2e7;
	text-align: center;
	cursor: pointer;
	margin-left: -1px;
	margin-top: -1px;
	padding-top: 2px;
}

.modal-request-compensation-workday-date {
	font-size: 12px;
}

.modal-request-compensation-workday-value {
	font-size: 14px;
	font-weight: 600;
	margin-top: -1px;
	padding-bottom: 3px;
	color: #16a085;
}

.modal-request-compensation-workday.missing .modal-request-compensation-workday-value {
	color: #dc3545;
}

.modal-request-compensation-workday:hover {
	color: #155724;
	border-color: #c3e6cb;
	background-color: #f7f7f7;
	position: relative;
}

.modal-request-compensation-workday.selected,
.modal-request-compensation-workday.selected:hover {
	position: relative;
	color: #155724;
	border-color: #c3e6cb;
	background-color: #edfff1;
}

.modal-request-compensation-workday.missing:hover {
	color: #721c24;
	border-color: #f5c6cb;
	background-color: #f7f7f7;
	position: relative;
}

.modal-request-compensation-workday.missing.selected,
.modal-request-compensation-workday.missing.selected:hover {
	color: #721c24;
	border-color: #f5c6cb;
	background-color: #fff5f6;
}

.modal-request-compensation-workday.disabled:hover {
	cursor: default !important;
	color: inherit !important;
	border-color: #e0e2e7 !important;
	background-color: #fff !important;
}

.modal-request-compensation-workday.replacement:hover {
	color: #6772E5;
	border-color: #6772E5;
	background-color: #fff;
}

.modal-request-compensation-workday.replacement.selected,
.modal-request-compensation-workday.replacement.selected:hover {
	color: #6772E5;
	border-color: #6772E5;
	background-color: #f0f1fd;
}

.modal-request-compensation-seemore {
	width: calc(100% - 4px);
	padding: 5px 0;
	float: left;
	cursor: pointer;
	text-align: center;
	color: #24292e;
	border: 1px solid #e0e2e7;
	background-color: #eff3f6;
	background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
	user-select: none;
	border-top: none;
}

.modal-request-compensation-seemore:hover {
    background-position: -.5em;
    background-color: #e6ebf1 !important;
	border: 1px solid rgba(27,31,35,.2);
    background-image: linear-gradient(-180deg,#f0f3f6,#e6ebf1 90%) !important;
	border-top: none;
}

/*-------- REPLACEMENT REQUEST --------*/

.replacement-icon-row {
	width: 20px;
	height: 20px;
	float: left;
	margin: 0 10px;
	display: block;
}

/*-------- OFFLINE REQUEST --------*/

.offline-request-box {
	padding: 15px;
	float: left;
	float: right;
	margin-bottom: 15px;
	border-radius: 3px;
	border: 1px solid #eee;
	background-color: #f5f5f5;
}

.offline-request-box:nth-child(2n) {
	float: left;
}

.offline-request-box-date {
	text-align: center;
	font-weight: 600;
}

.offline-request-box .modal-request-box {
	width: 165px;
	margin-right: 10px;
}

.offline-request-box .modal-request-box + .modal-request-box {
	margin-right: 0;
}

/*
---------------------------------------------------------
----------------------- Support -------------------------
---------------------------------------------------------
*/

.account-manager-title {
	width: 100%;
	font-size: 16px;
	margin-bottom: 5px;
}

.account-manager {
	float: left;
	min-width: 100px;
	padding: 20px;
	border-radius: 5px;
	margin-bottom: 20px;
	background-color: #fff;
	box-shadow: 0 3px 5px 0 rgba(0,1,1,.1);
}

.account-manager-hint {
	float: left;
	min-width: 100px;
	padding-left: 20px;
}

.account-manager-online {
	float: right;
	color: #27ae60;
	padding: 2px 7px;
	border-radius: 3px;
	margin-left: 10px;
	margin-top: -3px;
	margin-bottom: -5px;
	border: 1px solid #27ae60;
}

.account-manager-online-ball {
	width: 8px;
	height: 8px;
	float: left;
	border-radius: 50%;
	margin-top: 6px;
	margin-right: 5px;
	background-color: #2ecc71;
}

.message-list {
	width: 100%;
}

.message-list-item {
	padding: 10px;
	width: 520px;
	float: left;
	margin-top: 30px;
	position: relative;
	background-color: #fff;
	border: 1px solid #eee;
	border-radius: 8px 8px 8px 0;
}

.message-list-item:first-child {
	margin-top: 20px;
}

.message-list-item.myself {
	float: right;
	color: #fff;
	border-radius: 8px 8px 0 8px;
	background-color: #3498db;
}

.message-list-item i,
.message-list-item strong {
	top: -22px;
	position: absolute;
}

.message-list-item.myself i,
.message-list-item.myself strong {
	color: #3498db;
}

.message-list-item i {
	right: 5px;
	font-size: 10px;
}

.message-list-item p {
	margin: 0;
	white-space: pre-line;
}

.message-list-form {
	width: 100%;
	float: left;
}

.message-list-form textarea {
	resize: none;
	height: 100px;
}

/*
---------------------------------------------------------------
---------------------- Table Price ----------------------------
---------------------------------------------------------------
*/

.pricing-tables {
	width: 100%;
	font-size: 12px;
	border-collapse: collapse;
	table-layout: fixed;
}

.pricing-tables strong {
	color: #6772E5;
	font-size: 16px;
	line-height: 30px;
	white-space: nowrap;
}

.pricing-tables .bg {
	background-color: #e1e3fa;
	border-color: #8c7ae6;
}

.pricing-tables td {
	width: 16%;
	padding: 10px 0;
	border: 1px solid #e0e0e0;
	text-align: center;
	background-color: #fff;
	border-right-color: #8c7ae6;
	border-left-color: #8c7ae6;
}

.pricing-tables tr:last-child td {
	border-bottom: 1px solid #8c7ae6;
}

.pricing-tables td:first-child {
	border-left-color: #e0e0e0;
	border-bottom-color: #e0e0e0 !important;
}

.pricing-tables td.large {
	width: 20%;
}

.pricing-tables .no-border {
	border: none;
	background-color: transparent;
}

.pricing-icon {
	fill: #2ecc71;
	width: 20px;
	height: 20px;
}

.pricing-table-title {
	color: #f5f5f5;
	font-size: 14px;
	padding: 15px 0;
	margin-top: -10px;
	margin-bottom: 10px;
	background-color: #8c7ae6;
	border-right: 1px solid #e1e3fa;
}

.pricing-table-title.active {
	background-color: #4e3cac;
}

.pricing-tables .bg-active {
	background-color: #fcf9ff;
}

.pricing-tables .bg:last-child .pricing-table-title {
	border: none;
}

.pricing-table-feature-td {
	padding: 4px 0 !important;
}


/*
---------------------------------------------------------------
--------------------------- Help ------------------------------
---------------------------------------------------------------
*/

.help-button {
	width: 24px;
	height: 24px;
	cursor: pointer;
	font-size: 12px;
	border-radius: 50%;
	text-align: center;
	line-height: 22px;
    background-color: #eff3f6;
    border: 1px solid rgba(27,31,35,.2);
    background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
	color: #555;
	font-weight: normal;
	display: inline-block;
}

.help-button:hover,
.help-button.active {
	color: #fff;
	background-color: #6772E5;
	background-image: none;
}

.card-header .help-button {
	margin-top: -3px;
	margin-bottom: -3px;
}

.modal-title .help-button {
	float: left;
	margin-left: 5px;
}

.help-modal {
	color: #464457;
}

.help-modal img {
	min-width: 70px;
	min-height: 70px;
	max-width: 100%;
	box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1);
	border: 1px solid #ccc;
	border-radius: 5px;
	margin: 20px 0;
	background-size: 30px 30px;
	background-image: url(../img/loading.gif);
	background-repeat: no-repeat;
	background-position: center;
}

.help-modal .center {
	margin: 20px auto;
	display: block;
}

.help-modal p {
	margin: 5px 0;
	font-size: 13px;
	font-weight: normal;
	line-height: 20px;
}

.help-modal p:last-child {
	margin-bottom: 20px;
}

.help-modal .modal-body {
	padding: 10px 30px;
}

.modal.gray .help-modal .modal-body {
	background-color: #fff;
}

/*
---------------------------------------------------------------
------------------------ Closing User -------------------------
---------------------------------------------------------------
*/

.closing-user-balance {
	line-height: 32px;
	margin-right: -10px;
	display: inline-block;
}

.closing-user-balance-icon {
	width: 20px;
	height: 20px;
	margin-right: 3px;
	margin-left: 5px;
}

.closing-user-balance.text-success .closing-user-balance-icon {
	fill: #28a745;
}

.closing-user-balance.text-danger .closing-user-balance-icon {
	fill: #dc3545;
}


/*
---------------------------------------------------------------
----------------------- Modal Capture -------------------------
---------------------------------------------------------------
*/


.timecard-photo-wrapper {
	top: 0;
	left: 0;
	z-index: 10000;
	width: 100vw;
	height: 100vh;
	position: fixed;
	background-color: rgba(0, 0, 0, 0.3);
}

.timecard-photo-body {
	top: 50%;
	left: 50%;
	width: 640px;
	height: auto;
	position: absolute;
	overflow: hidden;
	margin-left: -320px;
	margin-top: -240px;
	border-radius: 5px;
	background-color: #fff;
	box-shadow: 0px 2px 23px rgba(0,0,0,0.5);
}

.timecard-photo-body.disabled {
	padding: 100px;
	text-align: center;
}

.timecard-photo-capture-status {
	text-align: center;
	padding-top: 50px;
}

.timecard-photo-capture-card video {
	width: 100%;
	height: auto;
}

.timecard-photo-controls {
	padding: 20px;
}

/*-------- MODAL VIEW PHOTO ----------*/

.timecard-photo-view {
	max-width: 100%;
	max-height: 600px;
	height: auto;
	display: block;
	margin: 0 auto;
}

/*
---------------------------------------------------------
----------------------- Payments -------------------------
---------------------------------------------------------
*/

.subcription-active {
	width: 400px;
	fill: green;
	float: left;
	font-size: 14px;
	padding: 20px;
	border-radius: 5px;
	border: 1px solid #ddd;
	box-shadow: 0 3px 5px 0 #0001011a;
}

.subcription-active-icon {
	width: 28px;
	height: 28px;
	margin: 0 auto 10px;
}

.subcribe-card {
	margin-bottom: 20px;
}

.subcribe-card-description {
	font-size: 14px;
	margin-bottom: 20px;
}

.subcribe-card-recurrencies {
	width: 100%;
	float: left;
}

.subcribe-card-recurrency {
	cursor: pointer;
	width: 130px;
	height: 130px;
	float: left;
	border-radius: 3px;
	text-align: center;
	margin-right: 10px;
	border: 1px solid #eee;
	background-color: #fafafa;
	box-shadow: 0 3px 5px 0 rgba(0,1,1,.1);
}

.subcribe-card-recurrency.active {
	color: #28a745;
	border: 1px solid #28a745;
	background-color: #fff;
	box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.21);
}

.subcribe-card-recurrency-checkbox {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	margin: 10px auto;
	border: 10px solid #eee;
}

.subcribe-card-recurrency-checkbox.checked {
	border-radius: 0;
	border: none;
}

.subcribe-card-recurrency-check  {
	fill: green;
	width: 30px;
	height: 30px;
}

.subcribe-card-recurrency-name {
	font-weight: bold;
}

.subcribe-card-recurrency-price-big {
	font-size: 16px;
}

.subcribe-card-payment-method {
	width: 450px;
	float: left;
	margin-top: 30px;
}

.subcribe-card-payment-method-card,
.subcribe-card-payment-method-boleto {
	border: 1px solid #eee;
	float: left;
	padding: 10px;
	cursor: pointer;
}

.subcribe-card-payment-method-card.active,
.subcribe-card-payment-method-boleto.active {
	border: 1px solid #ccc;
	background-color: #eee;
}

.subscription-form.new-subscription-form {
	margin-top: -1rem;
	margin-bottom: -1rem;
}

.subscription-form-bg {
	background-color: #f7f8fb;
	padding-top: 1rem;
}

.subscription-form .form-control {
	height: 34px;
	padding: 5px 13px;
}

.subscription-form .form-group {
	margin-bottom: 10px;
}

.subscription-form-price {
	font-size: 20px;
}

.subscription-form-price-big {
	font-size: 30px;
}

.subscription-pagseguro {
	width: 139px;
	height: 35px;
	margin-top: 10px;
	background-image: url(../img/pagseguro-logo.gif);
}

.subscription-cielo {
	width: 82px;
	height: 28px;
	margin-top: 13px;
	float: left;
	background-size: contain;
	background-repeat: no-repeat;
	background-image: url(../img/cielo-logo.png);
}

.subscription-secure {
	width: 80px;
	height: 40px;
	margin-top: 10px;
	background-size: contain;
	background-repeat: no-repeat;
	background-image: url(../img/selo_seguro.png);
	float: left;
	margin-right: 10px;
}

.table-row-faded {
	opacity: 0.5;
}

.subscription-shadow {
	box-shadow: 0 0 6px 1px #0000000A;
}

.subscription-btn-group {
	font-size: 12px;
	height: 34px;
	padding: 5px 8px;
}

.subscription-shake-button {
	animation: shake 3s infinite;
	animation-delay: 1s;
}

@keyframes shake {
	0% { transform: rotate(0deg)}
	5% { transform: rotate(-5deg)}
	10% { transform: rotate(5deg)}
	15% { transform: rotate(0deg)}
	100% { transform: rotate(0deg)}
}

/*
---------------------------------------------------------
-------------------- Modal Workshift --------------------
---------------------------------------------------------
*/

.nightly-checkbox {
	width: 20px;
	height: 20px;
	float: left;
	cursor: pointer;
	margin-right: 5px;
	margin-top: 36px;
}

.nightly-label {
	cursor: pointer;
	margin-top: 36px;
}

.alternation-checkbox {
	float: left;
	cursor: pointer;
	margin-top: 2px;
	margin-right: 5px;
}

.alternation-label {
	cursor: pointer;
	font-weight: normal;
	margin-bottom: 0;
}

.alert-message-icon {
	fill: #0c5460;
	float: left;
	width: 30px;
	height: 30px;
	margin-left: -10px;
	margin-right: 10px;
	margin-top: 4px;
}

.alert-message-icon.single-line {
	width: 24px;
	height: 24px;
	margin-top: -2px;
}

.alert-message-icon.top-line {
	float: none;
	display: block;
	margin: 0 auto;
	margin-bottom: 5px;
}

.alert-danger .alert-message-icon {
	fill: #721c24;
}

.alert-warning .alert-message-icon {
	fill: #856404;
}

/*
--------------------------------------------------------------
----------------------- Profile Page -------------------------
--------------------------------------------------------------
*/

.profile-page {
	margin-top: -30px;
	margin-left: -30px;
	margin-right: -30px;
}

.profile-header {
	width: 100%;
	height: 110px;
	float: left;
	position: relative;
	padding: 20px 30px;
	background-color: #fff;
	border-bottom: 1px solid #eee;
}

.profile-header .cssload-wrapper {
	margin-top: -40px;
}

.profile-header-thumb-wrapper {
	width: 70px;
	height: 70px;
	float: left;
	margin-right: 20px;
	border-radius: 50%;
	background-color: #ccc;
	border: 1px solid #ccc;
	overflow: hidden;
	position: relative;
}

.profile-header-thumb {
	width: 69px;
	height: 69px;
	float: left;
	position: absolute;
	top: 0;
	left: 0;
}

.profile-header-thumb-buttons {
	width: 99px;
	height: 99px;
	float: left;
	padding-top: 38px;
	background-color: rgba(0, 0, 0, 0.4);
	position: absolute;
	display: none;
	top: 0;
	left: 0;
}

.profile-header-thumb-buttons .table-icon {
	fill: #fff;
	display: block;
	float: left;
	margin-left: 38px;
}

.profile-header-thumb-buttons .table-icon.fill-red {
    margin-left: 25px;
    margin-right: -33px;
}

.profile-header-thumb-wrapper:hover .profile-header-thumb-buttons {
	display: block;
}

.profile-header-title {
	font-size: 18px;
    font-weight: 600;
}

.profile-header-badge {
	border: 1px solid #e0e0e0;
	padding: 4px 10px;
	font-size: 12px;
	border-radius: 3px;
	margin-right: 10px;
	margin-top: 8px;
	float: left;
}

.profile-header-badge-icon {
	fill: #2c3e50;
	width: 18px;
	height: 18px;
	float: left;
	margin-left: -3px;
	margin-right: 5px;
}

.profile-header-badge-icon.check {
	width: 18px;
	height: 18px;
	float: right;
	margin-left: 5px;
	margin-right: -3px;
}

.profile-tabs {
	width: 100%;
	float: left;
	height: 36px;
	line-height: 35px;
	padding: 0 30px;
	background-color: #fafafc;
	border-bottom: 1px solid #cfcfcf;
	box-shadow: 0 -5px 10px 1px rgba(0, 0, 0, 0.3);
}

.profile-tab {
	float: left;
	cursor: pointer;
	padding: 0 15px;
	border-right: 1px solid #eee;
}

.profile-tab.first {
	margin-left: -1px;
	border-left: 1px solid #eee;
}

.profile-tab.active {
	color: #6772E5;
	margin-top: -1px;
	margin-left: -1px;
	position: relative;
	background-color: #f0f1fd;
	border: 1px solid #6772E5;
}

.profile-tab-icon {
	width: 22px;
	height: 22px;
	float: right;
	margin: 9px -8px 0 5px;
}

.profile-tab-alert-ball {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: inline-block;
	background-color: #6772E5;
}

.profile-body {
	width: 100%;
	float: left;
	padding: 20px 30px 0;
}

.profile-body-title {
	float: left;
	line-height: 30px;
	font-size: 16px;
}

.profile-body-title-icon {
	float: left;
	width: 24px;
	height: 24px;
	margin-top: 3px;
	margin-right: 7px;
}

.profile-body-card {
	float: left;
	width: 100%;
	padding: 20px;
	margin-bottom: 10px;
	border-radius: 5px;
	border: 1px solid #dfdfdf;
	background-color: #fff;
	box-shadow: 0 3px 5px 0 rgba(0,1,1,.2);
	color: #fff;
}

.profile-body-card.white {
	color: #34495e;
	border-color: #d8d8d8;
	box-shadow: 0 3px 5px 0 rgba(0,1,1,.05);
	background: linear-gradient(90deg, #f5f5f5 0%, #fff 100%);
}

.profile-body-card-balance-title {
	float: left;
	font-size: 18px;
	font-weight: 300;
	line-height: 39px;
}

.profile-body-card-balance-value {
	float: right;
	font-size: 24px;
	line-height: 39px;
}

.profile-body-card-balance-value.negative {
	color: #e74c3c;
}

.profile-body-card-balance-value.positive {
	color: #27ae60;
}

.profile-body-card.blue {
	background: #7586ff;
	border: 1px solid #566aff;
	background: linear-gradient(90deg, #6d7eff 0%, #90a0ff 100%);
}

.profile-body-card.red {
	background: #ff84ad;
	border: 1px solid #ff528c;
	background: linear-gradient(90deg, #ff72a2 0%, #ff93b7 100%);
}

.profile-body-card.green {
	background: #59e0ce;
	border: 1px solid #00d2b3;
	background: linear-gradient(90deg, #29dac1 0%, #8ce7db 100%);
}

.profile-body-card-icon {
	width: 32px;
	height: 32px;
	float: left;
	fill: #fff;
	margin-top: 7px;
	margin-right: 13px;
}

.profile-body-card.white .profile-body-card-icon {
	fill: #34495e;
	margin-top: 6px;
}

.profile-body-card-title {
	font-size: 16px;
	font-weight: 600;
}

.profile-body-card-row {
	font-size: 13px;
	font-weight: 300;
}

.profile-body-card-row strong {
	font-size: 14px;
	font-weight: 600;
}

.profile-body-shift {
	padding-top: 10px;
	padding-bottom: 10px;
}

.profile-body-shift .profile-body-card-icon {
	width: 24px;
	height: 24px;
	margin-top: 5px;
	margin-right: 8px;
}

.profile-body-shift .profile-body-card-balance-title {
	font-size: 14px;
	line-height: 30px;
}

.profile-body-shift .profile-body-card-balance-value {
	font-size: 16px;
	line-height: 30px;
}

.profile-body-shift-separator {
	width: 100%;
	height: 1px;
	float: left;
	margin: 10px 0;
	background-color: #e0e0e0;
}

.profile-body-shift-row {
	width: 100%;
	float: left;
	padding: 2px 0;
	line-height: 20px;
}

.profile-body-shift-row-icon {
	width: 20px;
	height: 20px;
	float: left;
	fill: #777;
	margin-right: 7px;
}

.profile-body-shift-row-icon.black {
	fill: #222;
}

.profile-body-shift-weekname {
	width: 40%;
	float: left;
}

.profile-body-shift-hour {
	width: 15%;
	float: left;
	text-align: center;
}

.profile-body .timecard-updates-wrapper {
	height: calc(100vh - 280px - 34px);
}

.profile-body .timecard-updates-wrapper.no-pagination {
	height: calc(100vh - 280px);
}

.profile-page-denied {
	font-size: 18px;
	text-align: center;
}

.profile-page-denied-icon {
	width: 70px;
	height: 70px;
	margin: 50px auto 20px;
	display: block;
	fill: red;
}

@media (max-width: 1400px), (max-height: 750px) {
	.profile-header {
		height: 100px;
	}

	.profile-header-thumb {
		width: 59px;
		height: 59px;
	}

	.profile-header-thumb-wrapper {
		width: 60px;
		height: 60px;
		margin-right: 15px;
	}

	.profile-body-title {
		font-size: 15px;
	}
}

/*
--------------------------------------------------------------
----------------------- Home Checkin -------------------------
--------------------------------------------------------------
*/

.home-checkin-body {
	margin-top: -10px;
}

.home-checkin-body .timecard-updates-wrapper {
	height: calc(100vh - 168px);
}

.home-checkin-body .timecard-updates-wrapper.history {
	height: calc(100vh - 134px);
}

.table-bordered.no-border-corner {
	border-top: 0;
	border-left: 0;
	border-right: 0;
}

.table-bordered.no-border-corner td:first-child,
.table-bordered.no-border-corner th:first-child {
	border-left: 0;
}

.table-bordered.no-border-corner td:last-child,
.table-bordered.no-border-corner th:last-child {
	border-right: 0;
}


/*
--------------------------------------------------------------
-------------------------- Password --------------------------
--------------------------------------------------------------
*/

.password-toggle-show {
	display: block;
	padding: 2px 7px;
	float: right;
	margin-bottom: -32px;
	margin-top: 33px;
	margin-right: 6px;
	border-radius: 3px;
	cursor: pointer;
	position: relative;
	z-index: 1;
	border: 1px solid #dfdfdf;
}

.password-toggle-show:hover {
	background-color: #dfdfdf;
	border-color: #ccc;
}

.input-password-toggle-show {
	padding-right: 55px;
}

/*
--------------------------------------------------------------
-------------------------- 404 --------------------------
--------------------------------------------------------------
*/

.not-found-image {
	display: block;
	margin: 20px auto;
}


/*
---------------------------------------------------------------
------------------------- ICON FLAG ---------------------------
---------------------------------------------------------------
*/

.icon-flag {
	float: left;
	width: 20px;
	height: 20px;
	margin-left: -3px;
	margin-right: 3px;
}

.icon-flag + .icon-flag {
	margin-left: 2px;
}

/*
---------------------------------------------------------------
---------------------------- PIN ------------------------------
---------------------------------------------------------------
*/

.card-body-division {
	float: left;
	margin-top: -20px;
	margin-bottom: -20px;
	padding-top: 20px;
	padding-bottom: 20px;
	border-right: 1px solid #d8d8d8;
}

.card-body-division + .card-body-division {
	border-right: none;
	padding-left: 20px;
	margin-right: -20px;
}

.card-body-division-number {
	font-size: 22px;
	margin-right: 10px;
	float: left;
}

.device-pin {
	padding: 10px 15px;
	border-radius: 5px;
	border: 1px solid #d8d8d8;
	background-color: #eff3f6;
	background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
}

.device-pin + .device-pin {
	margin-top: 5px;
}

.device-pin-info-row {
	margin: 2px 0;
	width: 100%;
	float: left;
}

.device-pin-info-row.bordered {
	width: calc(100% + 16px);
	padding: 3px 8px;
	border-radius: 4px;
	margin-left: -8px;
	margin-right: -8px;
	margin-bottom: 3px;
	background-color: #fff;
	border: 1px solid #d8d8d8;
}

.user-pin-double-line-row .device-pin-info-row {
	margin-left: 42px;
	margin-top: -2px;
	margin-right: 0;
}

.user-pin-double-line-row .user-thumb-and-name img {
	margin-top: 0;
	margin-bottom: -15px;
}

.device-pin-info-row-label {
	font-weight: 500;
}

.device-pin-info-row-url {
	overflow: hidden;
	line-height: 30px;
	white-space: nowrap;
	padding: 0 !important;
	background-color: #d8d8d8;
}

.device-pin-info-row-url-method {
	float: left;
	width: 50px;
	padding: 0 8px;
	font-weight: 500;
	background-color: #f6f8f9;
	border-right: 1px solid #d8d8d8;
}

.device-pin-info-row-url-link {
	float: left;
	padding: 0 4px 0 8px;
	width: calc(100% - 50px);
	text-overflow: ellipsis;
	overflow: hidden;
}

.device-pin-info-row-code {
	float: left;
	width: 100%;
	padding: 4px 8px;
	margin-bottom: 5px;
	border-radius: 4px;
	word-wrap: break-word;
	border: 1px solid #d8d8d8;
	background-color: #f6f8f9;
	box-shadow: 0 0 5px 0 rgba(0,1,1,.1) inset;
}

/*
---------------------------------------------------------------
---------------------- Nav Onboarding -------------------------
---------------------------------------------------------------
*/

.nav-onboarding {
	top: 4px;
	left: 50%;
	margin-left: -151px;
	position: fixed;
	z-index: 1000;
}

.nav-onboarding-steps {
	width: 252px;
	height: 42px;
	padding: 0 5px;
	position: relative;
	border-radius: 5px;
	border: 1px solid #e0e0e0;
	box-shadow: 0 0 5px 0 rgba(0,1,1,.1);
}

.nav-onboarding-steps-line {
	width: 220px;
	height: 5px;
	top: 18px;
	left: 15px;
	position: absolute;
	border-top: 1px solid #c5c5c5;
	border-bottom: 1px solid #c5c5c5;
	background-color: #eff3f6;
	box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1);
}

.nav-onboarding-steps-line-complete {
	width: 37px;
	height: 5px;
	border-radius: 3px;
	background-color: #24b47e;
}

.nav-onboarding-steps-line-complete.step-3 {
	width: 60px;
}

.nav-onboarding-steps-line-complete.step-4 {
	width: 90px;
}

.nav-onboarding-steps-line-complete.step-5 {
	width: 125px;
}

.nav-onboarding-steps-line-complete.step-6 {
	width: 170px;
}

.nav-onboarding-step {
	width: 40px;
	float: left;
	font-size: 14px;
	position: relative;
}

.nav-onboarding-step-icon {
	width: 32px;
	height: 32px;
	display: block;
	color: #6d7a90;
	border-radius: 10px;
	margin: 4px auto 0;
	text-align: center;
	padding: 5px;
	cursor: pointer;
	background-color: #c5c5c5;
	border: 1px solid #c5c5c5;
	background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
}

.nav-onboarding-step-icon.current {
	width: 40px;
	height: 40px;
	margin-top: -1px;
	padding: 8px;
	color: #6772e5;
	border: 2px solid #6772e5;
	box-shadow: 0 0 10px 0px #6772e5;
}

.nav-onboarding-step-icon.checked {
	cursor: default;
	background-size: contain;
	background-color: transparent;
	background-image: url(../svg/check.svg);
	background-color: #d6facf;
	border: 2px solid #24b47e;
}

.nav-onboarding-step-label {
	left: 50%;
	top: 50px;
	display: none;
	padding: 5px 0;
	border-radius: 5px;
	white-space: nowrap;
	position: absolute;
	text-align: center;
	cursor: pointer;
	background-color: #c5c5c5;
	border: 1px solid #c5c5c5;
	background-image: linear-gradient(-180deg,#fafbfc,#eff3f6 90%);
	box-shadow: 0 3px 5px 0 rgba(0,1,1,.1);
}

.nav-onboarding-steps:hover .nav-onboarding-step.current .nav-onboarding-step-label {
	display: none;
}

.nav-onboarding-step:hover .nav-onboarding-step-label,
.nav-onboarding-step.current .nav-onboarding-step-label,
.nav-onboarding-steps:hover .nav-onboarding-step.current:hover .nav-onboarding-step-label {
	display: block
}

.nav-onboarding-step-label.t1 {
	width: 210px;
	margin-left: -105px;
}

.nav-onboarding-step-label.t2 {
	width: 250px;
	margin-left: -125px;
}

.nav-onboarding-step-label.t3 {
	width: 150px;
	margin-left: -75px;
}

.nav-onboarding-step-label.t4 {
	width: 270px;
	margin-left: -135px;
}

.nav-onboarding-step-label.t5 {
	width: 210px;
	margin-left: -105px;
}

.nav-onboarding-step-label.t6 {
	width: 180px;
	margin-left: -90px;
}

@media (max-width: 1400px), (max-height: 750px) {
	.nav-onboarding {
		top: 3px;
		left: 520px;
		margin-left: 0;
	}

	.nav-onboarding-steps {
		border: none;
		box-shadow: none;
	}

	.nav-onboarding-step {
		width: 38px;
	}

	.nav-onboarding-steps-line {
		top: 15px;
		width: 210px;
	}

	.nav-onboarding-step-icon {
		width: 28px;
		height: 28px;
		margin: 2px auto 0;
	}

	.nav-onboarding-step-icon.current {
		width: 36px;
		height: 36px;
		padding: 6px;
	}
}

@media (max-width: 1000px) {
	.nav-onboarding {
		display: none;
	}
}

/*------- APAGAR ---------*/

.nav-onboarding.temp-hide-billing .nav-onboarding-steps {
	width: 212.5px;
}

.nav-onboarding.temp-hide-billing .nav-onboarding-steps-line {
	width: 180px;
}

@media (max-width: 1400px), (max-height: 750px) {
	.nav-onboarding.temp-hide-billing .nav-onboarding-steps-line {
		width: 170px;
	}
}

.nav-onboarding.step-6,
.nav-onboarding.temp-hide-billing .nav-onboarding-step:nth-child(7) {
	display: none !important;
}

/*
---------------------------------------------------------------
---------------------- Modal Onboarding -------------------------
---------------------------------------------------------------
*/

.onboarding-text p {
	font-size: 13px;
	font-weight: normal;
	line-height: 20px;
}

.onboarding-text p:first-of-type {
	margin-top: 0;
}

.onboarding-text p:last-of-type {
	margin-bottom: 0;
}

.onboarding-text-whatsapp-link {
	float: left;
	font-weight: 600;
	padding-left: 23px;
	background-repeat: no-repeat;
	background-image: url(../img/onboarding/whatsapp.png);
	background-size: contain;
}

.alert-default.two-line .onboarding-text-whatsapp-link {
	float: none;
	padding-left: 20px;
}

.onboarding-text .alert-default {
	padding-top: 8px;
	padding-bottom: 8px;
	line-height: 20px;
	margin-top: 15px;
}

.onboarding-text .alert-default.two-line {
	margin-bottom: 0;
}

.onboarding-text .alert-default .alert-message-icon {
	width: 38px;
	margin-top: 14px;
	margin-bottom: 10px;
	border-right: 1px solid #ddd;
	padding-right: 8px;
}

.onboarding-text .alert-default.two-line .alert-message-icon {
	margin-top: 5px;
	margin-bottom: 0;
}

/*-------------- Journey --------------*/

.onboarding-banner-journey {
	float: right;
	margin-top: 30px;
	margin-bottom: 20px;
}

.onboarding-form-journey {
	width: calc(100% - 380px);
	float: left;
	padding: 15px;
	margin-top: 15px;
	margin-right: 20px;
	border-radius: 5px;
	border: 1px solid #eee;
	box-shadow: 0 0 13px 0 #523f690d;
}

.onboarding-form-journey-label {
	width: calc(25% - 28.75px);
	text-align: center;
}

/*-------------- Users --------------*/

.onboarding-banner-users {
	float: left;
	margin-right: 30px;
}

.onboarding-form-users {
	float: left;
	width: 100%;
	padding: 15px;
	border-radius: 5px;
	border: 1px solid #eee;
	box-shadow: 0 0 13px 0 #523f690d;
}

.onboarding-form-user-hint {
	float: right;
	color: #fff;
	height: 20px;
	font-size: 11px;
	padding: 2px 5px;
	background-color: #dc3545;
	margin-bottom: -20px;
	line-height: 16px;
	border-radius: 0 0 0 3px;
}

/*-------------- Config --------------*/

.onboarding-banner-config {
	float: right;
	margin-top: 50px;
	margin-bottom: 10px;
}

.onboarding-form-config {
	float: left;
	width: calc(100% - 400px);
	padding: 15px;
	margin-bottom: 10px;
	border-radius: 5px;
	border: 1px solid #eee;
	box-shadow: 0 0 13px 0 #523f690d;
}

.onboarding-form-config-title:first-of-type {
	margin-top: 0;
}

.onboarding-form-config-title {
	margin: 10px 0 5px;
}

/*-------------- Timecard --------------*/

.onboarding-text-timecard {
	font-size: 16px;
	line-height: 24px;
	text-align: center;
}

.onboarding-subtext-timecard {
	font-size: 14px;
	line-height: 22px;
	text-align: center;
}

.onboarding-text-timecard + .onboarding-subtext-timecard {
	margin-top: 10px;
}

.onboarding-subtext-timecard a {
	color: #6772e5;
	font-weight: bold;
}

.onboarding-banner-timecard {
	margin: 20px auto 0;
	display: block;
}

/*-------------- Billing --------------*/

.onboarding-banner-billing {
	float: right;
	margin-top: -20px;
}

.onboarding-billing-header-icon {
	width: 25px;
	height: 25px;
	float: left;
	border-radius: 50%;
	text-align: center;
	line-height: 23px;
	color: #696980;
	border: 1px solid #696980;
	font-size: 14px;
	margin: -2px 8px -5px -10px;
}

/*
---------------------------------------------------------------
---------------------- Settings Config -------------------------
---------------------------------------------------------------
*/

.card-body-user {
	width: 25%;
	padding: 4px 8px;
	overflow: hidden;
	line-height: 24px;
	float: left;
	margin-right: -1px;
	margin-bottom: -1px;
	border: 1px solid #ddd;
	white-space: nowrap;
	text-overflow: ellipsis;
	background-color: #fff;
	box-shadow: 0 0 13px 0 #523f690d;
	position: relative;
}

.card-body-user.full {
	width: 100%;
}

.card-body-user:hover {
	border-color: #6772E5;
	z-index: 1;
}

.card-body-user-button {
	top: 3.5px;
	right: 1px;
	z-index: 1;
	padding-left: 2px;
	padding-right: 3px;
	position: absolute;
	background-color: #fff;
}

.card-body-user .default-thumb-size {
	width: 24px;
	height: 24px;
	margin-right: 5px;
}

.card-body-user + .btn {
	margin-top: 5px;
	margin-left: 5px;
	margin-bottom: -1px;
}

.card-body-user:nth-child(1) + .btn,
.card-body-user:nth-child(2) + .btn,
.card-body-user:nth-child(3) + .btn {
	margin-top: 2px;
}

.card-body-user:nth-child(4n) + .btn {
	margin-left: 0;
	margin-top: 8px;
}


/*
---------------------------------------------------------------
--------------------------- Report Places ------------------------------
---------------------------------------------------------------
*/

.report-place-group {
	border: 1px solid #e0e2e7;
	box-shadow: 0 1px 5px 0 rgba(0,1,1,.1);
}

.report-place-group + .report-place-group {
	margin-top: 20px;
}

.report-place-header {
	width: 100%;
	padding: 10px 15px 15px 15px;
	background: linear-gradient(0, #fff 0%, #f5f5f5 100%);
}

.report-place-header-name {
	font-weight: 600;
	font-size: 14px;
	width: 100%;
	margin-bottom: 8px;
}

.report-place-header-total {
	color: #6c7b91;
	padding: 0 10px;
	height: 32px;
	line-height: 30px;
	float: left;
	border-radius: 3px;
	margin-right: 10px;
	border: 1px solid #e0e2e7;
	background-color: #fff;
}

.report-place-header-total-number {
	font-size: 14px;
	color: #464457;
	font-weight: 600;
}

.report-place-infos {
	margin: 0 10px 5px 10px;
}

.report-place-info {
	float: left;
	width: calc(20% - 10px);
	margin: 0 5px 10px 5px;
	border: 1px solid #e0e2e7;
	background-color: #fff;
	border-radius: 5px;
	padding: 8px 10px;
	box-shadow: 0 0 3px 0 rgba(0,1,1,.1);
}

@media (max-width: 1400px), (max-height: 750px) {
	.report-place-info {
		width: calc(25% - 10px);
	}
}

.report-place-info-name {
	font-weight: 600;
	width: 100%;
	margin-bottom: 5px;
}

.report-place-info-total {
	width: 100%;
	height: 30px;
	border-radius: 3px;
	padding-left: 8px;
	line-height: 28px;
	border: 1px solid #e0e2e7;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	margin-bottom: 5px;
}

.report-place-info-total + .report-place-info-total {
	width: auto;
	float: left;
	padding-right: 8px;
	margin-right: 5px;
	margin-bottom: 0;
}

/*
---------------------------------------------------------------
------------------- Request Place Group  ----------------------
---------------------------------------------------------------
*/

.modal-request-place-group {
	overflow: hidden;
	padding: 8px 12px;
	border-radius: .25rem;
	border: 1px solid #e0e2e7;
	box-shadow: 0 3px 5px 0 rgba(0,1,1,.1);
	background-color: #fff;
}

.modal-request-place-group + .modal-request-place-group {
	margin-top: 20px;
}

.modal-request-place-group-title {
	background-color: #f7f8fb;
	margin-top: -8px;
	margin-left: -12px;
	width: calc(100% + 24px);
	margin-bottom: 8px;
	border-bottom: 1px solid #e0e2e7;
	box-shadow: 0 0 13px 1px #523f690d;
}

.modal-request-place-group-title-block {
	float: left;
	padding: 8px 12px;
	border-right: 1px solid #e0e2e7;
}

.modal-request-place-changes {
	width: 50%;
	float: left;
	padding-right: 6px;
}

.modal-request-place-changes + .modal-request-place-changes {
	padding-left: 6px;
	padding-right: 0;
}

th.pxb {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.pxb {
	padding-left: 8px !important;
	padding-right: 0 !important;
}

.pxb.text-right {
	padding-left: 0 !important;
	padding-right: 8px !important;
}

.pxb .float-right {
	margin-right: 8px !important;
}