#myTable2 button:not(.btn-link){
    color: white;
    background-color: black;
    border: none;
    min-width: 100px;
   
}

#myTable2 th,td{
    min-width: 50px;
    
}


.sortorder:after {
  content: '\25b2';   /* BLACK UP-POINTING TRIANGLE */
}

.sortorder.reverse:after {
  content: '\25bc';   /* BLACK DOWN-POINTING TRIANGLE */
}

#lulul
{
	margin-left:0px!important;
}

select
{
margin-left:20px;	
}

form,#roroform
{
width:100%;
border:3px solid #AAAAAA ;
padding-left:20px;
margin-right:20px;
padding-bottom:0px;
padding-right:20px;
background-color:white;
}

table
{
    table-layout:auto;
    width:100%;
    border-collapse: collapse;
}


table, th ,td
{
    /* border: 0.5px solid black; */
    padding: 10px;
    text-align: center;
}

thead
{
    background-color:#0036bd;
    color:white;
}
	
li{list-style-type:none;}
	
	
	


h2{
	margin-top:30px;
}


	
/*label
{
	display:inline-block;
	width:130px;
	text-align:right;
	line-height:200%;
	font-weight:bold;
}*/

body{
	 margin-left: 100px;
	 
margin-top:0px;}




input[type=text],
input[type=file],
input[type=time],
textarea.form-control,
select.form-control,
input[type=date].form-control
{
	width:500px;
	vertical-align:top;
	line-height:200%;
	margin-left:20px;
}

input[type=number].form-control
{
	width:500px;
	vertical-align:top;
	line-height:200%;
	margin-left:20px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
}
input[type="number"] {
   -moz-appearance: textfield;
}


select{
	width:500px;
	height:40px;
	vertical-align:top;
	line-height:200%;
	margin-left:20px;
}

input[type=date]
{
	width:300px;
	vertical-align:top;
	line-height:200%;
	margin-left:24px;
}


in
.tru
{
	margin-left:20px;
	font-weight:bold;
}


#frmCSVImport,#nothing
{
	border-style:none!important;
}



#nono a,#nono
{
	position:absolute;
	right:170px;
	
	margin-left:-20px;
	border:none;
	background:none;
	background-color:#3b3b3b;
	color:white;
	padding:10px;
}

#frmCSVImport .form-area button
{

	margin-left:-20px;

}




#loginbody .container
{
	background-color:#D5F5E3;
	background-image: linear-gradient(30deg, #227538 , #0E5937,#0E3E37,#0E3E37, #017666);
	position:absolute;
	margin:0px;
	width:100%;
	height:100%;
	text-align:center;
	margin:0;
	padding:0;
	left:0;
	right:0;
	}

#logo
{
    display: block;
  margin-left: auto;
  margin-top:5%;
  margin-right: auto;
  
  padding-left:80px;
  padding-right:80px;
  border-radius:15px;
}

#loginhr
{
	border:0.5px solid #99D18E;
	width:490px;
	
}

#formlogin
{
    margin-top:5%;
	width:550px;
	background: rgba(0, 0, 0, 0.4);
	 display: inline-block;
	 color:white;
	 border:5px solid #99D18E;
	 border-left:5px solid #99D18E;
	 border-right:5px solid #99D18E;
	border-radius:15px;
}

#formlogin label
{
	margin-left:-370px;
}

#formlogin input[type=text],#formlogin input[type=password]
{
	width:450px;
    margin-left:auto;
    margin-right:auto;
    background: rgba(0, 0, 0, 0.3);
    border:0px solid black;
    border-bottom: 0.5px solid black;
    color:grey;
}

#formlogin input[type=text]:focus,#formlogin input[type=password]:focus
{
	width:450px;
    margin-left:auto;
    margin-right:auto;
    background: rgba(0, 0, 0, 0.6);
    border:0px solid black;
    border-bottom: 0.5px solid black;
    color:grey;
}

#loginbut{
    background-color: black;
    border:0px solid black;
    font-weight:bold;
    border-radius:5px;
    padding:5px 20px 5px 20px;
}

#loginbut:hover{
    background-color:#a9d18e;
    color:black;
    transition:background-color 1s ease;
    transition:color 0.5s ease;
}




a { 
    color: #000000; 
}




.sybut{
    color:white;
    background-color:none;
    background: rgba(0, 0, 0, 0.8);
    padding:8px 25px 8px 25px;
    border-radius:5px;
    border:0px solid black;
    margin:0;
    margin-bottom:12px;
}

