html
{ height: 100%;
zoom: 80%;
}

*
{ margin: 0;
  padding: 0;}

body
{ font: normal .80em 'trebuchet ms', arial, sans-serif;
  background: #fff;
  color: #777;}

p
{ padding: 0 0 20px 0;
  line-height: 1.7em;}

img
{ border: 0;}

h1, h2, h3, h4, h5, h6 
{ font: normal 175% 'century gothic', arial, sans-serif;
  color: #43423F;
  margin: 0 0 15px 0;
  padding: 15px 0 5px 0;}

h2
{ font: normal 175% 'century gothic', arial, sans-serif;
  color: #A4AA04;}

h4, h5, h6
{ margin: 0;
  padding: 0 0 5px 0;
  font: normal 120% arial, sans-serif;
  color: #A4AA04;}

h5, h6
{ font: italic 95% arial, sans-serif;
  padding: 0 0 15px 0;
  color: #000;}

h6
{ color: #362C20;}


a, a:hover
{ outline: none;
  text-decoration: none;
  color: #1293EE;}

a:hover
{ text-decoration: underline;}

.current{ 
    text-decoration: underline;  
  }


.left
{ float: left;
  width: auto;
  margin-right: 10px;}

.right
{ float: right; 
  width: auto;
  margin-left: 10px;}

.center
{ display: block;
  text-align: center;
  margin: 20px auto;}

blockquote
{ margin: 20px 0; 
  padding: 10px 20px 0 20px;
  border: 1px solid #E5E5DB;
  background: #FFF;}

ul
{ margin: 2px 0 22px 17px;}

ul li
{ list-style-type: circle;
  margin: 0 0 6px 0; 
  padding: 0 0 4px 5px;}

ol
{ margin: 8px 0 22px 20px;}

ol li
{ margin: 0 0 11px 0;}

#main, #logo, #menubar, #site_content, #footer
{ margin-left: auto; 
  margin-right: auto;}

#header
{ background: #042459;
  height: 155px;}

#logo
{ width: 825px;
  position: relative;
  height: 150px;
  background: #025587 url(logo3.png) no-repeat;}

#logo #logo_text 
{ position: absolute; 
  top: 20px;
  left: 0;}

#logo h1, #logo h2
{ font: normal 300% 'century gothic', arial, sans-serif;
  border-bottom: 0;
  text-transform: none;
  margin: 0;}

#logo_text h1, #logo_text h1 a, #logo_text h1 a:hover 
{ padding: 22px 0 0 0;
  color: #FFF;
  letter-spacing: 0.1em;
  text-decoration: none;}

#logo_text h1 a .logo_colour
{ color: #80FFFF;}

#logo_text h2
{ font-size: 100%;
  padding: 4px 0 0 0;
  color: #DDD;}

#menubar
{ width: 877px;
  height: 72px;
  padding: 0;
  background: #29415D url(menu.png) repeat-x;} 

ul#menu, ul#menu li
{ float: left;
  margin: 0; 
  padding: 0;}

ul#menu li
{ list-style: none;}

ul#menu li a
{ letter-spacing: 0.1em;
  font: normal 100% 'lucida sans unicode', arial, sans-serif;
  display: block; 
  float: left; 
  height: 37px;
  padding: 29px 26px 6px 26px;
  text-align: center;
  color: #FFF;
  text-transform: uppercase;
  text-decoration: none;
  background: transparent;} 

ul#menu li a:hover, ul#menu li.selected a, ul#menu li.selected a:hover
{ color: #FFF;
  background: #1C2C3E url(menu_select.png) repeat-x;}

#site_content
{ width: 1430px;
  overflow: hidden;
  margin: 0 auto 0 auto;
  padding: 20px 24px 20px 37px;
  background-color: #fff;
} 

.sidebar
{ float: right;
  width: 190px;
  padding: 0 15px 20px 15px;}

.sidebar ul
{ width: 178px; 
  padding: 4px 0 0 0; 
  margin: 4px 0 30px 0;}

.sidebar li
{ list-style: none; 
  padding: 0 0 7px 0; }

.sidebar li a, .sidebar li a:hover
{ padding: 0 0 0 40px;
  display: block;
  background: transparent url(link.png) no-repeat left center;} 

.sidebar li a.selected
{ color: #444;
  text-decoration: none;} 

#content
{ text-align: left;
  width: 895px;
  padding: 0;}

#content ul
{ margin: 2px 0 22px 0px;}

#content ul li
{ list-style-type: none;
  background: url(bullet.png) no-repeat;
  margin: 0 0 6px 0; 
  padding: 0 0 4px 25px;
  line-height: 1.5em;}

#footer
{ width: 100%;
  font: normal 100% 'lucida sans unicode', arial, sans-serif;
  height: 50px;
  padding: 24px 0 5px 0;
  text-align: center; 
  background: url(footer.png) repeat-x;
  color: #FFF;
  text-transform: uppercase;
  margin-top: 100px;
  letter-spacing: 0.1em;}

#footer a
{ color: #FFF;
  text-decoration: none;}

#footer a:hover
{ color: #FFF;
  text-decoration: underline;}

.search
{ color: #5D5D5D; 
  border: 1px solid #BBB; 
  width: 134px; 
  padding: 4px; 
  font: 100% arial, sans-serif;}

.form_settings
{ margin: 15px 0 0 0;}

.form_settings p
{ padding: 0 0 4px 0;}

.form_settings span
{ float: left; 
  width: 200px; 
  text-align: left;}
  
.form_settings input, .form_settings textarea
{ padding: 5px; 
  width: 299px; 
  font: 100% arial; 
  border: 1px solid #E5E5DB; 
  background: #FFF; 
  color: #47433F;}
  
.form_settings .submit
{ font: 100% arial; 
  border: 1px solid; 
  width: 99px; 
  margin: 0 0 0 212px; 
  height: 33px;
  padding: 2px 0 3px 0;
  cursor: pointer; 
  background: #263C56; 
  color: #FFF;}

.form_settings textarea, .form_settings select
{ font: 100% arial; 
  width: 299px;}

.form_settings select
{ width: 310px;}

.form_settings .checkbox
{ margin: 4px 0; 
  padding: 0; 
  width: 14px;
  border: 0;
  background: none;}

.separator
{ width: 100%;
  height: 0;
  border-top: 1px solid #D9D5CF;
  border-bottom: 1px solid #FFF;
  margin: 0 0 20px 0;}
  











#tab1{
  
    
    float: left;
    width: 0%;
    
    height: 250px;
  }

  #tab2{
    
    border-radius: 20px 0 0 20px ;
    float: left;
    width: 100%;
    
    height: auto;
  }

  #tab2 a{
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    font-size: 16px;
  }

  #tab2 a:hover{
    color: #FFE700;
    
  }
  #tab2 .current{
    color: #FFE700;
    
    
  }




  #tab3{
    
 
    float: left;
    
    width: 100%;
    
    height: auto;
  }



  #tab5{
  
    
    float: left;
    width: 50%;
    
    
    height: auto;
  }

  #tab6{
    
    
    float: left;
    width: 50%;
    
    
    height: auto;
  }

  #tab7{
    
    
    float: left;
    width: 0%;
    
    height: auto;
  }


  #tab8{
    
    
    width: 100%;
    
    height: auto;
  }


#clear{
    clear: both;
    

  }






  #record1 table {
  border-collapse: collapse;
  margin: 10px;
  max-width: 1080px;


}
#record1 tr { background: #CFCFCF;
   color: #000000; }
#record1 tr.altrow { background: #F9F9F9; }

#record1 th {
  color: #fff;
  background: #1B7824;

  padding-top: 10px;
  padding-bottom: 10px;

    border-color: #ffd58b #D3EFC3 #ffd58b #D3EFC3;  

}
#record1 td {
  border-color: #EFEFEF;  
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 0.8em;
  font-weight: bold;

  




} 



