@font-face {
    font-family: 'HBKU';
    src: url('../fonts/HBKU-Regular.eot');
    src: url('../fonts/HBKU-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonst/HBKU-Regular.woff2') format('woff2'),
        url('../fonts/HBKU-Regular.woff') format('woff'),
        url('../fonts/HBKU-Regular.ttf') format('truetype'),
        url('../fonts/HBKU-Regular.svg#HBKU-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'HBKU';
    src: url('../fonts/HBKU-Bold.eot');
    src: url('../fonts/HBKU-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/HBKU-Bold.woff2') format('woff2'),
        url('../fonts/HBKU-Bold.woff') format('woff'),
        url('../fonts/HBKU-Bold.ttf') format('truetype'),
        url('../fonts/HBKU-Bold.svg#HBKU-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
}



 

body { font-family: HBKU; font-weight: normal;
    font-style: normal; font-size: 15px; color: #000; line-height: 1.7; }
	h1, h2, h3, h4, h5, h6 { font-weight: bold;
    font-style: normal; }
	
label {  font-weight: normal;
    font-style: normal;}	
a { color: #cc0000; }
a:hover, a:focus { color: #970001; }





.bg {
background:url(back2.jpg) no-repeat  bottom  left  ;
    
  
}


.bg1 {
  
  
}



.bgborder  { }
 
 .form-login { margin:  auto  ; float: right; width: 100%; text-align:center; padding: 50px 0 100px; }
 .logo { margin: 0 0 30px 0;}
 .main-form   { text-align: right; }
 .main-form label { text-align: right; }
.main-form {  
background: #e9e9e9; /* Old browsers */
background: -moz-linear-gradient(top,  #e9e9e9 0%,#5262ad 50%,#e9e9e9 95%,#5262ad 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #e9e9e9 0%,#5262ad 50%,#e9e9e9 95%,#5262ad 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #e9e9e9 0%,#5262ad 50%,#e9e9e9 95%,#5262ad 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfcfa', endColorstr='#ecc58e',GradientType=0 ); /* IE6-9 */
border: 1px solid #dad3cb; border-radius: 20px;
 width: 50%; margin: auto; padding: 30px 50px;   } 
  
  
  .main-form1 {  
 background:#5262ad; /* Old browsers */

background: -moz-linear-gradient(top,  #b5b5b5 0%,#516bb2 50%,#5262ad 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #b5b5b5 0%,#516bb2 50%,#5262ad 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #b5b5b5 0%,#516bb2 50%,#5262ad 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f80000', endColorstr='#8e0100',GradientType=0 ); /* IE6-9 */


filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f80000', endColorstr='#8e0100',GradientType=0 ); /* IE6-9 */

  border-radius: 0 0 20px 20px;
 width: 40%; margin: 0 auto  ; padding: 20px 80px;   } 
 
.main-form1   .btn-success { width: 100%; margin: 0 0 10px 0;} 
   .btn-primary { 
background:#5262ad; /* Old browsers */

background: -moz-linear-gradient(top,  #b5b5b5 0%,#516bb2 50%,#5262ad 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #b5b5b5 0%,#516bb2 50%,#5262ad 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #b5b5b5 0%,#516bb2 50%,#5262ad 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f80000', endColorstr='#8e0100',GradientType=0 ); /* IE6-9 */
 border: 0px solid;
  } 
  
   .btn-primary:hover,  .btn-primary:focus,   .btn-primary:active  { 
 background: #5262ad; /* Old browsers */


  border: 0px solid;
  } 
  
  
   .btn-success { 
 background: #c3c4c6; /* Old browsers */
background: -moz-linear-gradient(top,  #c3c4c6 0%, #fff 50%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #c3c4c6 0%,#fff 50%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #c3c4c6 0%,#fff 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c3c4c6', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
 border: 0px solid;
 color: #000;
  } 
  
   .btn-success:hover,  .btn-success:focus,   .btn-success:active  { 
 background: #c3c4c6; /* Old browsers */
background: -moz-linear-gradient(top,  #fff 0%, #c3c4c6 50%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fff 0%,#c3c4c6 50%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fff 0%,#c3c4c6 50%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#c3c4c6',GradientType=0 ); /* IE6-9 */

  border: 0px solid; color: #000;

  } 
  
  .header{ float: right; background:white; padding: 10px 0; width: 100%; -webkit-box-shadow: 0px 9px 13px -11px rgba(0,0,0,0.37);
-moz-box-shadow: 0px 9px 13px -11px rgba(0,0,0,0.37);
box-shadow: 0px 9px 13px -11px rgba(0,0,0,0.37); }
  .logo-inner { float: right; }
  .navbar-default {

    background: none;
    border: 0px solid #e7e7e7;
	margin: 0; padding: 0;

}
  
  .nav {   margin: 50px  30px 0 0; }
  .nav ul { list-style: none ; padding: 0; margin: 0;}
  .nav ul li{ list-style: none ; padding: 0; margin: 0 0 0 5px; display: inline-block;    text-align: center; color: #fff; font-size: 16px; }
  .nav ul li a{  background: #5262ad; border-radius:5px; padding: 7px 25px; text-align: center; color: #fff;   }
  .nav ul li a:hover, .nav ul li a:focus, .nav ul li a:active
  {
       background: #5262ad;
 background: linear-gradient(to bottom, #262366 0%,#516bb2 100%);



filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#820000', endColorstr='#f90001',GradientType=0 ); /* IE6-9 */
text-decoration: none;
  }
  
    .nav ul   li.active a{
 background: #fdebd7; /* Old browsers */
background: -moz-linear-gradient(top,  #fdebd7 0%, #f8a442 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,   #fdebd7 0%,#f8a442 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fdebd7 0%,#f8a442 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#820000', endColorstr='#f90001',GradientType=0 ); /* IE6-9 */
text-decoration: none;
  }
  
 .top-links { margin: 35px 0 30px; float: right; width: 100%;}
 .links  a{ background:  #26225f; width: 20%; float: right; text-align:center; color: #fff; padding:   10px; font-weight: bold; font-size: 17px;} 
   .links .fa{ font-size: 20px;}
  .links a:hover, .links a:focus, .links a:active { background: #5262ad; text-decoration: none; }
   .top-links  .active  a  { background: #5262ad; text-decoration: none; }
  
  
  
  
   .links1 a{ background: #eabe81; width: 20%; float: right; text-align:center; color: #fff; padding:   10px; font-weight: bold; font-size: 17px; border-radius: 0;} 
   .links1 .fa{ font-size: 20px;}
    .links1 a:hover, .links1 a:focus, .links1 a:active { background: #5262ad; text-decoration: none; }

   .links2 a{ background: #26225f; width: 20%; float: right; text-align:center; color: #fff; padding:   10px; font-weight: bold; font-size: 17px; border-radius: 5px 0 0 5px;} 
   .links2 .fa{ font-size: 20px;}
      .links2 a:hover, .links2 a:focus, .links2 a:active { background: #5262ad; text-decoration: none; }

  
  
  .form {    float: right;width: 100%; margin: 0 0 100px 0; border: 2px solid #516bb2; }
  .form-sub {   float: right;width: 100%; padding: 30px; }
    .form h2{ text-align: center; color: #fff; padding: 15px; background:#516bb2; font-size: 20px; margin: 0; -webkit-box-shadow: 0px 9px 13px -11px rgba(0,0,0,0.37);
-moz-box-shadow: 0px 9px 13px -11px rgba(0,0,0,0.37);
box-shadow: 0px 9px 13px -11px rgba(0,0,0,0.37);  }
  .form  .fa { margin: 0 10px;}
    .form-sub  label{ display: inline-block; float: right; width: 30%; background: #5262ad; color: #fff;   font-size: 17px; text-align:center; padding: 5px; border-radius: 3px ; }
    .form-sub  .form-control{ display: inline-block; float: right; width: 67%; border: 2px solid #5262ad; margin-right: 3%; padding: 5px; height: 39px; border-radius: 3px   }
     .form-sub  .form-group {float: right;width: 100%;  margin: 0 0 20px 0;}
   .form-sub .btn-primary { 
 background: #eabe81; 
  border: 0px solid;
 color: #fff;
  } 
  
   .form a {color:White;}
   .form-sub .btn-primary:hover,  .form-sub .btn-primary:focus,   .form-sub .btn-primary:active  { 
 background: #eabe81; 
  border: 0px solid; color: #000; color: #fff;


  }
  
     .form-sub .btn-success { 
 background: #5262ad; 
  border: 0px solid;
 color: #fff;
  } 
  
   .form-sub .btn-success:hover,  .form-sub .btn-success:focus,   .form-sub .btn-success:active  { 
 background: #5262ad; 
  border: 0px solid; color: #000; color: #fff;


  } 
    .form-sub .pull-right { margin: 30px 0 30px 150px; }

.sidebar-search { background: #5262ad; margin: 43px 0 0 0; border: 2px solid #5262ad;}
.sidebar-search  .btn-default {  background: #5262ad; color: #fff; border: 0px solid;  border-radius: 0  !important ;   }
.sidebar-search  .btn {     border-radius: 0  !important ;   }
.sidebar-search .form-control { border: 0px solid;  border-radius: 0 !important ; }


.user-padd{padding:30px;}
.user-padd div.pull-left{margin-top:-27px;}
.user .fa { color:#5262ad; font-size: 50px; float:right ;  ;}
.user-name { background:#5262ad; border-radius: 6px  10px  ; float:right; padding: 8px 10px; color:white; font-size: 14px; line-height: 18px; }


.side-left { background:  lightgray; padding: 30px;}
.side-leftsub { background:  rgba(0,0,0,.08); padding: 15px; text-align: left;}
.side-leftsub h2{  color: #353432;  font-size: 17px;}
.side-leftsub .fa{ color: #398edf;}
.side-leftsub .active{ color: #cc0000;}
.side-leftsub ul{ list-style: none; margin: 0; padding: 0 0 15px 15px; }
.side-leftsub ul li{ list-style: none; margin: 0; padding: 0; color: #398edf;  }
.side-leftsub ul li a{   color: #398edf;  }


.table img {
    width: 35px;
} 
.table { margin: 30px 0; font-size: 14px; }
.table tr th{ background: #eeeeee; color: #388ee1; border: 1px solid #ddd; }
.table tr td{ border: 1px solid #ddd;} 
.table .fa{ background: #eeeeee; padding: 5px; }

.dataTables_length   { width: 120px; float:left;  }
.dataTables_length label {
    display: inline-block;
    float: right;
    width: auto;
    background: none;
    color: #cc0000;
    font-size: 15px;
    text-align: right;
    padding: 0  0 0 10px;
    border-radius: 0;
}

.dataTables_length  .form-control {
    display: inline-block;
    float: right;
    width: auto;
    border: 1px solid #ccc;
     padding: 3px;
	 height: 30px;
     border-radius: 0;
}

.pagination {
    display: inline-block;
    padding-right: 0;
    margin: 0 0;
    border-radius: 0;
}
.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left: 0;
    border-radius: 0;
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-radius: 0;
   }
   
   .pagination > li > a, .pagination > li > span {
    position: relative;
    float: right;
    padding: 6px 12px;
    margin-right: -1px;
    line-height: 1.42857143;
    color: #000;
    text-decoration: none;
    background-color: #eee;
    border: 1px solid #fff;
}
  .pagination > .disabled > a, .pagination > .disabled > a:focus, .pagination > .disabled > a:hover, .pagination > .disabled > span, .pagination > .disabled > span:focus, .pagination > .disabled > span:hover {
    color: #777;
     background-color: #eee;
    border-color: #fff;
} 
   .pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
     color: #fff;
     background-color: #cc0000;
    border-color: #fff;
}
 .footer {  float: right; width: 100%; text-align: center; padding: 10px ; background:#5262ad ;color:White

  }

 .footer1 {  float: right; width: 100%; text-align: center; padding: 10px ; background:  #5262ad;
 background-position: bottom right; background-repeat: no-repeat;color:White;
  }



 @media (max-width: 575.98px) {  
 .top-links .pull-right { float: right !important; }
 .links a , .links1 a, .links2 a { width: 33%; margin: 0 0 20px 0; } 
 .navbar-collapse.in {  overflow: inherit; }
 .nav {  margin: 10px 0 0 0; }
 .nav ul li   {   display: block; width: 100%; margin: 0 0 5px 0; }
 .nav ul li a {   display: block; width: 100% }
 .navbar-default .navbar-collapse, .navbar-default .navbar-form {  border: 0px solid ; }
 .form-sub .form-control {    width: 100%; margin-right: 0; }
.form-sub label { width: 100%; } 
.form-sub .pull-right {  margin: 30px 0 30px 0; }
.main-form1 {  width: 80%;   padding: 20px 30px; }
.main-form {  width: 100%; padding: 30px  ; }


.nav-home{margin-top:40px;margin-right:20px;}
.button-home2{margin-top:40px;}
.img-home2{width:100px !important; }



.links a,.links .fa,.user-name {font-size:10px;}
.links a{height:45px;}
.user-padd {padding:8px;}
}


 



 @media (min-width: 576px) and (max-width: 767.98px) { 
 
  .top-links .pull-right { float: right !important; }
 .links a , .links1 a, .links2 a { width: 33%; margin: 0 0 20px 0; } 
 .navbar-collapse.in {  overflow: inherit; }
 .nav {  margin: 10px 0 0 0; }
 .nav ul li   {   display: block; width: 100%; margin: 0 0 5px 0; }
 .nav ul li a {   display: block; width: 100% }
 .navbar-default .navbar-collapse, .navbar-default .navbar-form {  border: 0px solid ; }
 .form-sub .form-control {    width: 100%; margin-right: 0; }
.form-sub label { width: 100%; } 
.form-sub .pull-right {  margin: 30px 0 30px 0; }
.main-form1 {  width: 80%;   padding: 20px 30px; }
.main-form {  width: 100%; padding: 30px  ; }
  }

 @media (min-width: 768px) and (max-width: 991.98px) {  
 .table { font-size: 10px; }
  .links a , .links1 a, .links2 a { width: 25%;   } 
  .side-left {  padding: 10px; }
  .nav ul li a {  padding: 7px 4px; }
  .main-form1 {  width: 50%;   padding: 20px 30px; }
.main-form {  width: 70%; padding: 30px  ; }
}

 @media (min-width: 992px) and (max-width: 1199.98px) { 
   .nav ul li a {  padding: 7px 7px; }
     .links a , .links1 a, .links2 a { width: 25%;   } 
 .table { font-size: 10px; }

 }

 @media (min-width: 1200px) {  }





div.sta
{
    border-bottom:3px solid black;
    
    }
    
    
    
    
    div.sta a
    {
        color:Black;
        text-decoration:none;
        }
        
        .table .fa
    {
     color:#5262ad;  
    }