/* unvisited link */
a:link {
    /*color: black;*/
	text-decoration: underline;
}

/* visited link */
a:visited {
    color: green;
}



.clsPageBody {
	background-color:#ffffff;
      width: 99%;
      height: 100%;
      text-align: left;
      font-size : medium; 
      font-family : Arial, Helvetica, sans-serif 

}



.clsPageTable {
      width: 90%;
      max-width: 700px;
}


.clsAlways-at-bottom {
    /* Image bottom of page */
    height:125px;
    position: fixed;
    left: 0;
    bottom: -1%;
    width: 100%;
    z-index: 1000;
    background-color: white;
}



.clsNotifyOverlay { 
	z-index:1000; 
	position:absolute; 
	top:0; 
	bottom:0; 
	left:-4000; 
	width:100%; 
	height:100%; 
	background:#ffffff; 
	opacity:1;  
	-moz-opacity:1; 
	filter:alpha(opacity=100); 
	/*visibility:hidden;*/ 
} 


.clsAlertOverlay { 

	z-index:1021; 
	position:fixed; 
	/*bottom:0;*/ 

   top: 10%;
    
   /*
   transform:translateY(-50%);
   -webkit-transform:translateY(-50%);
   -o-transform:translateY(-50%);
    */
   /*border: 1px solid #000000;*/

    left: -4000px;
	width:90%; 
    margin-left:5%;
	background-color:#ffffff;
	opacity:1;  
	-moz-opacity:1; 
	filter:alpha(opacity=100); 
    /*background-color: rgba(0,0,0,0.5); */ /*dim the background*/

    -webkit-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 20px 1px rgba(0,0,0,0.75);

      border-radius:15px;

 	} 



.clsPopMessageOverlay { 

	z-index:1030; 

    position: absolute;
    top: 10%;
    left: -400%;
    width: 80%;

	background-color: #94DA2C;

	opacity:1;  
	-moz-opacity:1; 
	filter:alpha(opacity=100); 
    /*background-color: rgba(0,0,0,0.5); */ /*dim the background*/

    -webkit-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 20px 1px rgba(0,0,0,0.75);

    border-radius:15px;
 	} 


.clsBackgroundTint{
    left:-4000px;
    position:fixed;
    z-index:1020;
    width:100vw;
    height:100vh;
    top:0;
    background-color:rgba(0,0,0,0.5);

    position:fixed;
    left:0;
    top:0;
}

	
.clsScanOverlay { 

	z-index:1001; 
	position:absolute; 
	/*bottom:0;*/ 

   top: 30%;
   border: 1px solid #000000;

    left: -4000px;
	width:100%; 
	background:#666666; 
	opacity:1;  
	-moz-opacity:1; 
	filter:alpha(opacity=100); 

 	} 	
	

.clsRecentSlipsOverlay { 
	z-index:1000; 
	position:absolute; 
	top:0; 
	bottom:0; 
	left:-4000; 
	width:100%; 
	height:100%; 
	background:#ffffff; 
	opacity:1;  
	-moz-opacity:1; 
	filter:alpha(opacity=100); 
	/*visibility:hidden;*/ 
} 


.clsBarcodeOverlay { 

	z-index:1000; 
	position:absolute; 
	top:0; 
	bottom:0; 
	left:-4000; 
	width:100%; 
	height:100%; 
	background:#ffffff; 
	opacity:1;  
	-moz-opacity:1; 
	filter:alpha(opacity=100); 


    /*visibility:hidden;*/ 
} 


.clsRegisterOverlay { 

	z-index:1000; 
	position:absolute; 
	top:0; 
	bottom:0; 
	left:-4000; 
	width:100%; 
	height:100%; 
	background:#ffffff; 
	opacity:1;  
	-moz-opacity:1; 
	filter:alpha(opacity=100); 


    /*visibility:hidden;*/ 
} 

/******************************************************
 * iSCROLL SCROLLBAR
 *
 * Horizontal Scrollbar
 *
 */
.myScrollbarH {
	position:absolute;
	z-index:100;
	height:8px;
	bottom:1px;
	left:2px;
	right:7px
}

.myScrollbarH > div {
	position:static;
	z-index:100;
	height:100%;

	/* The following is probably what you want to customize */
	background-image:-webkit-gradient(linear, 0 0, 100% 0, from(#a00), to(#f00));
	background-image:-moz-linear-gradient(top, #f00, #900);
	background-image:-o-linear-gradient(top, #f00, #900);

	border:1px solid #900;
	-webkit-background-clip:padding-box;
	-moz-background-clip:padding-box;
	-o-background-clip:padding-box;
	background-clip:padding-box;
	
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
	
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-o-border-radius:4px;
	border-radius:4px;
	
	-webkit-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	-moz-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	-o-box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
	box-shadow:inset 1px 1px 0 rgba(255,255,255,0.5);
}


/**
 *
 * Vertical Scrollbar
 *
 */

 /*
 body,ul,li {
	padding:0;
	margin:0;
	border:0;
}

body {
	font-size:12px;
	-webkit-user-select:none;
    -webkit-text-size-adjust:none;
	font-family:helvetica;
}
*/

#header {
	position:absolute; z-index:2;
	top:0; left:0;
	width:100%;
	height:35px;
	line-height:35px;
	background-image:-webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #C6E49F), color-stop(0.05, #79B734), color-stop(1, #42790F));
	background-image:-moz-linear-gradient(top, #C6E49F, #79B734 5%, #42790F);
	background-image:-o-linear-gradient(top, #C6E49F, #79B734 5%, #42790F);
	padding:0;
	color:#eee;
	font-size:20px;
	text-align:center;
}

#header a {
	color:#f3f3f3;
	text-decoration:none;
	font-weight:bold;
	text-shadow:0 -1px 0 rgba(0,0,0,0.5);
}

#footer {
	position:absolute; z-index:2;
	bottom:0; left:0;
	width:100%;
	height:35%;
	/*
	background-image:-webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #999), color-stop(0.02, #666), color-stop(1, #222));
	background-image:-moz-linear-gradient(top, #999, #666 2%, #222);
	background-image:-o-linear-gradient(top, #999, #666 2%, #222);
	*/

	background-image:-webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #ffffff), color-stop(0.02, #ffffff), color-stop(1, #ffffff));
	background-image:-moz-linear-gradient(top, #ffffff, #ffffff 2%, #ffffff);
	background-image:-o-linear-gradient(top, #ffffff, #ffffff 2%, #ffffff);

	padding:0;
/*	border-top:1px solid #444;*/
}

#wrapper {
	position:absolute; z-index:1;
	top:35px; bottom:165px; left:0;
	width:100%;
	height: 55%;
	background:#aaa;
	overflow:auto;
}

#scroller {
	position:absolute; z-index:1;
/*	-webkit-touch-callout:none;*/
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	width:100%;
/*	height: 70%; */
	padding:0;
}

#scroller ul {
	list-style:none;
	padding:0;
	margin:0;
	width:100%;
/*	height: 70%; */
	text-align:left;
}

#scroller li {
	padding:0 10px;
	height:40px;
	line-height:40px;
	border-bottom:1px solid #ccc;
	border-top:1px solid #fff;
	background-color:#ffffff;
	font-size:14px;
}



/*****************************************************/

/**/

.test {
  position: absolute;
  left: 20px;
  right: 20px;
  top: 20px;
  bottom: 60px;
  border: 1px solid #f4f4f4;
}



.turnPortrait {

    /* TURN A LANDSCAPE PHOTO UPRIGHT / PORTRAIT */

   -webkit-transform: 90deg;
   -moz-transform: 90deg;
   transform: 90deg;

}