body {
	height:100%;
    flex-direction:column;
}

ul.breadcrumbs {
	color: white;
	background-color: #5085a5 !important;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0.3rem 0;
}

.home-bottom {
	width: 90% !important;
}

aside.hidden
{
   display: none
}

.sidebar-header {
	border-bottom: 1px solid #76608a;
	height: 52px !important;
	background-color: #76608a;
}

#tile-bosques-paz {
	background-image: url('./images/tansuchi_300_160.png');
	background-position: center center;
    background-repeat: no-repeat;
    background-size: 300px 160px !important;
    border: 1px solid darkslategray;
}

.title {
	font-size: 1.3rem !important;
	top: 3px !important;
}

.ptc-6 {
	padding-top: 6px !important;
}

.subtitle {
	top: 30px !important;
}

#sidebar-close-href {
	top: 8px;
}

#sidebar-close-span {
	height: 52px;
}

/* This may replaced */
a.primary {
	outline-color: #75b5fd !important;
    background-color: #0366d6 !important;
    color: #ffffff !important;
}

a.primary:hover {
    color: #ffffff !important;
    background-color: #024ea4 !important;
    border-color: #023671 !important;
}

a.alert {
	outline-color: #ecaba7 !important;
    background-color: #ce352c !important;
    color: #ffffff !important;
}

a.alert:hover {
    color: #ffffff !important;
    background-color: #a42a23 !important;
    border-color: #7a1f1a !important;
}

a.success {
	outline-color: #adeb6e !important;
    background-color: #60a917 !important;
    color: #ffffff !important;
}

a.success:hover {
    color: #ffffff !important;
    background-color: #477c11 !important;
    border-color: #2d4f0b !important;
}

.container {
    padding-top: 3.5rem;
}

.bg-wzblue {
	background-color: #0366d6 !important;
}

.bd-wzblue {
	border-color: #0366d6 !important;
}

.bg-mauve {
	background-color: mauve;
}

.bg-lavender {
	background-color: lavender;
}

/* Use special tables for small (mobile) screens */
#clientes
{
	display: none;
}
	
@media only screen and (min-width: 576px)
{
	#clientes
	{
		display: block;
	}
	
	#clients_mobile
	{
		display: none;
	}
}

/* Client CSS classes -- START */
.client-card-wrapper {
	background-color: #60a917;
	color: white;
	width: 100%;
	height: 120px;
}

.client-card-content {
	background-color: inherit;
	float: left;
	width: -webkit-calc(100% - 36px);
    width: -moz-calc(100% - 36px);
    width: calc(100% - 36px);
}

.client-card-more {
	align-items: center;
	background-color: #53973b;
	float: right;	
    padding-top: 4px;
    height: 100%;
}

table.client td:last-child {
  width:100%;
}

th.Toolbar {
	min-width: 9.5rem !important;
}
/* Client CSS classes -- END */

input.capitalize {
	text-transform: capitalize;
}

.wizard-title {	
    background-color: #0366d6 !important;
	color: white;
	float: left;
	font-size: 1.5rem;
	line-height: 1.5rem;
	outline-color: #75b5fd !important;
	padding: 12px 12px;
	width: calc(100% - 3rem);
}

.wizard-title-icon {
	background-color: #0366d6 !important;
	color: white;
	float: right;
	font-size: 1.5rem;
	line-height: 1.5rem;
	padding: 12px 12px;
	text-align: right;
	width:3rem;
}

.wizard-content {
	border-left: 1px solid #0366d6;
	border-right: 1px solid #0366d6;	
	border-bottom: 1px solid #0366d6;
	margin-top: 0px !important;
	max-height: calc(100vh - 174px);
	overflow-y: auto;
}

.wizard-content-select-padding-sm {
	padding-bottom: 65px;
}

.wizard-content-select-padding {
	padding-bottom: 110px;
}

.wizard-actions {
	background-color: white;
	border-left: 1px solid #0366d6;
	border-right: 1px solid #0366d6;
	border-bottom: 1px solid #0366d6;
	margin-top: 0px !important;
	padding: 6px 12px;
}

.wizard-mandatory {
	background-color: #F7E0DF !important;
}

/* Jquery-UI */
.ui-dialog-titlebar {
	background-color: #a8bca0 !important;
	color: white !important;
}

/* DATATABLES */
/* Format dataTables elements to match MetroUI */
.lfsep {
	width: 40px;
}
.next,
.previous {
	background-color: #607d8b !important;
	color: #ffffff !important;
	outline-color: #b7c6cd !important;
}

.next:hover,
.previous {
    background-color: #4b626d;
    border-color: #36474f;
    color: #ffffff;
}

th.sorting_asc,
th.sorting_desc {
	background-color: #f4f4fa;	
}

.dt-row-sm-show,
.dataTables_info,
.dataTable-title-row,
.lfsep {
	display: none;
}

.dataTable-title {
	background-color: #76608a;
	color: white;
	float: left;
	font-size: 1.5rem;
	line-height: 1.5rem;
	padding: 12px 12px;
	width: calc(100% - 3rem);
}

