@import url("w3.css?version=0.002");
* { font-family: "arial"; font-size: 8pt; color: #ddeecc}
table { empty-cells:show; }
img { display: inline-block; }          
textarea, input { margin: 2px 0px 0px 0px; border: 2px inset #CCC; }
form {display: inline; }
select { margin: 2px 0px 0px 0px; border: 2px outset #CCC; }
textarea:disabled, input:disabled, select:disabled { background-color: #dddddd!important; }

img.bg {
    /*min-height: 100%;
    min-width: 1024px;
    width: 100%;
    height: 50%;
    position: center;
    top: 0;
    left: 0;*/
    width: 100%;
    z-index:-1;    
}

@media screen and (max-width: 1024px){
    img.bg {
    width: 100%;
    z-index:-1; 
    	/*left: 50%;
    	margin-left: -512px;*/ 
    }
}

body::after {
  content: '';
  display: block;
  height: 90px; /* Set same as footer's height */
}

header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
	color: #ddeecc;
	background-color: #000; /*225 looks purply*/
	opacity: 1;
}

footer {
	position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  /*position: absolute;
  bottom: 0;
  width: 100%;*/
  height: 90px;
	color: #ddeecc;
	background-color: #555; /*225 looks purply*/
	opacity: 0.80;
}


.topnav {
  overflow: hidden;
  color: #ddeecc;
  text-align: right;
  /*background-color: #333;*/
  /*opacity:0.80;*/
}

.topnav a,span {
  float: left;
  color: #dec;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  font-weight: bold;
}

.topnav a:hover {
  background-color: #ddd;
  color: black;
}

.topnav a.active {
  background-color: #ecba22; /*burnt orange or green #4CAF50;*/
  color: white;
}

/* @import url("base.css");

background-color: #1f3864; dark 
background-color: #7f8da6; lighter
				  #ffffff; lightest            
*/

/*	Dark Green #075E3B
	Medium Green #6E8E29
	Light Green #BBD23D
	Very Light Green #E4EDB1
                                                                                 
	Dark Blue #1F3864
	Medium Blue #4D79C7           
	Light Blue #CCDDEE
	Very Light Blue #E5F1FB  
	
	Light Grey #EEEEFE                                                        
	Dark Grey #9DA8BB
	Blue Grey #74839F
*/
    
/* well status codes
	1 	#F2F2F2
	2	#F2F2F2
	3	#F2F2F2
	4	#FF9900
	5	#960000
	6	#FFEC8B
	7	#FFEC8B
	8	#FFEC8B
	9	#AAFFAA
	10	#AAFFAA
	11	black
	OM	#888888
	GW	#15AEE6
	IH 	#F2F2F2
	PD	#385723
	PM	#very light green to medium green gradient        
*/

H1, .H1 { font-family: arial; font-weight: bold; font-size: 18pt; color: #ecba22;  display: inline;}
H2, .H2 { font-family: arial; font-weight: bold; font-size: 12pt; color: #ecba22; display: inline;}
H3, .H3 { font-family: arial; font-weight: bold; font-size: 8pt; color: #ecba22; display: inline;}
.H3R { font-family: arial; font-weight: bold; font-size: 8pt; color: white; background-color: #1F3864;}
H4, .H4 { font-family: arial; font-size: 8pt; color: white; background-color: #1F3864; display: inline;}
	 
.s1 { font-size: 8pt; }
.s2 { font-size: 10pt; }
.s3 { font-size: 12pt; }
.s4 { font-size: 14pt; }
.s5 { font-size: 16pt; }             
                                           
.bd0 { border-left: 2px solid black; }
.bd1 { border-top: 2px solid black; }
.bd2 { border-right: 2px solid black; }
.bd3 { border-bottom: 2px solid black; }
.bd3x { border-bottom: 5px double black; }

.w { text-align: center; width:20px; padding:4px 0px 4px 0px;}
.w0 {	background-color: #F2F2F2; color: black;} /* search wused  to find where these are used in the code */        
.w1 {	background-color: #F2F2F2; color: black;}
.w2 {	background-color: #F2F2F2; color: black;}
.w3 {	background-color: #F2F2F2; color: black;}
.w4 {	background-color: #FF9900; color: black;}
.w5 {	background-color: #960000; color: white;}
.w6 {	background-color: #FFEC8B; color: black;}
.w7 {	background-color: #FFEC8B; color: black;}
.w8 {	background-color: #FFEC8B; color: black;}
.w9 {	background-color: #AAFFAA; color: black;}
.w10 {	background-color: #AAFFAA; color: black;}
.w11 {	background-color: black;   color: white;}
.wih {	background-color: #F2F2F2; color: black;} /* in house management */
.wpd {	background-color: #385723; color: white;} /* pre-disturbance assessment */
.wom {	background-color: #888888; color: white;} /* ongoing monitoring or 'project management' */
.wgw {	background-color: #15AEE6; color: black;} /* groundwater monitoring */
.wpm {
    background: #E4EDB1 ; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#E4EDB1 , #6E8E29); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#E4EDB1 , #6E8E29); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#E4EDB1 , #6E8E29); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#E4EDB1 , #6E8E29); /* Standard syntax */
}
.j { width: 20px; display: inline-block; text-align: left; }
.k { width: 118px; display: inline-block; text-align: right; }
.strike { background-color: #aaaaaa; }
/* Example with the <P> which is needed to make the hover part work 
<BUTTON class='actionbutton' type=\"submit\" name=\"update[]\"><P>".labels__preference('hours_update_button')."</BUTTON> */
.actionbutton {	font-weight: bold; padding:0; font-size: 10pt;	color: #075E3B;	background-color: #BBD23D; }
.actionbutton :hover { color: #E5F1FB;	background-color: #1F3864; }
.actionbutton p { padding: 5px; }


/* menu button pressed */
.mb_press {	font-weight: bold;  font-size: 10pt; padding: 0px;	color: #E5F1FB;	background-color: #1F3864; }
.mb_press :hover { color: #E5F1FB;	background-color: #1F3864; }
.mb_press p { padding: 2px 5px 2px 5px; }

/* menu button read only */
.mb_ro {	font-weight: bold;  font-size: 10pt; padding: 0px;	color: #E5F1FB;	background-color: #74839F; }
.mb_ro :hover { color: #E5F1FB;	background-color: #74839F; }
.mb_ro p { padding: 2px 5px 2px 5px; }

.mb_pending {	font-weight: bold;  font-size: 10pt; padding: 0px;	color: black;	background-color: #E4EDB1; }
.mb_pending :hover { color: #E5F1FB;	background-color: #1F3864; }
.mb_pending p { padding: 2px 5px 2px 5px; }

/* menu buttons: similar to base.css: actionbutton but thinner */
.mb { font-weight: bold; font-size: 8pt; padding: 0px;	color: #1F3864;	background-color: #EEEEFE; }
.mb :hover { color: #E5F1FB;	background-color: #1F3864; }
.mb p { padding: 2px 5px 2px 5px; }

.warning { font-weight: bold; color: #960000; background-color: white; border: 1px solid #CCC; padding: 5px 5px 5px 5px; text-align: center;} /* bold red centered boxed */

a {text-decoration:none;}/*  display: block; margin-bottom: -5px;*/
a:visited {color: #dec;}
a:link {color: #ddeecc;}
                                            
p { margin: 0px; padding: 0px; }
li { margin: 0px; padding: 0px; }  

.uninvoiced { color: #4D79C7; font-weight: bold; }
.bluey { background-color:#ccddee; }
@media print{   
	.pagestart    	{	page-break-before: always;	display:block;    }
	.invisible_print {	display:none;	}
}
@media email{    
	.invisible_print {	display:none;	}
}

[c|=red] { font-weight: normal; color: #ff0000;}
[c|=r] { font-weight: normal; color: #960000;}
[c|=b] { font-weight: normal; color: blue;}
[c|=g] { font-weight: normal; color: green;}
[c|=cyan] { font-weight: normal; color: #1ab0f0;}

[c|=p] { color:#444488; }
[c|=c_00] { color:black; } 
[c|=c_01] { color:#1f3864; }
[c|=c_02] { color:#3b5178; }
[c|=c_03] { color:#576a8b; }
[c|=c_04] { color:#74839f; }
[c|=c_05] { color:#7f8da6; }
[c|=c_06] { color:#9da8bb; }
[c|=c_07] { color:#abb4c5; }
[c|=c_08] { color:#b9c1ce; }
[c|=c_09] { color:#c7cdd8; }
[c|=c_10] { color:#d8dee9; }
[c|=c_11] { color:#e0e5ef; }
[c|=c_12] { color:#e8edf4; }
[c|=c_13] { color:#f0f4fa; }
[c|=c_14] { color:#ffffff; }     

[c|=dg] { color:#075E3B;}/* Dark Green #075E3B */
[c|=lg] { color:#BBD23D;}/* Light Green #BBD23D*/
[c|=vlg] { color:#E4EDB1;}/* Very Light Green #E4EDB1 */                  
[c|=db] { color:#1F3864;}/* Dark Blue #1F3864 */
[c|=mb] { color:#4D79C7;}/* Medium Blue #4D79C7 */      
[c|=lb] { color:#CCDDEE;}/* Light Blue #CCDDEE */
[c|=vlb] { color:#E5F1FB;}/* Very Light Blue #E5F1FB */  

.b { font-weight: bold; }
/* banked time spreadsheet */

[b|=wotd] { background-color: #f4b183; } /* weekly ot is greater than daily */
[b|=grey] { background-color: #EEEEFE; } /* normal hours */
[b|=wot] { background-color: #ffcccc; color: #cc2222;} /* weekly overtime */
[b|=vhr] { background-color: #ffc000; color: black;} /* vacation  hours */
[b|=bkhr] { background-color: #00b0f0; color: black;} /* banked  hours */
[b|=s] { background-color: #7030a0; color: yellow;} /* sick  day */
[b|=st] { background-color: #ffff00; color: black;} /* statutory holiday */
[b|=chrg] {color: #00b0f0; background-color: white;} /* chargeability */
[b|=bkminor] { background-color: #b4c7e7; color: black;}
[b|=bkmajor] { background-color: #8faadc; color: black;}
[b|=vminor] { background-color: #f4fdc1; color: black;}
[b|=vmajor] { background-color: #c5e0b4; color: black;}
[b|=f] { background-color: black; color: white;} /* total POT */

[b|=to] { background-color: red; color: white;}
[b|=r] { background-color: red;}
[b|=b] { background-color: blue;}
[b|=g] { background-color: #0f0;}
[b|=gd] { background-color: #4a4;}
[b|=y] { background-color: #ff0;}
[b|=b_00] { background-color: black; } 
[b|=b_01] { background-color: #1f3864; }
[b|=b_02] { background-color: #3b5178; }
[b|=b_03] { background-color: #576a8b; }
[b|=b_04] { background-color: #74839f; }
[b|=b_05] { background-color: #7f8da6; }
[b|=b_06] { background-color: #9da8bb; }
[b|=b_07] { background-color: #abb4c5; }
[b|=b_08] { background-color: #b9c1ce; }
[b|=b_09] { background-color: #c7cdd8; }
[b|=b_10] { background-color: #d8dee9; }
[b|=b_11] { background-color: #e0e5ef; }
[b|=b_12] { background-color: #e8edf4; }
[b|=b_13] { background-color: #f0f4fa; }
[b|=b_14] { background-color: #ffffff; }
[bo|=t] { border-top: 1px solid black;}

[b|=dg] { background-color:#075E3B;}/* Dark Green #075E3B */
[b|=lg] { background-color:#BBD23D;}/* Light Green #BBD23D*/
[b|=vlg] { background-color:#E4EDB1;}/* Very Light Green #E4EDB1 */                  
[b|=db] { background-color:#1F3864;}/* Dark Blue #1F3864 */
[b|=mb] { background-color:#4D79C7;}/* Medium Blue #4D79C7 */      
[b|=lb] { background-color:#CCDDEE;}/* Light Blue #CCDDEE */
[b|=vlb] { background-color:#E5F1FB;}/* Very Light Blue #E5F1FB */  


[g|=tight] {border-collapse: collapse; border-spacing: 0;}
[g|=loose] {border-collapse: separate;}
[g|=slim] {margin:0px; padding:0px;}
[g|=hang] {padding-left: 3.0em; text-indent: -3.0em;}


[r|=ti] {	font-family: "arial";	font-size:8pt;	font-weight: normal;	color: #888888 }
.r { text-align: right; }
[r|=r] { text-align: right; }
[r|=l] { text-align: left; }
[r|=b] { vertical-align: bottom; }
[r|=t] { vertical-align: top; }
[r|=c] { vertical-align: middle; }
[r|=ce] { text-align: center; }
.hr { text-align: right; }
.hl { text-align: left; }
.vb { vertical-align: bottom; }
.vt { vertical-align: top; }

[r|=delete] { background-color: red; color: white; }
[r|=notemplateactive] { background-color: #4D79C7; color: #CCDDEE; }
[r|=clear] { background-color: white;}
[r|=safety] { background-color: #ffdd88;}
[r|=stats] { background-color: #ddff88;}
[r|=files] { background-color: #decaff;}
[r|=main] { font-weight: normal; color: #1F3864; background-color: #EEEEFE; }
[r|=hi]:hover {  color: #E5F1FB; background-color: #1F3864; }
[r|=hilite] { font-weight: bold; color: #E5F1FB; background-color: #1F3864;}
[r|=error] { background-color: #ff0000;}
[r|=good] { background-color: #00ff00;}
[r|=resource] { background-color: #f4da81;}
[r|=expense] { background-color: #ffaaaa;}
[r|=profit] { background-color: #aaffaa;}
[v|=hide] {  display: none; }
[v|=show] {  display: block; }
[v|=inline] { display: inline-block; }

[w|=w7] {  width: 7px; }


/* used like a variable in a program:: r is rollytype  sample:  <BUTTON class=acbut r=files
these are attribute match types.
r|= whole match
r$= ends with
r^= starts with
r*= contains string
*/
.files {background-color:#decaff;}
.fixed { position: fixed; }
.absolute { position: absolute; }
.static { position: static; }
.relative { position: relative; }

.indent { padding-left: 10px }
.hanging { text-indent: -10px ; }
.hanging2 {padding: 0px 0px 0px 10px;text-indent:-10px}


