body {
	margin: 0px;
	padding: 0px;
	font-family: Arial;
	font-size: 14px;
	color: #000000;
}

.container {
	position: relative;
	margin: 0px;
	padding: 0px;
}

/* GRADIENTS */
.blueGradient {
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #c3d9ff 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#c3d9ff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#c3d9ff 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#c3d9ff 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#c3d9ff 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#c3d9ff 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#c3d9ff',GradientType=0 ); /* IE6-9 */
}

.yellowGradient {
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #ffff88 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#ffff88)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#ffff88 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#ffff88 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#ffff88 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#ffff88 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffff88',GradientType=0 ); /* IE6-9 */
}

.redGradient {
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #ff9387 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#ff9387)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#ff9387 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#ff9387 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#ff9387 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#ff9387 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ff9387',GradientType=0 ); /* IE6-9 */
}

.greenGradient {
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #cdeb8b 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#cdeb8b)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#cdeb8b 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#cdeb8b 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#cdeb8b 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#cdeb8b 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cdeb8b',GradientType=0 ); /* IE6-9 */
}

.grayGradient {
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #cecece 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#cecece)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#cecece 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#cecece 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#cecece 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#cecece 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cecece',GradientType=0 ); /* IE6-9 */
}

/* COLORS */
.blue:hover {
	background-color: #c3d9ff;
}

.yellow:hover {
	background-color: #ffff88;
}

.red:hover {
	background-color: #ffa397;
}

.green:hover {
	background-color: #cdeb8b;
}

.gray:hover {
	background-color: #cecece;
}

/* ROUNDED BUTTONS */
.roundButton {
	border-radius: 7px;
	display: inline-block;
	height: 25px;
	padding: 3px 8px 3px 8px;
	margin: 2px 10px 2px 10px;
	cursor: pointer;
	border: 1px solid #999999;
}

.roundButton img {
	height: 21px;
	vertical-align: middle;
	padding-right: 5px;
}

.roundButton span {
	line-height: 25px;
}

a:link.roundButton, a:visited.roundButton, a:active.roundButton, a:hover.roundButton {
	color: #494949;
	font-size: 16px;
	font-weight: bolder;
	text-decoration: none;
}

/* TABS */
.tabButton {
	position: relative;
	top: 2px;
	display: inline-block;
	height: 25px;
	bottom: 0px;
	padding: 0px 15px 0px 15px;
	margin: 3px 10px 0px 10px;
	background-color: #eeeeee;
	border-radius: 4px 4px 0px 0px;
	cursor: pointer;
}  

.tabButton span {
	display: inline-block;
	line-height: 25px;
}

.tabButton:hover {
	background-color: #ffffff;
}

.tabButtonSelected {
	top: 4px;
	background-color: #ffffff;
}

a:link.tabButton, a:visited.tabButton, a:active.tabButton {
	color: #494949;
	font-size: 12px;
	font-weight: bolder;	
}

a:link.tabButtonSelected, a:visited.tabButtonSelected, a:active.tabButtonSelected {
	font-size: 14px;
}

.tabBackButton {
	border-radius: 4px 4px 4px 4px;
	padding: 0px 10px 0px 10px;
	background-image: url(../img/back.png);
	background-repeat: no-repeat;
	background-position:center;
} 

/* IMAGE BUTTONS */
.imageButton {
	white-space: nowrap;
	display: inline-block;
	cursor: pointer;
	line-height: 20px;
	padding: 0px 5px 0px 5px;
}

.imageButton img {
	vertical-align: middle; 
	height: 20px;
}

.imageIconButton {
	white-space: nowrap;
	display: inline-block;
	cursor: pointer;
	font-weight: bolder;
	text-align: center;
	margin: 3px;
	padding: 6px;
	background-color: #5a86a8;
	border-radius: 4px;
}

.imageIconButton img {
	vertical-align: middle;
}

.imageIconButton:hover {
	background-color: #4a7698;
}

/* RADIO BUTTONS */
.radioButton {
	padding: 3px 5px 3px 2px;
	background-color: #eeeeff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	line-height: 25px;
	cursor: pointer;
}

