/************************************************************************************
RESET
*************************************************************************************/
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
	margin: 0;
	padding: 0;
}

img, fieldset {
	border: 0;
}

/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;
}
/*.UlChat ul { width:100%; height:auto;}
.UlChat li { width:100%; height:auto;}*/

/************************************************************************************
GENERAL STYLING (For jQueryMobile)
*************************************************************************************/

.ui-page { background: #131415; /*-webkit-backface-visibility: hidden;*/ }  /*This overwrites jQueryMobile's default BG */
.ui-content { background: #131415; /*text-shadow: 0 0 0 #fff;*/ }  
.tbControl { background-color: White; color: Gray; text-shadow: 0 0 0 #fff; }
/*.ui-input-datebox { background: transparent; width:113px !Important; border: 0px; padding:0px; box-shadow: 0 0 0; }*/
#ContentContainer { 	    
    min-width: 100%;
	    height: auto;
        width: 100%\9;
        /*max-width: 480px; overflow:hidden;*/ }
.RemoveColumnShadow { text-shadow: 0 0 0 #fff; }

/*.ui-header { position: fixed !important; top: 0 !important; z-index: 99; } */ /* Fixed Header Position */

.ui-select { width: 100%; }
.ui-checkbox { z-index:0; }
.ui-li .ui-btn-text a.ui-link-inherit { /* This are the added classes from jQuery mobile */
    white-space: normal;                /* And this enables more than one line */
}

/************************************************************************************
GENERAL STYLING
*************************************************************************************/
body {
	background-color: #131415;
	font: .81em/150% Arial, Helvetica, sans-serif;
	color: #666;
	cursor:default; 
}

.MultiViewStyle {
    -webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding:5px;
}
.ViewStyle {
    
}
.ViewTextContainer {
    background-color:#0f0f0f;
    margin-left:3px;
    width:97%;
    height:30px;
    padding:5px;
    -webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.CalendarBoxFont {
    font-size:15px;
}

/************************************************************************************
STRUCTURE
*************************************************************************************/
#pagewrap {
	width: 980px;
	margin: 0 auto;
}

.ContentWidth { max-width:450px; margin-left:auto; margin-right:auto; }

/************************************************************************************
HEADER
*************************************************************************************/
#header {
	position: relative;
	height: auto;
	max-width: 100%;
	/*height: 185px;*/
}

/* site top nav */
.top-logo-icon-left { top:0px; float:left; }
.top-nav-icon-right { top:0px; float:right; }
              
/* site description */
#site-description-mobile { display: none; }
#site-description { display: none; }

#Main-Filter-Box { display: none; }
/*#MobileFilterBox { display: none; }*/


/************************************************************************************
MAIN NAVIGATION
*************************************************************************************/

/*.DropdownList-Nav { margin-right:5px; }*/
.DropdownList-Nav { width:100%; }

#Category-nav {
	width: 100%;
	text-align:right;
	background-color: #f6f6f6;
	margin: 0;
	padding: 0;
	/*position: absolute;*/
	left: 0;
	bottom: 0;
	/*z-index: 100;*/

	/* rounded corner */
	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	-moz-border-top-left-radius: 8px;
	-moz-border-top-right-radius: 8px;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	/* box shadow */
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
}

.Menu-icon-container 
{
    width:146px; 
    height:144px; 
    margin:2px;
    float:left;
    background-color: #1f2022;
    border:1px solid #3e3f3f;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
    }

/************************************************************************************
TOUCH SWIPE 
*************************************************************************************/
#Swipe-Container
{
	width:100%;
	height:auto;
	background:#000000;
}
			
/************************************************************************************
CONTENT
*************************************************************************************/
#content {
	background: #fff;
    margin: 0;
	padding: 3% 4%;
	width: 600px;
	float: left;
	/* rounded corner */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	/* box shadow */
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);
	box-shadow: 0 1px 3px rgba(0,0,0,.4);
}

#TabletContainer { display: none; }

/************************************************************************************
SIDEBAR
*************************************************************************************/
#sidebar {
	width: 280px;
	float: right;
	margin: 30px 0 30px;
}

/************************************************************************************
FOOTER
*************************************************************************************/


/************************************************************************************
CLEARFIX
*************************************************************************************/
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { display: inline-block; }
.clearfix { display: block; zoom: 1; }

/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}


/************************************************************************************
EMPLOYEES PAGE
*************************************************************************************/
.EmployeeMenu
{
    width:100%; height:35px; margin-top:15px; text-align:center; font-size:12px;
    }

.EmployeePersonIcon
{
    width:60px; height:auto; max-height:68px; margin-left:10px; margin-top:3px; float:left; overflow:hidden;
    /* rounded corner */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border: 2px solid #333333;
    }
    
.EmployeeName
{
    width:65%; 
    height:35px; 
    margin-left:10px; 
    margin-top:15px; 
    float:left; 
    font:normal 16px Arial;
    color:#5c98c2;
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;    
    }
    