#punch
{
background-image: url("../homepic/9.png");
background-size: 100% 100%;
background-color: transparent;

font-weight: bold;

border:0;

-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

color: #000;

cursor: pointer;

width: 90px;
height: 90px;
font-size: 15px;
}

#punch:hover {

}




#punch2
{
background-image: url("../homepic/9.png");
background-size: 100% 100%;
background-color: transparent;

font-weight: bold;

border:0;

-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

color: #000;

cursor: not-allowed;

width: 90px;
height: 90px;
font-size: 15px;
}

#punch2:hover {

}



#myDIVa1 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }

  #myDIVa2 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }

  #myDIVa3 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }

  #myDIVa4 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa5 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa6 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa7 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa8 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa9 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa10 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa11 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa12 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa13 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }
  #myDIVa14 {
    display: none;
    transition-duration: 500s, 500s;
      transition-delay: 500s, 500s;
  }




  #myDIV11 {
    width:100%;
    cursor: pointer;
  }


  #myDIV22 {
    width:100%;
    cursor: pointer;
  }

  #myDIV33 {
    width:100%;
    cursor: pointer;
  }

  #myDIV44 {
    width:100%;
    cursor: pointer;
  }

  #myDIV55 {
    width:100%;
    cursor: pointer;
  }
  #myDIV66 {
    width:100%;
    cursor: pointer;
  }

  #myDIV77 {
    width:100%;
    cursor: pointer;
  }

  #myDIV88 {
    width:100%;
    cursor: pointer;
  }

  #myDIV99 {
    width:100%;
    cursor: pointer;
  }

  #myDIV100 {
    width:100%;
    cursor: pointer;
  }
  #myDIV111 {
    width:100%;
    cursor: pointer;
  }

  #myDIV122 {
    width:100%;
    cursor: pointer;
  }

  #myDIV133 {
    width:100%;
    cursor: pointer;
  }

  #myDIV114 {
    width:100%;
    cursor: pointer;
  }