.radioButton:hover {
	color: #000000;
}

.radioButton img {
	position:relative;
	top: 2px;
}

.radioButtonSel {
	background-color: #000033;
	color: #ffffff;
}

.radioButtonSelWarn {
  background-color: #AF6A0F;
	color: #ffffff;
}

.radioButtonSel:hover {
	color: #ffffff;
}

/* HEADER */
#header {
	position: relative;
	width: 100%;
	margin: 0px auto;
}

#header_container {
	position: relative;
	height: 90px;
	background-color: #6a96b8;
}

#header_background {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: -10;
}

#header_logo {
	position: absolute;
	left: 10px;
	top: 10px;
}

#header_menu {
	position: absolute;
	right: 25px;
	top: 5px;
	font-family: Verdana, sans-serif;
	font-size: 12px;
}

#header_menu a{
	color: #ffffff;
}

#header_info {
	position: absolute; 
	right: 25px; 
	bottom: 5px;
	font-size: 15px;
	color: #ffffff;
}

/* FOOTER */
#footer {
	position: relative;
}

#footer_info {
	text-align: center;
}

/* MENU */
#main_menu {
	position: absolute;
	width: 200px;
	top: 90px;
	left: 0px;
}

#main_menu #menu_sub {
	line-height: 32px;
	background-color: #3a6688;
	font-weight: bolder;
	color: #ffffff;
	padding-left: 10px;
	cursor: pointer;
}

#main_menu #menu_item {
	font-weight: bolder;
	padding: 5px;
	color: #000000;
	font-weight: normal;
	line-height: 30px;
	cursor: pointer;
}

#main_menu #menu_item img {
	vertical-align: middle;
}

#main_menu #menu_item:hover {
	background-color: #9ac6e8;
}

#main_menu #menu_item a {
}

#main_menu #menu_content {
	border: 2px solid #3a6688;
	border-top: 0px;
}

/* BODY */
#body {
	position: absolute;
	left: 200px;
	top: 90px;
	right: 0px;
	margin: 0px auto;
}

.tabs_bar {
	width: 100%;
	min-height: 32px;
	margin: 0px;
	padding: 0px;
	background-color: #3a6688;
}

#content {
	min-height: 100px;
	margin: 10px;
}

#content_buttons {
	float: right;
	margin-bottom: 10px;
}

#pagetitle {
	position: absolute;
	left: 200px;
	top: 0px;
	height: 90px;
	color:#ffffff;
	display: table;
}

#pagetitle #text {
	display: table-cell;
	vertical-align: middle;
	font: bold 34px Arial;
}

#pagetitle #subtext {
	font: normal 24px Arial;
}

#pagelogo {
	position: absolute;
	right: 15px;
	top: 0px;
}

#pagelogo img {
	width: 40px;
	height: 40px;
}

/* GENERAL */
a {
	text-decoration: none;
	color: #1D3FAC;
}

a:hover {
	color: #1D4FBC;
	text-decoration: underline;
}

a:focus {
	outline: none;
}

form {
	margin: 0px 0px 0px 0px;
	padding: 0px;
}

label {
	font-weight: bolder;
	width: 200px;
}

hr {
	margin: 10px;
	padding: 0px;
	height: 3px;
}

p {
	margin: 10px;
	padding: 0px;
}

div {
	margin: 0px;
	padding: 0px;
}

img {
	border: none;
}

/* TEXT Style */
h1 {
	font: bold 16px Arial;
}

h2 {
	font: bold 40px Arial;
}

h3 {
	font: bold 40px Arial;
}

.title { /* TODO remove this in favor of h1 */
	font: bold 40px Arial;
}

.subtitle {
	font: bold 30px Arial;
	margin-left: 20px;
}

.success {
	font-weight: bolder;
}

.error {
	color: #ff0000;
	font-weight: bolder;
}

.warning {
	color: #AF6A0F;
	font-weight: bolder;
}

.highlight {
	background-color: #ffaaaa;
	font-weight: bolder;
}

.hidden {
	display: none;
}

