*{
    margin: 0;
    padding: 0;
} 
.card-title{
      color:red;
       font-size:15px;
       text-transform:uppercase;
    
  }
    
   h7{
        color:blue;
        font-size:15px;
       text-transform:uppercase;
         
    }
    .widget-content {
    margin-top: 20px;
}

/*table back ground the first two collums*/
.table {
    width: 100%;
    border-collapse: collapse;
     
}


/*Top of the table*/
.table th{
    padding: 5px;
    text-align: left;
    border-bottom: 3px solid black;
    font-size:12px;
    text-transform:uppercase;
    color:blue;
}
    
    
    /*inside results of the table*/
    
.table td {
    padding: 8px;
    text-align: left;
    border-bottom: 3px solid black;
    font-size:12;
    font-weight:600;
   
    
}



.table tbody tr:nth-child(even) {
    background-color: #f9f9f9;
    border-bottom: 3px solid black;
}

.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 4px;
   background-color: #007bff;
}

.btn-danger {
    color: #fff;
    background-color: #007bff;
    border-color: #d43f3a;
}

.btn-danger:hover {
    background-color: #c9302c;
    border-color: #ac2925;
}

.btn-warning {
    color: #fff;
    background-color: #f0ad4e;
    border-color: #eea236;
}

.btn-warning:hover {
    background-color: #ec971f;
    border-color: #d58512;
}

.delete-btn {
    margin-right: 5px;
}

/* Image styles */
.table img {
    width: 50px; /* Adjust as needed */
    height: 50px;
    display: block;
    margin: 0 auto;
    border-radius: 50%; /* Makes the images round */
}


.arafat{
 
 width: 100% ;
  padding: 10px;
  margin-bottom: 10px;

  color: black;
  font-size: 16px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  border-radius: 4px;
  box-sizing: border-box;
    font-weight: bold;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.8);
  position:relative;
 
  
}

.widget-content{
 
   width: 100% ;
  
}


.sidenav {
    height: 250px;
    width: 0px;
    position: relative;
    bottom: 15px;
    z-index: 4;
    background-color:  #007bff;
    overflow-x: hidden;
    transition: 2s;
    right: 5px;
}

.sidenav a {
    padding: 6px;
    font-size: 16px;
    color: red;
    display: block;
    transition: 0.3s
}

.sidenav a:hover,
.offcanvas a:focus {
    color: white;
    left:20px;
    position: relative;
   
}

.closebtn {
    position: relative;
    top: 2px;
    left: 125px;
    color: blue;
    margin-left: 150px;
    font-weight:900;
    border-radius:5px;
    
}


	/*Navigation Buttons*/
.yusuf{
 

  padding: 10px;
  margin-bottom: 10px;
 
  background-color:  #007bff ;
  color: white;
  font-size: 16px;
  cursor: pointer;

 
    font-weight: bold;
  }