body 
{
  background-image: url(../images/background.jpg);
  font-family:       verdana, arial, helvetica, sans-serif;
  font-size:         10pt;
  color:             #000000;
  margin-top:        0px;
  margin-right:      0px;
  margin-bottom:     0px;
  margin-left:       0px;
  margin-height:     0px;
  margin-width:      0px;
}

h1 {font-family:verdana, arial, helvetica, sans-serif; font-size:20pt; color:#000000;} 
h2 {font-family:verdana, arial, helvetica, sans-serif; font-size:15pt; color:#000000;} 
h3 {font-family:verdana, arial, helvetica, sans-serif; font-size:12pt; color:#000000;} 
h4 {font-family:verdana, arial, helvetica, sans-serif; font-size:10pt; color:#000000;} 

hr
{
  border-top: 1px solid #ccc;
  border-bottom: 0px solid #ccc;	
}

fieldset        
{
  padding:       0px 5px 5px 5px;
	margin:        0px 0px 0px 5px;
  border:        1px solid #ccc;
  border-radius: 5px;	
  dXisplay:       inline-block;	
	display:       block;
}

legend         
{
  font-family:       verdana, arial, helvetica, sans-serif;
  font-size:         10pt;
  font-weight:       bold;	
  color:             navy;
  padding:           0px 2px 0px 2px;
  margin:            5px 10px 0px 10px;
}

fieldset fieldset 
{
  padding:       5px 5px 5px 5px;
	margin:        0px 0px 0px 0px;
  border:        1px solid gray;
  border-radius: 5px;	
	display:       block;
}

p 
{
  font-family:       verdana, arial, helvetica, sans-serif;
  font-size:         10pt;
  color:             #000000;
	padding:           0px;
  margin:            0px;		
}

caption 
{
  caption-side: top;
  text-align :  left; 			
}

/*border-spacing dont work on IE, so I used <table cellspacing="1px">*/
table
{ 
  font-family:       verdana, arial, helvetica, sans-serif;
  font-size:         10pt;
  color:             #000000;
	padding:           0px;
  margin:            0px;		
  border-width:      0px;
  border-color:      green;
  border-style:      solid;
  border-spacing:    1px ;
  border-collapse:   separate;	
  cXellspacing:      10px ;	
}

/*for IE*/
table table td
{
  text-align:       left; 		
}

tr
{
	padding:           0px 0px 0px 0px;
  margin:            0px 0px 0px 0px;
  border-width:      0px;
  border-color:      yelow;
  border-style:      solid;
  height:            20px;		
  white-space:       nowrap;	
}

th    
{
  font-family:       verdana, arial, helvetica, sans-serif;
  font-size:         10pt;
	color:             #0000ff; 
	background-color:  #ffffd2;
	padding:           0px 5x 0px 5px;	
  height:            30px;		
}

td
{
  font-family:       verdana, arial, helvetica, sans-serif;
  font-size:         10pt;
  color:             #000000;
	padding:           0px 3px 0px 3px;	
  margin:            0px;
  border-width:      0px;
  border-color:      red;
  border-style:      solid;
  tXext-align :      left; 		
}

form
{
  padding:           0px 0px 0px 0px;
  margin:            0px 0px 0px 0px;
  border-width:      0px;
  border-color:      red;
  border-style:      solid;	
}

input[type="text"],[type="password"]
{
  font-family:       verdana, arial, helvetica, sans-serif;
  font-size:         10pt;
  color:             #000000;    
	width:             auto;
  height:            19px;	
	padding :          0px 2px 0px 2px;		
	margin :           0px 0px 0px 0px;
  border-width:      0px;
  border-color:      #72a4e0;
  border-style:      solid;
  line-height:       150%;	
}
/*
input[type=text]:hover
{
  background-color: lightblue;
  bXackground-color: powderblue;
  transition: background-color .5s;	
}
*/

/*dont work in IE*/
input[type=text]:focus
{
  outline:    2px solid #72a4e0; 
  background: #a4ffff;	
}

/*dont work in IE*/
input[type=text]:disabled
{
  color:            gray; 
  background-color: lightgray;	
  pointer-events:   none;	
  cursor:           not-allowed;	
  outline:          none;	
}

/*
dont work in IE
border
*/
input[type="button"]
{
  font-family : verdana, arial, helvetica, sans-serif;
  font-size :   10pt;
  color :       #000000;
  width :       60px;	
  height :      24px;		
  text-align :  center; 	
  cursor :      pointer;	
  bXorder-width: 1px;
  border-color: #72a4e0;
  border-style: solid;
	padding :     0px 0px 0px 0px;		
	margin :      1px 1px 0px 0px;
  display :     inline-block;
  border-radius: 5px;
}
.button1
{
  font-family : verdana, arial, helvetica, sans-serif;
  font-size :   10pt;
  color :       #000000;
  width :       60px;	
  height :      24px;		
  text-align :  center; 	
  cursor :      pointer;	
  bXorder-width: 1px;
  border-color: #72a4e0;
  border-style: solid;
	padding :     0px 0px 0px 0px;		
	margin :      1px 1px 0px 0px;
  display :     inline-block;
  border-radius: 5px;
}

input[type="button"]:hover
{
	font-weight:      bold;
  color:            navy;
  background-color: #ccf3ff;	
}
input[type="button"]:disabled
{
  background-color: #dddddd;
  color: gray;		
  font-weight: normal;
}
input[type="button"]:disabled:hover
{
  background-color: #dddddd;	
  color: gray;		
  font-weight: normal;
  cursor :      not-allowed;		
}



/*
input:disabled
{
  background: cyan;	
  color: gray;		
  font-weight: normal;
}
input[type=text]:enabled {
  background: #ffff00;
}

input[type=text]:disabled {
  background: #dddddd;
}
*/






select {
    -webkit-appearance: button;
    -moz-appearance: button;
    -ms-appearance: auto;	
    appearance: auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    -webkit-padding-end: 20px;
    -moz-padding-end: 20px;
    -webkit-padding-start: 2px;
    -moz-padding-start: 2px;
    background-color: #fff;
    border: 1px solid navy;
    border-radius: 0px;
    margin: 1px 0px 1px 0px;
    pXadding: 0.3em 1.5em 0.3em 0.6em;
    padding: 1px;
    white-space: nowrap;
    font-family:       verdana, arial, hlevetica, sans-serif;
    font-size:         10pt;
    color:             #0000ff;  
    overflow: auto;
    bXox-shadow: inset 1px 1px 2px green;	
    bXox-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    fXont-size: inherit;
    tXext-overflow: ellipsis;
    bXackground-position: center right;
    bXackground-repeat: no-repeat;	
    dXisplay: block;
    hXeight: 100pt;
    lXine-height: 30pt;		
    outline: 0;
}

select:hover {border: 1px solid #72a4e0;} 	
select:focus {border: 1px solid green;} 		

select:disabled 
{
  background-color: #ccc;	
  color:            gray;		
  cursor :          not-allowed;		
} 	

select:disabled:hover
{
  background-color: #DCDCDC;   /*gainsboro, ok in FF & IE*/
  color:            #ffffff;   /*white, ok in FF only*/	 
} 	

select option 
{ 
  height: 15px; 		
  padding : 1px 0px;
  margin : 0px;	
}	

select option:hover {background-color: #87CEFA;}   /*light sky blue, ok in FF & IE*/ 	
select option:checked {background-color: #00BFFF;}   /*deep sky blue, ok in IE only*/ 	
select option:hover:checked {background-color: #000080;}   /*navy, ok in IE only*/ 	

/*firefox, edge, chrome only--------------------------------------------------*/
input[type="radio"] {
    background-color: none;
    border-radius: 10px;
    box-shadow: inset 0 1px 3px hsla(0,0%,0%,.9);
    cursor: pointer;
    display: inline-block;
    height: 15px;
    width: 15px;
    margin-right: 5px;		
    position: normal;
    -webkit-appearance: none; 
    top: 0px;
}
/*2021-05-04 position: relative to normal above*/

input[type="radio"]:after {
    background-color: #ccc;
    border-radius: 5px;
    box-shadow: inset 0 0 0 1px hsla(0,0%,0%,.4),
                0 1px 1px hsla(0,0%,100%,.8);
    content: '';
    display: block;
    width: 7px;
    height: 7px;
    position: relative;
    left: 4px;
    top: 4px;
}
input[type="radio"]:checked:after {
    background-color: black;
    box-shadow: inset 0 0 0 1px hsla(0,0%,0%,.4),
                inset 0 2px 2px hsla(0,0%,100%,.4),
                0 1px 1px hsla(0,0%,100%,.8),
                0 0 2px 2px hsla(0,70%,70%,.4);
}
input[type="radio"]:disabled {background-color: #ccc; cursor: none;}
input[type="radio"]:disabled:after {display: none; cursor: none;}
input[type="radio"]:focus {box-shadow: 0 0 0 4px green;}
input[type="radio"]:enabled:hover {box-shadow: 0 0 0 1px navy; background-color: #ccf3ff;}	
/*firefox, edge, chrome only--------------------------------------------------*/
/*2021-05-10 disabled*/
iXnput[type="checkbox"] {
    background-color: #ccc;
    border: 1px solid black;		
    box-shadow: inset 0 1px 3px hsla(0,10%,10%,1);
    cursor: pointer;
    display: inline-block;
    height: 15px;
    width: 15px;
    margin-right: 5px;		
    position: relative;
    -webkit-appearance: none; 
}
input[type="checkbox"]:after {
    content: '';
    display: block;
}
input[type="checkbox"]:checked:after {
  position: relative;	
  left: 3px;
  top: 0px;
  width: 4px;
  height: 9px;
  border: solid black;
  border-width: 0 2px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
input[type="checkbox"]:focus {box-shadow: 0px 0px 5px 5px green}
input[type="checkbox"]:enabled:hover {box-shadow: 0px 0px 5px 5px green; background-color: #ccf3ff;}