/* Form Elements Styles */
.field {
	border: 1px solid #6F96C3;
	background: #FCFDFE; 
}

.field_simple {
	border: none;
	background: #FCFDFE;
	text-align: center;
}

.field_simple:hover {
	background: #ECEDEE;	
}

.buttons {
	margin-top: 15px;
	margin-left: 40px;
}

.button {
	border: 1px outset #E6EDF5;
	font-weight: bolder;
	cursor: pointer; 
	background-color: #E6EDF5;
}

.button:hover {
	border-color: #000000;
}

.centerWindow {
	position: absolute;
	z-index: 10;
	border: 1px outset #000000;
	background-color: #FCFDFE; 
	padding: 20px;
	left: 0px;
	right: 0px;
	top: 30px;
	margin: 0 auto;
	width: 50%;
}

.workingArea {
	position: relative;
	display: inline-block;
}

/* VENDING */
.vending {
	margin: 0 auto; 
	padding: 0px;
	width: 95%;
}

.shelf {
	background-color: #000000;
}

.shelfTable {
	width: 100%; 
	margin: 0px; 
	padding: 0px;
	table-layout: fixed;
}

.shelfTable td {
	overflow: hidden;
}

.cell {
	text-align: center;
	line-height: 12px;
	font-family: "Arial Narrow", "Arial";
	cursor: pointer;
}

.cellLabel {
	background-color: #444444;
	color: #ffffff;
	font-size: 10px; 
	font-weight: bolder;
	line-height: 8px; 
	margin: 0px; 
	padding: 0px; 
	text-align: center;
}

.rowLabel {
	height: 10px; 
}

.cellInput {
	width: 16px;
	border: none;
	border-bottom: 1px dashed #0000ff;
}

.imageLinkButton {
	height: 16px;
	cursor: pointer;
	vertical-align: middle;
}
	
/* TABLES */
table, th, td {
	border: 1px solid #D4E0EE;
	border-collapse: collapse;
	font-family: "Trebuchet MS", Arial, sans-serif;
	color: #555;
}

th.narrow {
	font-family: "Helvetica Narrow","Arial Narrow",Tahoma,Arial,Helvetica,sans-serif;
}

.expandedTable, .expandedTable th, .expandedTable td {
	white-space: normal;	
}

caption {
	font-size: 150%;
	font-weight: bold;
	margin: 5px;
}

td, th {
	padding: 4px;
}

td.center {
	text-align: center;
}

th {
	background: #E6EDF5;
}

th.odd {
	background: #E2D8D8;	
}

th.odd2 {
	background: #CBDBEC;	
}

thead th {
	text-align: center;
	background: #E6EDF5;
	color: #4F76A3;
	font-size: 100% !important;
}

tbody th {
	font-weight: bold;
}

tbody tr { 
	height: 27px;
	background: #FCFDFE; 
}

tbody tr.odd { background: #F7F9FC; }

tfoot th, tfoot td {
	font-size: 85%;
}

.selectTr:hover {
	background: #767DC5;
	cursor: pointer;
}

.selectTr:hover td {
	color: #ffffff;
	font-weight: bolder;
}

.selectedTr td {
	color: #CCCCCC;
	font-weight: bolder;
}

.selectContent {
	border-top: 1px solid #888888;
	margin: 2px;
}

.selectContent div#reportcontent {
	padding: 10px;
}

.selectBar {
	color: #000000;
	background: #F8F8F8;
	font-weight: bolder;
	padding: 5px;
	margin: 1px;
	cursor: pointer;
}

.selectBar:hover {
	color: #ffffff;
	background: #333333;
}

/* SEARCHABLE TABLE */
.searchTable {
	border: 1px solid #D4E0EE;
	clear: both;
}

.searchTable table {
	width: 100%;
	margin: 0px;
	padding: 0px;
}

.table_count {
	text-align: center;
	font-weight: bolder;
	font-size: smaller;
	background-color: #E6EDF5;
	line-height: 25px;
}

/* HINT */
.ghostText {
	color: #888888;
}