.EmployeeDateFilter
{
    width:100%; 
    height:55px;
    }
    
.EmployeeDateFromTo
{
    /*width:50px;*/
    height:auto;
    float:left;
    margin-top:8px;
    margin-left:15px;
    }

.EmployeeDateBox
{
    width:115px;
    height:auto;
    float:left;
    font:normal 10px Arial;
    }
    
.ScoreCardTotalsLeft
{
    width:50%; 
    float:left;
    }

.ScoreCardTotalsRight
{
    width:50%; 
    float:right; 
    text-align:right;
    }

.ContentHeaderLink
{
    cursor:default; 
    width:80%;
    }
    
.ContentHeaderItem
{
    width:120px; 
    height:25px; 
    line-height:25px; 
    float:left; 
    margin-left:16px;
    }

.ContentHeaderAmount
{
    width:115px; 
    height:25px; 
    line-height:25px; 
    float:right; 
    text-align:right;
    }
    
.ChatFilter
{
    width:200px; 
    height:55px;
    margin-left:auto;
    margin-right:auto;
    float:left;
    }
    
/************************************************************************************
SETTINGS PAGE
*************************************************************************************/

.SettingsUserPhoto
{
    width:100px; height:auto; max-height:120px; min-height:70px; margin-left:5px; margin-top:3px; float:left; overflow:hidden;
    /* rounded corner */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border: 2px solid #333333;
    }
    
.SettingsUserName
{
    width:55%; 
    height:50px; 
    margin-left:10px; 
    margin-top:5px; 
    float:left; 
    font:normal 20px Arial;
    color:#5c98c2;
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;    
    }
    
.SettingsChangePic
{
    width:115px;
    height:20px; 
    margin-left:10px; 
    margin-top:0; 
    float:left; 
    font:normal 14px Arial;
    color:#5c98c2;
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;  
    }
    
.SettingsWelcomeContainer
{
    width:100%;
    height:auto;
    }

.SettingsWelcomeText
{
    width:100%; 
    height:25px; 
    margin-left:5px; 
    margin-top:5px; 
    font:normal 20px Arial;
    color:#ffffff;
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;    
    }
    
.SettingsWelcomeSubText
{
    width:100%; 
    height:auto; 
    margin-left:5px; 
    margin-top:5px; 
    font:normal 12px Arial;
    color:#ffffff;   
    }
    
.SettingsContentContainer
{
    width:98%;
    max-width:400px;
    height:auto;
    margin-top:10px;
    background-color:#333333;
    padding:5px;
    /* rounded corner */
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border: 2px solid #333333;
    }
    
.SettingSubContentContainer
{
    margin-left:auto;
    margin-right:auto;
    width:270px;
    height:auto;
    text-align:center;
    }
    
.VerificationTbxContainer
{
    width:70px; 
    height:auto; 
    margin-top:5px;
    margin-left:auto; margin-right:auto;
    }
    
.SettingsTbxContainer
{
    width:100%; 
    height:auto; 
    margin-top:5px;
    margin-left:auto; margin-right:auto;
    }
    
.SettingsHideControl
{
    visibility:hidden;
    width:0px; 
    height:0px;
    }
    
a.disabled {
  opacity: 0.5;
  pointer-events: none;
  cursor: default;
}

.VerifyButtonsContainer
{
    width:100px; 
    height:auto; 
    margin-top:5px;
    float:left;
    }
    
.settingsShiftTbx
{
    width:220px; 
    height:40px; 
    float:left; 
    margin-top:10px; 
    }
    
.settingsShiftRemove
{
    width:30px; 
    height:45px; 
    float:left;
    margin-top:5px; 
    margin-left:5px; 
    }
    
    
/************************************************************************************
INVENTORY PAGE
*************************************************************************************/

.InventoryMenuBtn
{
    width:146px; 
    height:144px; 
    margin:2px;
    float:left;
    background-color: #1f2022;
    border:1px solid #3e3f3f;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
    }
    
.InventoryDDLContainer
{
    width:50%;
    height:auto;
    float:left;
    }
    
.InventorySearchContainer
{
    width:100%;
    height:auto;
    margin-left:5px; 
    margin-bottom:2px;
    }
 
/*
.InventoryFooterContainer
{    
    width:450px; 
    max-width:450px; 
    height:48px; 
    position: absolute; 
    bottom: 0px; 
    background-color:#333333;
    }
*/
    
.InventoryFooterLeft
{
    width:49%;
    height:32px;
    float:left;
    padding:2px;
    }
    
.InventoryLeftDDL
{
    width:49%;
    height:auto;
    float:left;
    }

/* FLOATING FOOTERS (BETA) */
footer {
    background-color: rgba(19,20,21, 0.8);
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
    height: 50px;
}
.footerButtonContainer
{
    max-width:450px; 
    margin-left:auto; 
    margin-right:auto;
}