.cb{
    background-color: black;
    color: white;
}
.Login{
    max-width: fill;
  }
#cred{
  width: 400px;
  position: absolute;
  top: 30%;
  left: 40%;
  background-color: white;
  
    -webkit-appearance:  none; 
    width:  auto;
    min-width:  100px;
    border-radius:  24px; 
    text-align:  center; 
    padding:  15px 40px;
    margin-top:  5px; 
    background-color:  saturate(30%); 
    color:  black; 
    font-size:  14px;
    margin-left:  auto; 
    font-weight:  500; 
    box-shadow:  0px 2px 6px -1px rgba(0,0,0,.13); 
    border:  none;
    transition:  all .3s ease; 
    outline: 0; 
        
}
.topnav {
    background-color: #333;
    overflow: hidden;
  }
  
  /* Style the links inside the navigation bar */
  .topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
  }
  
  /* Change the color of links on hover */
  .topnav a:hover {
    background-color: #ddd;
    color: black;
    cursor: pointer;
  }
  
  /* Add an active class to highlight the current page */
  .topnav a.active {
    background-color: #4CAF50;
    color: white;
  }
  
  /* Hide the link that should open and close the topnav on small screens */
  .topnav .icon {
    display: none;
  }
  
  
  .button {
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    transition-duration: 0.4s;
    cursor: pointer;
    width: 400px;
    border-radius: 25px;
    position: absolute;
       
  }
  
  .button1 {
    background-color: white;
    color: black;
    border: 4px solid #4CAF50;
    top: 40%;
    left: 40%;
  }
  
  .button1:hover {
    background-color: #4CAF50;
    color: white;
  }
  
  .button2 {
    background-color: white;
    color: black;
    border: 4px solid #008CBA;
    top: 50%;
    left: 40%;
        
}
  
  .button2:hover {
    background-color: #008CBA;
    color: white;
  }
  .button3 {
    background-color: white;
    color: black;
    border: 4px solid red;
    top: 60%;
    left: 40%;
  }
  .button3:hover {
    background-color: red;
    color: white;
  }
  .fbutton{
    display:inline-block;
    padding:0.5em 3em;
    border:0.16em solid "#200021";
    margin:0 0.3em 0.3em 0;
    box-sizing: border-box;
    text-decoration:none;
    text-transform:uppercase;
    font-family:'Roboto',sans-serif;
    font-weight:400;
    color:white;
    text-align:center;
    transition: all 0.15s;
    background-color: rgb(124, 6, 124);
    width: 300px;
    }
    .fbutton:hover{
    color:#7cfc00;
    border-color:#7cfc00;
    }
    table {
      font-family: "Lato","sans-serif";   }       /* added custom font-family  */
       
      table.one {                                  
      margin-bottom: 3em; 
      border-collapse:collapse;   }   
       
      td {                            /* removed the border from the table data rows  */
      text-align: center;     
      width: 10em;                    
      padding: 1em;       }       
       
      th {                              /* removed the border from the table heading row  */
      text-align: center;                 
      padding: 1em;
      width: 10em;
      background-color: rgb(124, 6, 124);       /* added a red background color to the heading cells  */
      color: white;       }                 /* added a white font color to the heading text */
       
      tr {    
      height: 1em;    }
       
     
      table tr:nth-child(odd) {           
      background-color:#fff; 
      font-weight: 1000;
         
    }
    input[type="radio"] {
      -ms-transform: scale(1.5); /* IE 9 */
      -webkit-transform: scale(1.5); /* Chrome, Safari, Opera */
      transform: scale(1.5);
  }