/* MAIN SHORTCUTS */
.ashortcut {
	display: inline-block;
	width: 170px;
	height: 150px;
	border: 1px solid #aaaaaa;
	margin: 3px;
	padding: 5px;
	text-align: center;
	vertical-align: middle;
	cursor: pointer
}

.ashortcut p {
	font-size: smaller;
}

.ashortcut:hover {
	background-color: #DDDDFF;
	color: #000000;
}

.shortcut {
	border: 0;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	border-collapse:separate;
	border-spacing: 10px 10px;
}

.shortcut td {
	width: 150px;
	height: 150px;
	cursor: pointer;
}

.shortcut td:hover {
	background-color: #DDDDFF;
	color: #000000;
}

.titlebar {
	display: block; 
	line-height: 30px; 
	height: 30px; 
	font-weight: bolder; 
	margin: 10px; 
	padding-left: 20px;
	background-color: #CCDDFF;
}

.tip {
	cursor: pointer;
}

.accordion > span {
	background-image: url(../img/s_right.png);
	background-repeat: no-repeat;
	display: inline-block;
	width: 20px;
	height: 12px;
	vertical-align: middle;
}

/* WIZARD */
#wizard {
	position: relative;
	width: 940px;
	margin: 0px auto;
	padding-left: 5px;
	padding-right: 5px;
	-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
	border: 1px solid #888888;
	background-color: #ffffcc;
}

/* SUPPORT BOX */
.supportOverlay {
	position: fixed;
	top : 0px;
	left : 0px;
	width: 100%;
	height: 100%;
	background-color : transparent;
	z-index: 8999;
}

.supportBox {
	position: absolute;
	right: 50px;
	top: 100px;
	width: 600px;
	height: 300px;
	z-index: 9000;
	border: 2px solid #333333;
	border-radius: 5px;
	background-color: #ffffff;
	padding: 10px;
}

.supportBox #supportLabel {
	height: 30px;
}

.supportBox #supportMessages {
	height: 190px;
	border: 1px solid #999999;
	padding: 4px;
	overflow-y: scroll;
	overflow-x: hidden;
}

.supportBox #supportInput {
	margin-top: 10px;
	width: 100%;
	height: 40px;
}

.supportStar {
	background-color: #FF1A00;
	color: #ffffff;
	font-weight: bolder;
	border-radius: 4px;
	z-index: 8999;
	padding: 3px;
	top: 0px;
}

.supportMessage {
	margin: 5px; 
	padding: 5px 10px 20px 10px; 
	width: 550px;
	white-space: wrap;
	word-break: break-all;
}

.supportMessage .supportMessageDate {
	padding-top: 5px; 
	float: right; 
	font-size: 10px;
}

.supportMsgSupport {
	background-color: #ccddff;
}

.supportMsgClient {
	background-color: #ccffcc;
}

.supportMsgSelectable:hover {
	background-color: #006E2E;
	color: #ffffff;
	cursor: pointer;
}

.supportSelected {
	background-color: #006E2E;
	color: #ffffff;
	text-decoration: underline;
}

#supportSelectedClient {
	float: right;
	font-weight: bolder;
}

/* Dropdown Window */
.dropdown-window-content{
	position: absolute;
	background-color: #ffffff;
	border: 1px solid #999999;
	border-radius: 5px;
	z-index: 9000;
	overflow-y: scroll;
	max-height: 600px; 
}

/* SWITCH USER */
#switchUserMenu ul {
	list-style-type: none;
	margin: 5px;
	padding: 0px;
}

#switchUserMenu li {
	cursor: pointer;
	padding: 3px 20px 3px 3px;
	border-radius: 3px;
}

#switchUserMenu li:hover {
	background-color: #66ccff;
}

#switchUserMenu div.user_name {
	font-weight: bolder;
}

#switchUserMenu div.user_role {
	font-size: smaller;
}

/* CARD DATA */
.cardInfo  {
	margin-bottom: 10px;
}

.cardInfo div {
	padding-left: 15px;
	padding-right: 15px;
	min-height: 20px;
	border-bottom: 1px solid #999999;
}