.dataTable-title-icon {
	background-color: #76608a;
	color: white;
	float: right;
	padding: 6px 12px;
	text-align: right;
	width:3rem;
}

.dataTable-content {
	background-color: white;	
	border: none;
	margin-top: 0px !important;
	max-height: calc(100vh - 52px);
	overflow-y: auto;
	padding: 3px 6px;
}

.dataTables_wrapper {
	margin-top: 0px;
}

.dataTable-filter {
	background-color: #76608a40;
	margin-top: 0px !important;
	padding: 3px 6px;
}

@media (min-width: 576px) and (min-height: 768px)
{

	.dt-row-sm-show{
		display: block;
	}
}

@media (min-width: 768px)
{
	.dataTable-content {
		border: 1px solid #76608a;
	}
}

@media (min-width: 768px) and (min-height: 576px)
{
	body
	{
		font-size: 16px;
	}
	
	.dt-row-sm-show,
	.dataTables_info,
	.dataTable-title-row,
	.lfsep {
		display: block;
	}
	
	.dataTable-content {
		border: 1px solid #76608a;
	}
}

/* Special elements and classes */
.small-input-icon {
	padding-top: 3px !important; 
}

.auth {
	background-color: white;
	padding: 0.5em 1em 0.5em 1em;
}

.app-bar {
    background-color: #5085a5;
    color: #f7f9fb;	
}

.app-bar li:hover {
	color: white;
}

.active li:hover {
	background-color: #687864 !important;
	color: white;
}

.dataTables_info {
	font-size: 0.9rem;
}

button.action {
	width: 42px !important;
	height: 42px !important;
}

#one-botton {
	padding-top: 6px;
	width: 160px;
}

.fg-button {
	font-size: 0.8rem !important;
}

.fg-button {
	border-radius: 0px !important;
	background-color: #607d8b !important;
	color: #ffffff !important;
	height: 24px !important;
	min-width: 24px !important;
	outline-color: #b7c6cd !important;
	padding-top: 4px !important;
}

.fg-button:hover {
	border-radius: 0px !important;	
    background-color: #4b626d !important;
    border-color: #36474f !important;
    color: #ffffff !important;
    height: 24px !important;
	min-width: 24px !important;
    padding-top: 4px !important;
}


/*
default < 576px
fs @media screen and (min-width: 0) {...}
sm @media screen and (min-width: 576px) {max-width: 540px;}
md @media screen and (min-width: 768px) {max-width: 720px;}
lg @media screen and (min-width: 992px) {max-width: 960px;}
xl @media screen and (min-width: 1200px) {max-width: 1140px;}
xxl @media screen and (min-width: 1452px) {max-width: 1360px;}
*/

.dt-form,
.dt-form-sm,
.dt-scans-wizard {
	background-color: white;
	margin-top: 0px !important;
	max-width: 960px;
	padding: 6px 12px;
}

.dt-form-xs {
	max-width: 540px;
}

.dt-form-sm {
	max-width: 720px;
}

.dt-clients,
.dt-contracts-lots,
.dt-credits,
.dt-invoices,
.dt-lots,
.dt-receipts,
.dt-trades,
.dt-xxl-table {
 	padding: 6px 12px;
}

.dt-scans,
.dt-invoices,
.dt-landscapings,
.dt-lots,
.dt-trades,
.dt-scans-wizard  {
	max-width: 960px;
}

.dt-clients  {
	max-width: 1140px;
}

.dt-contracts-lots,
.dt-credits,
.dt-edit-scan,
.dt-receipts,
.dt-xxl-table {
	max-width: 1360px;
}

.fg-toolbar {
	padding-bottom: 0px !important;
	width: -webkit-fill-available !important;
	
}

.d-menu li.active>a, .v-menu li.active>a {
    background-color: #5085a5;
    color: white;
}


#home {
	text-align: center;
}

.checkbox_band {
	background-color: #5085a5;
    color: #f7f9fb;
}

.titlebar {
	background-color: #e9e9e9;
	border: 1px solid #dddddd;
	border-radius: 3px;
	margin-bottom: 3px;
	padding: 0.5em 0.5em 0.5em 0.5em;
}

.titlebar-alert {
    background: #ce352c;
    color: #f7f9fb;
}

/* Display large tables within a scrollable frame*/
.scrollable-25 {
	max-height: 25rem;
	overflow-y:scroll;
	padding: 6px;
	width: 100%;
}

.scrollable-300 {
	min-height: 300px;
	max-height: 300px;
	overflow-y:scroll;
	-ms-overflow-style: none;
	overflow: -moz-scrollbars-none;
}

.scrollable-300::-webkit-scrollbar { width: 0 !important }

.no-margin {
	margin-top: 0px;
}

#ruler {
	height:96px;
	top: 300px;
	width:1426px;
	padding:2px;
	visibility:hidden;
	z-index:300;
}