@media (max-width: 768px)
{
	.LoginPageLogo
	{
		width: 90%;
		height: auto;
	}
	.LoginButton
	{
		width: 90%;
		background-color: #2980b9;

	}
	.BackButton
	{
		width: 90%;
		background-color: #9ccb3e;

	}
	.RedButton
	{
		width: 90%;
		background-color: #cc3333;

	}
	.BlueButton
	{
		width: 90%;
		background-color: #2980b9;

	}
	#sortable
	{
		list-style-type: none;
		margin: 0;
		padding: 0;
		width: 65%;
	}
	#sortable li
	{
		margin: 3px 3px 3px 3px;
		padding-top: 20px;	
		font-size: 10px;
		height: 40px;
	}

}

@media (min-width: 768px)
{
	.LoginButton
	{
		width: 25%;
		background-color: #2980b9;
	}
	.BackButton
	{
		width: 25%;
		background-color: #9ccb3e;
	}
	.RedButton
	{
		width: 25%;
		background-color: #cc3333;
	}
	.BlueButton
	{
		width: 25%;
		background-color: #2980b9;
	}
	#sortable
	{
		list-style-type: none;
		margin: 0;
		padding: 0;
		width: 25%;
	}
	#sortable li
	{
		margin: 0 3px 3px 3px;
		padding: 0.4em;
		padding-left: 1.5em;
		font-size: 14px;
		height: 18px;
	}
	#sortable li span
	{
		position: absolute;
		margin-left: -1.3em;
	}
}

.mobileFont
{
	font-family: 'Open Sans', sans-serif;
}

#LoginPage .page__background
{
	height: 100%;
	background-image: url('/images/system/login-1920.jpg');
	background-position: center center;
	background-size: cover;
}
#NewOrderPage .page__background
{

}
#OrderCutOffPage .page__background
{
	background-image: url('/images/system/logo-white-640.png');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 300px;

}
#OrderNewConfirmDate .page__background
{
	background-image: url('/images/system/logo-white-640.png');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 300px;

}

.inputLogin
{
	background: transparent;
	border: none;
	border-bottom: 1px solid #FFFFFF;
	border-radius: 0;
	color: #ffffff;

}

#menu .page__background
{
	height: 100%;
	background-image: url('/images/system/menu_bg.jpg');
	background-position: center center;
	background-size: cover;
}

.listTransparent
{
	background: transparent;
}

.MainNavBar
{
	background-color: #080808;
}

.table
{
	margin-bottom: 4px;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td
{
	padding: 4px;
	line-height: 1.42857143;
	vertical-align: middle;
	border-top: 1px solid #ddd;
}
.table > thead > tr > th
{
	vertical-align: bottom;
	border-bottom: 2px solid #ddd;
}
.table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > th,
.table > caption + thead > tr:first-child > td,
.table > colgroup + thead > tr:first-child > td,
.table > thead:first-child > tr:first-child > td
{
	border-top: 0;
}
.table > tbody + tbody
{
	border-top: 2px solid #ddd;
}
.table .table
{
	background-color: #fff;
}
.table-hover > tbody > tr:hover
{
	background-color: #f5f5f5;
}

.inputText
{
	font-family: 'Open Sans', sans-serif;
	font-size: 10px;
	background: transparent;
	border: 1px solid #b8b8b8;
	border-radius: 0;
	-webkit-appearance: none;
}
.inputTextRight
{
	font-family: 'Open Sans', sans-serif;
	font-size: 10px;
	text-align: right;
	background: transparent;
	border: 1px solid #b8b8b8;
	border-radius: 0;
	-webkit-appearance: none;
}
.inputTextCenter
{
	font-family: 'Open Sans', sans-serif;
	font-size: 10px;
	text-align: center;
	background: transparent;
	border: 1px solid #b8b8b8;
	border-radius: 0;
	-webkit-appearance: none;
}

.inputOrderHeader
{
	font-family: 'Open Sans', sans-serif;
	font-size: 12px;
	background: transparent;
	border: none;
	border-bottom: 1px;
	border-bottom-color: #b8b8b8;
	border-bottom-style: solid;
	border-radius: 0;
	-webkit-appearance: none;
	height: 12px;

}

.top-buffer-5
{
	margin-top: 5px;
}

.top-buffer-10
{
	margin-top: 10px;
}
.top-buffer-20
{
	margin-top: 20px;
}
.top-buffer-50
{
	margin-top: 50px;
}
.top-buffer-100
{
	margin-top: 100px;
}
.bottom-buffer-5
{
	margin-bottom: 5px;
}
.bottom-buffer-10
{
	margin-bottom: 10px;
}
.bottom-buffer-20
{
	margin-bottom: 20px;
}
.bottom-buffer-50
{
	margin-bottom: 50px;
}
.bottom-buffer-100
{
	margin-bottom: 100px;
}
.sdfpgreen
{
	color: #9ccb3e;
}
.text-white
{
	color: #FFFFFF;
}

.text-black
{
	color: #000000;
}
.text-red
{
	color: #cc3333;
}
.text-blue
{
	color: #2980b9;
}

.text-right
{
	text-align: right;
}

.text-left
{
	text-align: left;
}

.s06
{
	font-size: 6px;
}

.s08
{
	font-size: 8px;
}
.s10
{
	font-size: 10px;
}
.s11
{
	font-size: 11px;
}
.s12
{
	font-size: 12px;
}
.s14
{
	font-size: 14px;
}

.s16
{
	font-size: 16px;
}
.s18
{
	font-size: 18px;
}

.s20
{
	font-size: 20px;
}

.s22
{
	font-size: 22px;
}

.s24
{
	font-size: 24px;
}

.s26
{
	font-size: 26px;
}

.s28
{
	font-size: 28px;
}

.s30
{
	font-size: 30px;
}

.vertalign
{
	vertical-align: middle;
}

.ui-datepicker-trigger
{
	position: relative;
	top: 3px;
	right: -4px;
}
.text-input
{
	color: #2980b9;
}