#employee_data123 {
    width:100%;
    overflow: scroll;
    
  }





#report input[type=submit] {

background-color: #FF7024;

border-color: #FF7024;

height: 22px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 0 10px;
color: #fff;

cursor: pointer;
min-width: 300px;
width: 100%;
height: 50px;
font-size: 20px;
text-align: left;
}

#report input[type=submit]:hover {
color: #333333;
background-color: #FA350A;
}



#report input[type=submit].alt_btn:hover {
color: #001217;
}



#report input[type=submit].btn_post_message:hover {
background-position: 0 -24px;
}










#report2 button[type=submit] {

background-color: #EDF2FA;
border-bottom: 0px solid black;



height: 22px;

padding: 0 10px;
color: #000;

cursor: pointer;

width: 260px;
height: 100px;
font-size: 17px;
font-weight: 700;
text-align: left;
}

#report2 button[type=submit]:hover {
color: #333333;
background-color: #E4E9F1;
}



#report2 button[type=submit].alt_btn:hover {
color: #001217;
}



#report2 button[type=submit].btn_post_message:hover {
background-position: 0 -24px;
}

















#report3 button[type=submit] {

background-color: #fff;
border-bottom: 0px solid black;



height: 22px;

padding: 0 10px;
color: #000;

cursor: pointer;

width: 260px;
height: 100px;
font-size: 17px;
font-weight: 700;
text-align: left;
}

#report3 button[type=submit]:hover {
color: #333333;
background-color: #E4E9F1;
}



#report3 button[type=submit].alt_btn:hover {
color: #001217;
}



#report3 button[type=submit].btn_post_message:hover {
background-position: 0 -24px;
}






#divNav {
  padding-left:10px;
  background: #fff;
  height: 56px;
  margin:0 auto;
}

#divNav ul {
  list-style-type: none;
}

#divNav ul li {
  float: left;
  position: relative;
}

#divNav ul li a{
  display: block;
  height: 38px;
  line-height: 18px;
  background: #1B7824;
  width: 145px;
  font-size: 0.8em;
  font-weight: bold;
  color: #fff;
  text-align: center;
  text-decoration: none;

  margin-left: 2px;
  margin-right: 2px;
  margin-top: 8px;

  border-radius:3px;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border: 1px solid #1B7824;

}


#divNav ul li a:hover{
  color: #CEFD63;
}

#divNav ul li a.current, #divNav ul li a.current:hover{
  color:  #CEFD63;
}






#divNav ul li ul {
  padding: 0;
  padding-top: 13px;
  position: absolute;
  top: 38px;
  left: 0;
  width: 150px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;

}


#divNav ul li ul li { 
  width: 150px;
  background: #ffffff; 
  display: block; 
  color: #000000;
  text-shadow: 0 0px 0 #000;
}

#divNav ul li ul li a{ 
  width: 150px;
  height: 24px;
  background: #666; 
  display: block; 
  border: 1px solid #666;
  padding-top: 3px;

}

#divNav ul li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

#table2 {
    border-collapse: collapse;


}

#table2 td, #table2 th {
    border: 1px solid #ddd;
    padding: 8px;
}


#table2 tr:hover {background-color: #ddd;}

#table2 th {
    padding-top: 6px;
    padding-bottom: 6px;
    text-align: left;
    background-color: #0d98ba;
    color: #fff;
    font-size: 1.10em;

    

}
#table2 td {

font-family: 'Russo One', sans-serif;
}















#table5 {
    border-collapse: collapse;


}

#table5 td, #table5 th {
    border: 1px solid #ddd;
    padding: 8px;
}


#table5 tr:hover {background-color: #ddd;}

#table5 th {
    padding-top: 6px;
    padding-bottom: 6px;
    text-align: left;
    background-color: #000080;
    color: #fff;
    font-size: 1.10em;

    

}
#table5 td {

font-family: 'Russo One', sans-serif;
}






input[type=submit] {
    background-color: #0d98ba;
    padding-top:10px;
    padding-bottom: 10px;
    padding-left:20px;
    padding-right: 20px;
    color:#fff;
    font-size: 1.10em;
    border-radius: 5px 5px 5px 5px;
  }

  input[type=text] {
    border-radius: 5px 5px 5px 5px;
  }

  input[type=date] {
    border-radius: 5px 5px 5px 5px;
  }

  input[type=number] {
    border-radius: 5px 5px 5px 5px;
  }

  input[type=email] {
    border-radius: 5px 5px 5px 5px;
  }

  input[type=file] {
    border-radius: 5px 5px 5px 5px;
  }

  select {
    border-radius: 5px 5px 5px 5px;
  }

  textarea {
    border-radius: 5px 5px 5px 5px;
  }