.logo {margin: 40px auto; width: 400px; margin-bottom: 10px; text-align: center;}
.logo img {margin: 0 auto; width: 140px; height: 60px; display: block; margin-bottom: 10px; }
.logo p { font-size: 14pt; font-weight: bold; }

.card-login { background-color: #8F0000; color: #fff; padding: 4px 0px; }
.card-login .title { display: inline-block; border-top: 2px dashed #BB3C0B; border-bottom: 2px dashed #BB3C0B; width: 100%; padding: 6px 10px;}
.card-body { background-color: #F5EEEE; }

.footer-content { border-top: 2px solid #ddd; background-color: #fff;  }
.footer-content .col-footer-right { text-align: right;  }


.alert.alert-danger button.btn-transparent, .alert.alert-success button.btn-transparent { 
	border: 0; background: inherit; font-size: 16pt; position: relative; top: -15px; left: 20px;
}

.form-control-inline { display: inline !important; width: auto; }
.card-header-buttons { float: right; display: inline-block; width: auto; color: #fff; }
.card-header-buttons a, .card-header-buttons a:visited { color: #fff; }

.editable_price_input { width: 50px; display: inline-block; padding: 3px 6px;}
.art-num { display: inline-block; width: 40px; position: relative; top: 4px; padding: 3px 6px; }
.btn-remove-num, .btn-add-num {
	padding: 0px !important;
	border: 0;
	background: inherit;
	color: #f7f7f7;
	font-size: 26pt;	
}

.btn-remove-num:hover, .btn-add-num:hover {
	color: #aaa;
}

.btn-register-meal { padding: 10px 30px; font-size: 14pt; display: inline-block; float: right; margin-right: 60px; }

.table-articles { width: 100%; }
.table-articles td, table-articles th {
	padding: 4px 12px ;
	vertical-align: middle;
}

.table-articles tfoot { font-weight: bold; }
.table-articles .col-price { width: 100px; }
/*.table-articles .col-num { width: 160px; }*/
.table-articles th.col-num { text-align: center; }
.table-articles td.col-num { text-align: right; }
.table-articles .col-sum { width: 100px; }

.col-num { width: 140px; padding: 4px; }
.art-num { width: 24px; }



.title-menu { float: right; }
.title-menu .active { background-color: #00346D !important; border-color: #183454 !important; color: #fff !important; }
.title-menu .active:hover { background-color: #093B72 !important; }

.color-list-block { width: 120px; }

.dataTables_wrapper { padding: 0 !important;  }
.dataTables_wrapper .dataTables_processing { clear: both; display: block; background: inherit; background-color: #343434; color: #fff;  width: 262px !important; height: 72px !important; font-size: 12pt; text-align: center; z-index: 9999 !important; position: fixed !important; left: 45% !important; top: 35% !important;}
.dataTables_paginate li:hover { background: none !important; border: 0 !important; }
.dataTables_paginate ul { margin: 0 !important; padding-bottom: 20px; }
.dataTables_paginate ul li { padding: 0px 5px !important;}

#modal-edit .sp-light, #modal-new .sp-light { display: block; }
#modal-edit .sp-preview, #modal-new .sp-preview { width: 92%; }

.btn-sort-article,
.btn-add-article { float: right; margin-left: 10px;}


/* for styled-radio */
html {
	box-sizing: border-box;
}

/* for styled-radio */
*,
*::before,
*::after {
	/* Inherit box-sizing to make it easier to change the property
 	 * for components that leverage other behavior.*/
	box-sizing: inherit;
}

/*style wrapper to give some space*/
.styled-radio-wrapper {
	position: relative;
    margin-bottom: 1rem;
    margin-top: 1rem;
}

/*style label to give some more space*/
.styled-radio-wrapper label {
    display: block;
    padding: 0px 0 6px 48px;
}

/*style and hide original checkbox*/
.styled-radio-wrapper input {
	height: 34px;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 28px;
}

/*position new box*/
.styled-radio-wrapper input + label::before {
	border: 2px solid;
	content: '';
	height: 28px;
	left: 0;
	position: absolute;
	top: 0;
	width: 34px;
  border-radius: 40%;
}

/*radio pseudo element styles*/
.styled-radio-wrapper input + label::after {
	content: '';
	opacity: 0;
	border: 8px solid #000;
	border-radius: 40%;
	position: absolute;
	left: 9px;
	top: 6px;
	transition: opacity 0.2s ease-in-out;
}

/*reveal check for 'on' state*/
.styled-radio-wrapper input:checked + label::after {
	opacity: 1;
}

/*focus styles*/
.styled-radio-wrapper input:focus + label::before {
  box-shadow: 0 0 0 3px #ffbf47;	
  outline: 3px solid transparent;
}

.portlet { margin: 6px 2px; padding: 6px; }
.portlet-header { cursor: move; }
.ui-state-highlight { height: 32px; margin: 6px; }
.btn-save-article-sorting { margin: 12px 0px; }
.portlet-content-table { border-bottom: 1px solid #3D3D3D; padding: 20px; }
.portlet-content-table.border-top  { border-bottom: 1px solid #3D3D3D; }

.table-condensed { width: 220px; }

/* extra small devices */
@media (max-width: 576px) {
	.btn-add-top { display: none; }
	.btn-add-bottom { display: inline; }
	.btn-remove-num { display: inline;}
	.btn-remove-num, .btn-add-num {
		margin: 0;
		font-size: 24pt;
	}
	.art-num { width: 100%; }
	.col-sum-title { display: none; }
	.editable-price-sm .editable_price { width: 100%; display: inline-block; }
	.card-body { padding: 4px; }
	.form-control-inline { width: 100%; }
	.inline-price { display: block; }

	.styled-radio-wrapper { left: 40px; display: block; }
	.table-payment-register tr td { display: block;  }
	.btn-register-meal { margin: 0 auto !important; float: none; width: 60%; display: block; }

	.table-articles .col-price { display:none; }
	.table-articles .col-desc { width: 50% !important; }
	/*.table-articles .col-num { width: 30% !important; min-width: 100px; max-width: 120px !important; }*/
	.table-articles .col-sum { width: 20% !important; }
}

/* Small devices (landscape phones, 576px and up.. all below 767px) */
@media (max-width: 767px) { 
	.btn-add-top { display: none; }
	.btn-add-bottom { display: inline-block; float:left; margin-right: 5px !important;}
	.btn-remove-num { display: inline-block; float:right;  }
	.btn-remove-num, .btn-add-num {
		margin: 0;
		font-size: 26pt;
	}
	.art-num { width: 100%; }
	.col-sum-title { display: none; }
	.editable-price-sm .editable_price { width: 100%; display: inline-block; }
	.card-body { padding: 4px; }
	.form-control-inline { width: 100%; }
	.inline-price { display: block; }

	.styled-radio-wrapper { left: 40px; display: block; }
	.table-payment-register tr td { display: block;  }
	.btn-register-meal { margin: 0 auto !important; float: none; width: 60%; display: block; }

	.table-articles .col-price { display:none; }
	.table-articles .col-desc { width: 50% !important; }
	/*.table-articles .col-num { width: 30% !important; min-width: 100px; max-width: 120px !important; }*/
	.table-articles .col-sum { width: 20% !important; }

	.hidden-md-down { display: none; } /* removed from bootstrap */
	.dataTables_length, .dataTables_info { text-align:left !important; }
	.title-menu a.btn { padding: 4px 20px; }

	#modal-new .modal-content, #modal-edit .modal-content { min-height: 90vh; }
	#modal-new .modal-dialog, #modal-edit .modal-dialog { min-width: 90%; margin: 20px auto; }		
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
	
	.table-articles .inline-price, .table-articles .btn-add-bottom, .table-articles .col-sum-title-sm,
	.table-articles .editable-price-sm { display: none; }
	.col-num { width: 120px; padding: 4px !important; }
	.btn-remove-num { margin-right: 6px !important;  }


	/*.btn-add-bottom { display: inline-block; float: left; }
	.btn-remove-num { display: inline-block; float: right; }
	.btn-remove-num, .btn-add-num {
		margin: 0;
	}	
	.art-num { width: 100%; }
	.col-sum-title-sm, .inline-price, .editable-price-sm { display: none; }

	.styled-radio-wrapper { left: 40px; display: block; }*/

	.hidden-md-down { display: none; } /* removed from bootstrap */
	.dataTables_length, .dataTables_info { text-align:left !important; }
	.title-menu a.btn { padding: 4px 20px; }

	#modal-new .modal-content, #modal-edit .modal-content { min-height: 90vh; }
	#modal-new .modal-dialog, #modal-edit .modal-dialog { min-width: 90%; margin: 20px auto; }	
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {
	
	.btn-add-top { display: inline; }
	.btn-add-bottom { display: none; }
	/*.btn-remove-num, .btn-add-num {
		margin-top: -4px;
		margin-left: 8px;
		margin-right: 8px;
	}*/

	.col-num { width: 120px; padding: 4px !important; }
	.btn-remove-num { margin-right: 10px !important;  }	
	.col-sum-title-sm, .inline-price, .editable-price-sm { display: none; }

	.styled-radio-wrapper:first-child { left: 40px;  }

	.hidden-lg { display: none; } /* removed from bootstrap */
	#modal-new .modal-content, #modal-edit .modal-content { width: 600px; }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.btn-add-top { display: inline; }
	.btn-add-bottom { display: none; }
	/*.btn-remove-num, .btn-add-num {
		margin-top: -4px;
		margin-left: 8px;
		margin-right: 8px;
	}*/

	.col-num { width: 120px; padding: 4px !important; }
	.btn-remove-num { margin-right: 10px !important;  }
	.col-sum-title-sm, .inline-price, .editable-price-sm { display: none; }

	.styled-radio-wrapper:first-child { left: 40px;  }
	#modal-new .modal-content, #modal-edit .modal-content { width: 600px; }
}