.navbar-custom {
/* old design

   background: rgb(9,26,121);
   background: linear-gradient(180deg, rgba(9,26,121,1) 0%, rgba(10,25,135,1) 35%);
   border-bottom: 3px solid#ebad11;
   color: #ffffff;
   */


  /* new design  */
   background: #1A1848;
   background: linear-gradient(180deg, #1A1848 0%, #1A1848 35%);
   border-bottom: 3px solid#AD8831;
   color: #ffffff;
}


.card-Custom {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 0.25rem;
}

.dropdown-menu .dropdown-header {
  color: #020911;
}

.dropdown-item-Custom {
  color: #dee2e6;
}

 .dropdown-item-Custom:hover, .dropdown-item-Custom:focus {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.15);
}

 .dropdown-item-Custom.active,.dropdown-item-Custom:active {
  color: #fff;
  background-color: #2fa4e7;
}

  .dropdown-item.disabled,.dropdown-item:disabled {
  color: #adb5bd;
}

.dropdown-menu-custom {
  position: absolute;
  z-index: 1000;
  display: none;
  min-width: 10rem;
  padding: 0.5rem 0;
  margin: 0;
  font-size: 1rem;
  color: #495057;
  text-align: left;
  list-style: none;
  background-color: red;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0.25rem;
}

.icon {
            padding: 10px;
            min-width: 80px;
        }

        .input-icons {
            width: 100%;
            margin-bottom: 10px;
        }

.inputstl{ 
    padding: 9px; 
    border: solid 1px #4B718B; 
    outline: 0; 
    background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #CDDBE4), to(#FFFFFF)); 
    background: -moz-linear-gradient(top, #FFFFFF, #CDDBE4 1px, #FFFFFF 25px); 
    box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; 
    -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; 
    -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    min-width: 500px;
    height: 40px; 
    }   

   
    .inactive_tab1{color:#020911;}

        table { 
        width: 100%; 
        border-collapse: collapse; 
      }
      /* Zebra striping */
      tr:nth-of-type(odd) { 
        background: #eee; 
      }
      table.dataTable tr:nth-of-type(odd) { 
        background: #eee; 
      }
      th { 
        background: #96bff4;; 
        color: #020024;
         border: 1px solid #ababab;
        font-weight: bold; 
      }
      td, th { 
        padding: 6px; 
        border: 1px solid #ababab; 
        text-align: left; 
      }
  .validation-sgi0{
    background-color:#e8e8f1;
    margin-top: 1px;
     
   }
   .validation-sgi1{
    background-color:#c6c4e4;
    margin-top: 1px;
    
   }
   .text-sgi
   {
   padding-left:20px;
     
   }

  .bg-sgi {
    background-color:#9691f1 !important; 
        color: #ffffff !important;
         border: 20px solid #ccc; 
        font-weight: bold;
        font-size:14px;   
  }
  .label-sgi{
    font-weight: bold;
    font-size:11px ;
    color:#292b2c;
  }
  .panel-sgi
    {
      background:#d8d8df;
      border: 1px solid rgb(160, 161, 245);
      min-width:100%; 
    }
    .btn-sgi {
      background: -webkit-gradient(linear, left top, left 25, from(#afaeae), color-stop(4%, #CDDBE4), to(#FFFFFF)); 
      background: -moz-linear-gradient(top, #afaeae, #CDDBE4 0px, #FFFFFF 25px);        
      border-radius: 8px;
      border: 1px solid #8a71ce;
      color: #0a0a0a;       
      text-align: center;         
      font-size: 12px;
      font-weight: bold;
      min-width:18%;
      min-height:35px;
      
    }
    .add{      
      text-align:right;
      font-size: 25px;
      font-weight: bold;
      color: #f9fff9;
      margin-right: 2%;    
    }
   
    .field-sgi
    {
     border:1px solid #9c9c9ee0;
     font-size: 14px;
     
    }
    .heading-sgi
    {
      font-size: 20px;
      font-weight: bold;
      border: 1px solid rgb(160, 161, 245) !important;
    }
    .img-employee
    {
     background: #c7c4c4;
     min-width:  175px;
     min-height: 200px;
     border: 3px solid #ffffff !important;
     margin-top: 20px;
    }
    .img-employee img
    {
       width: 100%;
       height: 100%;
    } 
 
  
.reset-this {
  all: initial;
}
.fieldset-sgi {
  border: 1px solid #818181;
  padding : 10px;
  width: 98%;
  font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, Arial, Helvetica, sans-serif;
} 
.legend-sgi {
  color: rgb(12, 2, 104);
   font-size: 20px;
  font-weight: bold;
} 

      @media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
    padding-left: 50%; 
    font-size: 8px;
  }
   
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
  }

 
  	/*
	Label the data
	*/
}
.bs-select
{
  background-color:red;
}