/* COLORS */
tr.light_yellow, td.light_yellow {
	background-color: #FCFFDB;
	border-color: #CDD69D;
}

tr.light_green, td.light_green {
	background-color: #CAFFDB;
	border-color: #B8D8BA;
}

tr.light_green, td.light_blue {
	background-color: #DBE1FF;
	border-color: #B5AEFF;
}

/* PRODUCT QUALITY COLORS */
.good_product {
	background-color: #DBFFDB;
}

.regular_product {
	background-color: #FFFFDD;
}

.bad_product {
	background-color: #FFE2E2;
}

/* CSV DOWNLOAD */
.download_csv {
	height: 12px;
	position: absolute;
	top: 0px;
	right: 0px;
	cursor: pointer;
}

.download_csv img {
	height: 12px;
	vertical-align: middle;
}

/* REPORT FILTERS */
.filter_option {
	display: inline-block;
	background-color: #D7EFFF;
	border-radius: 8px;
	margin: 4px 2px 0px 0px;
	padding: 8px;
}

.filter_option img {
	height: 16px;
	vertical-align: middle;
	padding-left: 5px;
	cursor: pointer;
}

div.red_filter {
	background-color: #FFE0AA;
}

/* SESSIONS */
.sessionsCompareTable > tbody > tr > td {
	vertical-align: top;
}

.selectedTag {
	background-color: #FFED5D;
}


.fullwidth{
	width: 100%;
}

.map-marker-label{
	font-size: 12px;
	text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
}

.machine-input-position{
	float: left; 
	position: relative; 
	margin-left: 10px; 
	display: inline-block; 
	height: 200px; 
	width: 40px; 
}

.machine-input-position .machine-input-position-title{
	position: absolute; 
	bottom: 20;
	left: 2; /*Bordes*/
	width: 100%;
	height: 200px;
	writing-mode: vertical-rl;
	vertical-align: middle;
	text-align: center;
	border: 1px solid #000;
}

.machine-input-position .machine-input-position-level{
	position: absolute; 
	left: 0;
	bottom: 0px; 
	width: 100%;
}

.machine-input-position .machine-input-position-alerts{
	position: absolute; 
	left: -6px;
	top: -6px; 
	width: 100%;
	height: 12px;
	vertical-align: middle;
}


.machine-input-position .machine-input-position-level.low{
	background: #FFBABA; 
}

.machine-input-position .machine-input-position-level.medium{
	background: #FEEFB3;
}

.machine-input-position .machine-input-position-level.high{
	background: #DFF2BF;
}


.machine-input-position .machine-input-position-title.low{
	color: #D8000C;
}

.machine-input-position .machine-input-position-title.medium{
	color: #9F6000;
}

.machine-input-position .machine-input-position-title.high{
	color: #4F8A10;
}

/*Colorbox overwrites*/
#cboxCurrent {
    left: 130px;
}

td.col-5, th.col-5{ width: 5%;}
td.col-5,  th.col-5{ width: 10%;}
td.col-15, th.col-15{ width: 15%;}
td.col-20,  th.col-20{ width: 20%;}
td.col-25, th.col-25{ width: 25%;}
td.col-30,  th.col-30{ width: 30%;}
td.col-35, th.col-35{ width: 35%;}
td.col-40,  th.col-40{ width: 40%;}
td.col-45, th.col-45{ width: 45%;}
td.col-50,  th.col-50{ width: 50%;}
td.col-55, th.col-55{ width: 55%;}
td.col-60,  th.col-60{ width: 60%;}
td.col-65, th.col-65{ width: 65%;}
td.col-70,  th.col-70{ width: 70%;}
td.col-75, th.col-75{ width: 75%;}
td.col-80,  th.col-80{ width: 80%;}
td.col-85, th.col-85{ width: 85%;}
td.col-90,  th.col-90{ width: 90%;}
td.col-95, th.col-95{ width: 95%;}
td.col-100,  th.col-100{ width: 100%;}


.ui-widget-content {
    border: 1px solid #ddd;
    background: white;
    color: #333;
}

div#coinTable td {
  text-align: right;
}
