/* utility methods */

.bold { font-weight: bold; }
.italic { font-style: italic; }
.underline { text-decoration: underline; }
.normal { font-weight: normal; }
.hide { visibility: hidden; display: none; }
.confirmation { color: Green; }
.error { color: Red; }
.rightalign { text-align: right; }
.leftalign {text-align: left; }
.topalign { vertical-align: top; }
.green { color: Green; }
.red { color: Red; }
.black { color: Black; }
.yellow { color: #b99700; }
.center { text-align: center; }
.clear { clear: both; }
.pointer { cursor: pointer; }
.floatleft { float: left; }
.floatright { float: right; }
.centerblock { margin: 0 auto 0 auto; }
.smallfont { font-size: 9px; }
.fulltable { width: 100%; }
.nopadding { padding: 0px !important; }
.padding3 { padding: 2px !important; }
.padding3 { padding: 3px !important; }
.padding5 { padding: 5px; }
.noborder { border: 0px; }
.scroller { overflow: auto; height: 300px; }

#reportbar { z-index: 1000; }

/* cash accountability */

#cashaccountability { }

#cashaccountability #collectionticket { width: 600px; /*border: solid 1px #000;*/ padding: 10px; }
#cashaccountability #collectionticket .table { width: 100%; }
#cashaccountability #collectionticket .table .left { width: 310px; vertical-align: top; }
#cashaccountability #collectionticket .table .left .title { font-weight: bold; font-size: 16px; }
#cashaccountability #collectionticket .table .right { width: 290px; vertical-align: top; }

#cashaccountability #collectionticket .collecttable { width: 100%; border: solid 1px #000; }
#cashaccountability #collectionticket .collecttable td { padding: 5px; }
#cashaccountability #collectionticket .collecttable input { width: 100px; }
#cashaccountability #collectionticket .collecttable .checkboxfield { font-size: 10px; }
#cashaccountability #collectionticket .collecttable .checkboxfield input { width: auto; }
#cashaccountability #collectionticket .collecttable .title td { background-color: #000; color: #fff; }
#cashaccountability #collectionticket .collecttable .label { }
#cashaccountability #collectionticket .collecttable .field { }
#cashaccountability #collectionticket .collecttable span { width: 50px; }
#cashaccountability #collectionticket .table .right .total { width: 100%; font-weight: bold; font-size: 18px; background-color: #ebebe6; padding: 4px; }

#cashaccountability #collectionticket #buttons input { width: 100px; }

/* calendar popup */
 
.calendarpopup { z-index: 100; visibility: hidden; position: absolute; /*background-color: white; layer-background-color: white;*/ width: 160px; }
.calendarpopup td { padding: 0px !important; }
 
/* tabs */

.tabs { height: 23px; margin-bottom: 5px; background: url('../_images/tabs/tab-bg.png') #fff; text-align: center; }
.tabs ul { list-style-type: none; padding-left: 0px; margin-left: 0px; width: 800px; height: 23px; margin: 0px auto 0px auto; }
.tabs ul li { width: 100px; height: 23px; background: url('../_images/tabs/tab_1.png') #fff no-repeat; text-align: center; float: left; }
.tabs ul li.on { background: url('../_images/tabs/tab-on_1.png') #fff no-repeat; }
.tabs ul li span { height: 23px; vertical-align: top; padding-top: 5px; } 
.tabs ul li a { height: 23px; line-height: 23px;  }
.tabs ul li a,.tabs ul li a:active,.tabs ul li a:visited { color: #fff; font-weight: bold; text-decoration: none; cursor: pointer; }
.tabs ul li a:hover { color: #fff; text-decoration: underline; }
.tabs ul li.on a,.tabs ul li.on a:active,.tabs ul li.on a:visited { color: #5c5c5c; }
.tabs ul li.on a:hover { color: #5c5c5c; }

/* table */

.container { width: 100%; border: solid 1px #cfcfcf; }
.container .title { font-weight: bold; background-color: #e3e3e3; color: #000; }
.container td { padding: 5px; }
.container .label { font-weight: bold; width: 80px; vertical-align: top; }
.container .field { }
.container .moneyfield { text-align: right; }

.formtable { width: 100%; padding: 0px; border: 0px; }
.formtable .title { font-weight: bold; }
.formtable .title td { padding: 5px 5px 5px 5px; /*height: 27px;*/ background: url('../_images/grid/header.png') #c5ddf4 top left repeat-x; vertical-align: middle; border-bottom: solid 1px #6296cb; }
.formtable .title td.leftcorner { border-left: solid 1px #6296cb; }
.formtable .title td.rightcorner { border-right: solid 1px #6296cb; }
.formtable .title td.bothcorners { border-left: solid 1px #6296cb; border-right: solid 1px #6296cb; }
.formtable .title img { vertical-align: middle; padding-left: 2px; }
.formtable .title a { vertical-align: middle; font-size: 12px; }
.formtable .title a:hover { color: #000; }
.formtable td { padding: 5px; }
.formtable .altrow { background-color: #e6f0fa; }
.smallgrid td { font-size: 11px !important; }

.emptytable { width: 100%; padding: 0px; }
.emptytable td { padding: 0px; }
.emptytable .left { text-align: left; }
.emptytable .right { text-align: right; }
.emptytable .right img { border: 0px; }

/* subheader */

.subheader { color: #003091; font-weight: bold; font-size: 13px; }
.subheader .hr { background: url('../_images/subdivider.png'); width: 115px; height: 1px; border: 0px; font-size: 1px; margin: 3px auto 0px auto; }

/* help tooltip */

a.tooltip
{
    position: relative;
    z-index: 24; 
    text-decoration: none;
    cursor: help;
}

a.tooltip:hover{z-index: 25;}

a.tooltip span{display: none; visibility: hidden;}

a.tooltip:hover
{
	background: none;
}

a.tooltip:hover span
{
	visibility: visible;
    display: block;
    position: absolute;
    top: -115px; 
    left: 35px;
    background: #fff;
    z-index: 100;
 }
 
 a.tooltip:hover span.help
{
	visibility: visible;
    display: block;
    position: absolute;
    top: -10px; 
    left: 35px;
    padding: 5px; 
    border: solid 1px #000; 
    background-color: #e3e3e3; 
    color: #000; 
    font-weight: normal; 
    width: 200px;
    z-index: 100;
 }
 
a.tooltip:hover span span
{
    display: inline;
    position: static;
    background: none;
	border-width: 0px;
}
 
a.tooltip img { border: 0px; }

/* planogram */

#planogram { width: 100%; height: 276px; }

#planogram .left { vertical-align: top; /*font-family: Verdana, Helvetica, sans-serif;*/ }
#planogram .left .scrollbox { overflow: auto; height: 276px; }
#planogram .left .scrollbox .planogram { border: solid 1px #cfcfcf; margin: 0px 1px 1px 0px; }
#planogram .left .scrollbox .planogram .title { font-weight: bold; }
#planogram .left .scrollbox .planogram .title td { padding: 3px; background: url('../_images/grid/header.png') #c5ddf4 top left repeat-x; vertical-align: middle; border-bottom: solid 1px #6296cb; border-left: solid 1px #6296cb; border-right: solid 1px #6296cb; }
#planogram .left .scrollbox .planogram .title td table { width: 100%; }
#planogram .left .scrollbox .planogram .title td table tr td { padding: 0px; border: 0px; background: none; }
#planogram .left .scrollbox .planogram td { padding: 0px 0px 1px 0px; font-size: 9px; vertical-align: middle; }
#planogram .left .scrollbox .planogram input { font-size: 9px; width: 25px; }

#planogram .right { vertical-align: top; width: 130px; }
#planogram .right td,#planogram .right input,#planogram .right select { font-size: 9px;  }
#planogram .right .size td { padding-bottom: 3px; }
#planogram .right .search td { padding-bottom: 3px; }
#planogram .right #products { border: solid 1px #000; overflow: auto; height: 227px; font-family: Verdana, Helvetica, sans-serif; }
#planogram .right #products #tblProducts { padding: 3px; width: 100%; }

#planogram .right #products .cellhover
{
    border: solid 1px #000;
	background-color: #e3e3e3;
	cursor: pointer;
}
#planogram .right #products .cellselected
{
    border: solid 1px #000;
	background-color: #6296cb;
}
#planogram .right #products .cell
{
	border: solid 1px #fff;
	background-color: #fff;
}
#planogram .right #products .gridcell
{
    border: solid 1px #000;
	background-color: #fff;
	vertical-align: top;
}
#planogram .right #products .gridcellhover
{
    border: solid 1px #000;
	background-color: #e3e3e3;
	vertical-align: top;
}

/* modal background */

.modalbackground {
	background-color:Gray;
	filter:alpha(opacity=70);
	opacity:0.7;
}
.sitemodal { background-color: #fff; border: solid 1px #000; width: 400px; }
.sitemodal .title { font-weight: bold; background: #e3e3e3; height: 26px; }
.sitemodal .title .left { float: left; padding: 5px; }
.sitemodal .title .right { float: right; padding: 5px; margin: 0px; }
.sitemodal .title .right input { padding: 0px !important; margin: 0px !important; }
.sitemodal .body { padding: 10px; }
.sitemodal .body .scroller { clear: both; height: 350px; overflow: auto; }
.sitemodal .body .scroller .content { width: 94%; }
.sitemodal .body .scroller .content div.info { width: 100%; height: 150px; font-weight: bold; background: url('../_images/popups/info.png') center no-repeat; }
.sitemodal .body .scroller .content div.warning { width: 100%; height: 150px; font-weight: bold; background: url('../_images/popups/warning.png') center no-repeat; }
.sitemodal .body .scroller .content div.error { width: 100%; height: 150px; font-weight: bold; background: url('../_images/popups/error.png') center no-repeat; color: #000; }
.sitemodal .body .scroller .content div.success { width: 100%; height: 150px; font-weight: bold; background: url('../_images/popups/success.png') center no-repeat; }
.sitemodal .buttons { width: 100%; }
.sitemodal .busy { text-align: center; font-weight: bold; font-size: 16px; color: #4c4d4e; }

/* status bar */

.statusbar
{
	background-color: #D4E5F7;
	border-color: #003091;
	border-style: solid;
	border-width: 1px;
	vertical-align: middle;
	width: 100%;
	height: 20px;
}

/* calendar */

.highlight  
{
    background-color: #D4E5F7;
	border-color: #003091;
	border-style: solid;
	border-width: 1px; 
}

/* ajax calendar */

.ajax__calendar_days td { padding: 0px !important; }

/* instruction box */

.description { width: 549px; margin-bottom: 5px; }
.description .top { background: url('../_images/boxes/instruction-box-top.png') left no-repeat; height: 15px; }
.description .content { background: url('../_images/boxes/instruction-box-bg.png') left repeat-y; }
.description .content .inner 
{
    padding: 0px 10px 5px 10px;
    color: #fff; 
    font-weight: bold;
}
.description .content .inner a { color: #bcbdbd; }
.description .bottom { background: url('../_images/boxes/instruction-box-bottom.png') left no-repeat; height: 6px; }

/* update box */

.update-box  
{
    background: url('../_images/boxes/update-box-bg.png') left no-repeat; 
    width: 549px; 
    height: 35px; 
    margin-bottom: 5px;
}
.update-box .inner  
{
    padding: 10px;
    color: #fff; 
    font-weight: bold;
}
.update-box .inner a { color: #bcbdbd; }
.update-box .inner img { padding-right: 5px; margin-bottom: -3px; }