.sybut:hover{
    background-image: linear-gradient(to right, #01A37E ,#00891B);
    color:white;
    text-decoration:none;
    opacity:0.7;
    transition:1s ease opacity;
    
}





.container{
    position:absolute;
    background-image: linear-gradient(210deg, #DDFFEC , white, white, white, white);
    left:240px;
    width:85%;
    top:0;
    bottom:0;
    right:0;
    margin-right:0px;
    height:100%;
    
}


.emp{
    opacity:0;
    
}


.upper_nav{
   /* background-image: linear-gradient(to right, #CBFFF3 ,#D2FFDB);*/
   /*background-image: linear-gradient(to right, #CBFFEA ,#D2FFDB); */
   background: rgba(0, 0, 0, 0.3);
    border-left:3px solid #ADADAD;
    color:white;
    font-weight:bold;
    text-decoration:none;
    padding:10px 35px 10px 35px;
    border-right:3px solid #ADADAD;
    margin:0px;
}

.upper_nav:hover{
    border-right:3px solid #01A37E;
    border-left:3px solid #01A37E;
    color:#004B0F;
    font-weight:bold;
    background:none;
    padding:10px 35px 10px 35px;
    text-decoration:none;
    transition:0.5s ease all;
    margin:0px;
}

.indexform{
    width:100%;
	border:0px solid white ;
	padding-left:20px;
	margin-right:20px;
	padding-bottom:0px;
	padding-right:20px;
	background: rgba(0, 0, 0, 0);
}

#indexbody .container{
   background-image: linear-gradient(210deg, #DDFFEC , white, white, white, white);
    margin:0;
    right:0;
}

.sybutt{
    color:white;
    background-color:none;
    background: rgba(0, 0, 0, 0.8);
    padding:8px 25px 8px 25px;
    border-radius:5px;
    border:0px solid black;
    margin:0;
    position:fixed;
    right:10px;
    bottom:10px;
    margin-bottom:12px;
    z-index:10;
}

.sybutt:hover{
    background-image: linear-gradient(to right, #01A37E ,#00891B);
    color:white;
    text-decoration:none;
    opacity:0.7;
    transition:1s ease opacity;
    
}



.bababut{
    background:rgba(0, 0, 0, 0);
    border:0;
    
}

#notetable{
    border:0;    
    border-collapse: separate;
    background-image: linear-gradient(to right, #01A37E ,#00891B);
    margin-bottom:20px;
    border-radius:10px;
    
}

#notetable td{
    border:0px solid white;
    background-color:#00891B;
    color:white;
    font-weight:bold;
    
}


#notetable .topiccc{
    
    font-weight:bold;
    text-align:right;
    background:rgba(0, 0, 0, 0);
}

#notetable .contenttd{
    text-align:center;
    border-radius:10px;
    background:rgba(255, 255, 255, 0.3);
    color:#fff;
}

#notetable .removetd{
    background:rgba(0, 0, 0, 0);
    text-align:center;
}
#notetable .notetdtd{
    vertical-align: top;
    font-weight:bold;
    background:rgba(255, 255, 255, 0.3);
    color:white;
    text-align:left;
    height:100px;
    border-radius:10px;
}

#notetable .emptytdtd{
    background:rgba(0, 0, 0, 0);
    border:0;
}


.indexh2{
    margin-bottom:20px;
    
    text-align:center;
}


#myChart1{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart2{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart3{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart4{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart5{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart6{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart7{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart8{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart9{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart10{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart11{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart12{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}
#myChart13{
		background-color:#ededed;
		border: 1px solid grey;
		margin:10px;
}



.emp{
	height:20px;
	border:1px solid white;
	border-bottom:1px solid grey;
	background-color:white;
}



.days{
	background-color:#CFF1CD;
	border:1px solid grey;
	font-weight:bold;
}

.redtd{
	background-color:#F1F16A;
	border:1px solid grey;
}

.bluetd{
	background-color:#85DF80;
	border:1px solid grey;
}


.hiding{
	display:none;
}

.removing{
    opacity:0;
}

.removingdiv{
    background-image: url("../img/delete5.gif");
    background-repeat: no-repeat;
    background-position: center;
    display:block;
}

.unremovediv{
    background-image: url("../img/delete4.gif");
    background-repeat: no-repeat;
    background-position: center;
    display:block;
}

.cdb{
    background-image: url("../img/belll.gif");
    background-repeat: repeat;
    background-position: center;
    padding-left:2px;
    padding-right:2px;
    color:white;
    font-weight:bold;
    border:1px solid white;
    border-radius:2px;
}

.blacktd{
    
    background-color:#474747;
}

.blacktd a{
    background-color:#474747;
}

.blacktdd{
    background-color:#AEAEAE;
}
/* testest*/

/* Dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a grey background color to dropdown links on hover */
.dropdown-content a:hover {
  background-color: #ddd;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/* Use for tables that could overflow out of box */
.overflow-table.row {
    overflow-x:auto;
}

.is-valid {
    color: #227538;
}

.is-invalid {
    color: crimson;
}