*{
  margin: 0;
  padding: 0;
}
.mainWrapper{
  margin-left: 5px;
  position:static;
  width: 99%;
  display: block;
  margin-left: auto;
  margin-right: auto;
  align-content: center;
  /* height: 95vh; */
}
.upperdiv{
  display: flex;
  background-color: rgb(75, 93, 103);
  height: 90%;
  width: 100%;
  padding-bottom: 7px;
}
.searchdiv{
  background-color: rgb(228, 228, 228);
  padding-top: 10px;
  padding-bottom: 10px;
  height: 100%;
  width: 100%;
}
.regionisue{
  /* background-color: rgb(255, 255, 255); */
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 2px;
  padding-bottom: 2px;
  color: rgb(0, 0, 0);
  margin-top: -15px;
  /* float:left; */
  top: 15px;
  margin-right: 20px;
  font-weight: bold;
  font-size: 13pt;
  font: 30pt;
}
.reportdiv{
  background-color: rgb(255, 255, 255);
  height: 33px;
  width: 99%;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  border: 1px solid black;
  border-radius:  5px;

}
.viewfilediv{
  padding-top: 10px;
  padding-left: 10px;
  background-color: white;
  height: 70%;
  width: 99.5%;
  padding-bottom: 10px;
}
.datacontentdiv{
overflow-y: auto;
overflow-x: auto;
  /* background-color: rgb(204, 204, 204); */
  height: 65vh;
  width: 100%;
  /* background-color: aqua; */
 border: 1px solid rgb(0, 0, 0);
 border-radius: 5px; 
}
.creddiv{
  background-color:transparent;
  height: 80%;
  width: 30%;
  /* float: left; */
  color: white;
  font-size: 12pt;
  margin-left: 10px;
  margin-top: 10px;
}
.btnemail:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
  }
.btnemail{
  background-image: url("images/email.png");
  background-repeat: no-repeat;
  background-size: 28px;
  background-color: rgb(75, 93, 103); 
  border: 1px solid rgb(255, 255, 255);
  padding: 12px 16px;
  font-size: 12px;  
  cursor: pointer;
  background-position:top;
  background-position-y: 5px;
  text-orientation: upright;
  height: 50px;
  width: 50px;
  margin-top: 3px;
  margin-left: 2px;
  text-align:left;
  vertical-align: middle;
  }
.btncontainer{
  /* float:  right; */
  margin-top: 0px;
  background-color: transparent;
  height: 80%;
  width: 30%;
  /* float: left; */
  color: white;
 
  font-size: 12pt;
  margin-left: 10px;
  margin-top: 10px;
}
.btncontainer2{
  /* float:  right; */
  margin-top: 0px;
  
  background-color: transparent;
  height: 80%;
  width: 37%;
  /* float: left; */
  color: white;
 
  font-size: 12pt;
  margin-left: 10px;
  margin-top: 10px;
}
.block1{
  float:right;
  
}
.btnsettings {
  background-image: url("images/settings.png");
  background-repeat: no-repeat;
  background-size: 28px;
  background-color: rgb(75, 93, 103); 
  border: 1px solid rgb(255, 255, 255);
  padding: 12px 16px;
  font-size: 12px;  
  cursor: pointer;
  background-position:top;
  background-position-y: 5px;
  text-orientation: upright;
  height: 50px;
  width: 50px;
  margin-top: 3px;
  margin-left: 2px;
  text-align:left;
  vertical-align: middle;
}
.btnsettings:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
.NEWBTN {
  background-image: url("images/nerwitem.png");
  background-repeat: no-repeat;
  background-size: 28px;
  background-color: rgb(75, 93, 103); 
  border: 1px solid rgb(255, 255, 255);
  padding: 12px 16px;
  font-size: 12px;  
  cursor: pointer;
  background-position:top;
  background-position-y: 5px;
  text-orientation: upright;
  height: 50px;
  width: 50px;
  margin-top: 3px;
  margin-left: 2px;
  text-align:left;
  vertical-align: middle;
}
.NEWBTN:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
.btnLawyer{
  background-image: url("images/lawyer.png");
  background-repeat: no-repeat;
  background-size: 28px;
  background-color: rgb(75, 93, 103); 
  border: 1px solid rgb(255, 255, 255);
  padding: 12px 16px;
  font-size: 12px;  
  cursor: pointer;
  background-position:top;
  background-position-y: 5px;
  text-orientation: upright;
  height: 50px;
  width: 50px;
  margin-top: 3px;
  margin-left: 2px;
  text-align:left;
  vertical-align: middle;
}
.btnLawyer:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
.btnlogout{
   background-image: url("images/logout.png");
  background-repeat: no-repeat;
  background-size: 28px;
  background-color: rgb(75, 93, 103); 
  border: 1px solid rgb(255, 255, 255);
  padding: 12px 16px;
  font-size: 12px;  
  cursor: pointer;
  background-position:top;
  background-position-y: 5px;
  text-orientation: upright;
  height: 50px;
  width: 50px;
  margin-top: 3px;
  margin-left: 2px;
  text-align:left;
  vertical-align: middle;
}
.btnlogout:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
.btnaccount{
  background-image: url("images/acct.png");
 background-repeat: no-repeat;
 background-size: 28px;
 background-color: rgb(75, 93, 103); 
 border: 1px solid rgb(255, 255, 255);
 padding: 12px 16px;
 font-size: 12px;  
 cursor: pointer;
 background-position:top;
 background-position-y: 5px;
 text-orientation: upright;
 height: 50px;
 width: 50px;
 margin-top: 3px;
 margin-left: 2px;
 text-align:left;
 vertical-align: middle;
}
.btnaccount:hover {
 background-color: RoyalBlue;
 transition-duration: 0.4s;
 cursor: pointer;
}




.button-text-settings{
background-color: transparent;
position: relative;
color: white;
font-size: smaller;
transform: translateX(-50%);
bottom: -16px;
width: 10%;
left: -80%;
} 
.button-text-new{
  background-color: transparent;
  position: relative;
  color: white;
  font-size: smaller;
  transform: translateX(-50%);
  bottom: -16px;
  width: 10%;
  left: -17%;
}
.button-text-layyer{
  background-color: transparent;
  position: relative;
  color: white;
  transform: translateX(-50%);
  font-size: smaller;
  bottom: -16px;
  width: 10%;
  left: -40%;
}
.button-text-account{
  background-color: transparent;
  position: relative;
  color: white;
  transform: translateX(-50%);
  font-size: smaller;
  bottom: -16px;
  width: 10%;
  left: -70%;
}
.button-text-logout{
  background-color: transparent;
  position: relative;
  color: white;
  transform: translateX(-50%);
  font-size: smaller;
  bottom: -16px;
  width: 10%;
  left: -40%;
}
.selectordiv{
  width: 100%;
  height: 90%;
  background-color:transparent;
}
#btnid:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
#pdflocationcadd{
  background-color: white;
  padding-left: 5px;

}
#openfilesPDFP{
  background-color: rgb(75, 93, 103); 
  color: white;
  border-color: azure;
  font-size: 10pt;
  text-align: center;
  /* float: inline-start; */
  width: 7em;
  height: 30px; 
  /* height: 23px; */
  /* margin-right: 45em; */
  text-align:center;
  font-weight: bold;
  margin-top:-27px;
  /* float: right; */
}
  #openfilesPDFP:hov{ 
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
#btnid{
  
  background-color: rgb(75, 93, 103); 
  color: white;
  border-color: azure;
  font-size: 10pt;
  text-align: center;
  /* float: inline-start; */
  width: 7em;
  height: 30px; 
  /* height: 23px; */
  /* margin-right: 45em; */
  text-align:center;
  font-weight: bold;
  margin-top:-27px;
  /* float: right; */
  
}
#btnidhistory{
   background-color: rgb(75, 93, 103); 
  color: white;
  border-color: azure;
  font-size: 10pt;
  text-align: center;
  /* float: inline-start; */
  width: 7em;
  height: 30px; 
  /* height: 23px; */
  /* margin-right: 45em; */
  text-align:center;
  font-weight: bold;
  margin-top:-27px;
  /* float: right; */
}
#btnidhistory:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
#btnid2:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
#btnid2{
  background-image: url("images/numberslogo.png");
  background-repeat: no-repeat;
  background-size: 15px;
  background-position:center ;
  background-position-x: 3px;
  background-color: rgb(75, 93, 103); 
  color: white;
  border-color: azure;
  font-size: 10pt;
  text-align: center;
  float: right;
  width: 12em;
  height: 35px; 
  /* height: 23px; */
  margin-right: 13.5em;
  text-align:left;
  font-weight: bold;
  margin-top: -45px;
  
}

#countlb{

background-color: rgb(75, 93, 103); 
color: white;
float: right;
margin-top: -45px;
margin-right: 400px;
width: 5em;
height: 27px; 
padding-top: 8px;
  text-align:center;
  font-weight: bold;
}#counttb{

background-color: rgb(75, 93, 103); 
color: white;
float: right;
margin-top: -45px;
margin-right: 350px;
width: 3em;
height: 26px; 
padding-top: 5px;
  text-align:center;
  font-weight: bold;
}


#btnid3:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
#homeid{
  background-size: 15px;
}
#btnid3{
  background-image: url("images/print.png");
  background-repeat: no-repeat;
  background-size: 15px;
  background-position:center ;
  background-position-x: 3px;
  background-color: rgb(75, 93, 103); 
  color: white;
  border-color: azure;
  text-align: center;
  float: right;
  width: 12em;
  height: 35px;
  margin-right: 1em;
  text-align:left;
  font-size: 10;
  font-weight: bold;
  margin-top: -45px;
   /* margin-top: -0px; */
}
.searchclass{
  /* float: left; */
  margin-left: 5px;
  width:20%;
  height: 25px;
}
.spacer{
  height: 10px;
width: 100%;
/* background-color: aqua; */
}
.spacer2{
height: 10%;
width: 100%;
/* background-color: aqua; */
}
select{
  color: rgb(0, 0, 0);
  background-color: rgb(255, 255, 255);
  font-size: 10pt;
  /* height: 25px; */
  border-color: rgb(181, 181, 181);
  width: 150px;
  }

  #openfilesPDF:hover {
      background-color: RoyalBlue;
      transition-duration: 0.4s;
      cursor: pointer;
    }
  #openfilesPDF{
     background-repeat: no-repeat;
      background-size: 15px;
      background-position:center ;
      background-position-x: 3px;
      background-color: rgb(75, 93, 103); 
      color: white;
      border-color: azure;
      text-align: center;
      /* float: right; */
      width: 6.5em;
      height: 35px;
      /* margin-right: 1em; */
      text-align:left;
      font-size: 10;
      font-weight: bold;
      padding-left: 5px;
      
  }
  #Edititem:hover {
    background-color: RoyalBlue;
    transition-duration: 0.4s;
    cursor: pointer;
  }
#Edititem{
   background-repeat: no-repeat;
    background-size: 15px;
    background-position:center ;
    background-position-x: 3px;
    background-color: rgb(75, 93, 103); 
    color: white;
    border-color: azure;
    text-align: center;
    /* float: right; */
    width: 6.5em;
    height: 35px;
    margin-right: 1em;
    text-align:left;
    font-size: 10;
    font-weight: bold;
    padding-left: 5px;
    
}
/**/

.btnhisto:hover {
    background-color: RoyalBlue;
    transition-duration: 0.4s;
    cursor: pointer;
  }
.btnhisto{
   background-repeat: no-repeat;
    background-size: 15px;
    background-position:center ;
    background-position-x: 3px;
    background-color: rgb(75, 93, 103); 
    color: white;
    border-color: azure;
    text-align: center;
    /* float: right; */
    width: 6.5em;
    height: 35px;
    margin-right: 1em;
    text-align:left;
    font-size: 10;
    font-weight: bold;
    padding-left: 5px;
    
}

/**/
  #Editdata:hover {
    background-color: RoyalBlue;
    transition-duration: 0.4s;
    cursor: pointer;
  }
#Editdata{
   background-repeat: no-repeat;
    background-size: 15px;
    background-position:center ;
    background-position-x: 3px;
    background-color: rgb(75, 93, 103); 
    color: white;
    border-color: azure;
    text-align: center;
    /* float: right; */
    width: 6.5em;
    height: 35px;
    margin-right: 1em;
    text-align:left;
    font-size: 10;
    font-weight: bold;
    padding-left: 5px;
    
}
#tableidtask{
  width: 100%;
}
.table th{
  position: sticky; 
  top: 0px;
  
  background-color: rgb(75, 93, 103);
  color: rgb(255, 255, 255);

  text-align: center;
  /* font-weight: normal; */
  font-size: 17px;
  padding-left: 30px;
  padding-right: 30px;
  outline: 0.7px solid rgb(82, 82, 82);
  border: 1.5px solid rgb(80, 80, 80);
} 
table th{
position: sticky; 
top: 0px;

background-color: rgb(75, 93, 103);
color: rgb(255, 255, 255);

text-align: center;
/* font-weight: normal; */
font-size: 17px;
padding-left: 30px;
padding-right: 30px;
outline: 0.7px solid rgb(82, 82, 82);
border: 1.5px solid rgb(80, 80, 80);
} 
table {
  
min-width: max-content;

border-collapse: separate;
border-spacing: 0px;    

}

table th, table td {
  
padding: 5px;
padding-top: 3px;
padding-bottom: 3px;

}

table td {
text-align: left;
background-color: white;
font-size: 12px;
border: 1px solid rgb(177, 177, 177);
padding-left: 20px;

}

tr:hover{

color: rgb(222, 40, 40);
background-color: rgb(198, 212, 247);

cursor: pointer;
}

tr:hover td {
  background-color: transparent; /* or #000 */
  
}
.styled-table {
  border-collapse: collapse;
  margin: 25px 0;
  font-size: 0.9em;
  font-family: sans-serif;
  min-width: 400px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}
.motherwrapper {
height: 79vh;
margin-top: -70px;
display: flex;
padding-top: 100px;
justify-content: center;
}

.uppperlawyer{
width: 50%;
height: 90vh;
background-color: rgb(228, 228, 228);
}
.upppersettings{
margin-top: 70px;
width: 30%;
height: 50vh;
background-color: rgb(228, 228, 228);
}
.upppersettings2{
margin-top: 70px;
width: 70%;
height: 100%;
background-color: rgb(255, 255, 255);
display: block;
border: 1px solid black;
/* padding-top: 100px; */
/* justify-content: center; */
}
.upperbtn{
width: 100%;
height: 5vh;
background-color: rgb(75, 93, 103);
}
.selectorlawyer{
padding-top: 10px;
padding-left: 3%;
width: 100%;
/* height: 3vh; */
/* background-color: rgb(161, 153, 153); */
}
.Assignelawyer{
margin-top: -30vh;
margin-right: 6%;
float: right;
/* margin-top: ; */
width: 40%;
height: 30vh;
border: 1px solid black;
border-radius: 10px;

/* margin-left: 10px; */
background-color: rgb(255, 255, 255);
}
.btntransfer{
padding-top: 10%;
float: left;
margin-top: -30vh;
width: 12%;
height: 10vh;
/* background-color: aqua; */
margin-left: 41%;
}
.backtohome{
color: white;
font-size: 12pt;
}
.backcontainer{
float: right;
padding-right: 1%;

padding-top: -30%;
height: 5vh;
width: 50px;
/* background-color: antiquewhite; */
}
.regionlist{
width: 40%;
height: 30vh;
background-color: rgb(255, 255, 255);
border: 1px solid black;
border-radius: 10px;
}
select option{
size: 10;
}
.dataregion{
/* margin-left: 3%; */
margin-top: 20px;
height: 40vh;
width: 94%;
background-color: rgb(255, 255, 255);
border: 1px solid black;
border-radius: 10px;
overflow-y: auto;
}

.eftbtn{
width:100%;
height: 50%;
margin-bottom: 10px;
}
.rightbtn{
height: 50%;
width: 100%;
}
.lawyerlabel{
font-weight: bold;
margin-bottom: 10px;
}
.selectorLawyer2{
width: 93%;
padding-left: 5px;
/* height: 70%; */
}
.REGforlawyer{
width: 100%;
height: 100%;
border: 1px solid black;
border-radius: 10px;
padding-left: 10px;
}
.lawyersname{
background-color: rgb(255, 255, 255);
height: 20px;
width: 40%;
color: rgb(0, 0, 0);
padding-left: 3px;
border: 1px solid black;
border-radius: 5px;
}

.motherdivaddacct{
/* background-color: rgb(216, 106, 106); */
height: 95vh;
margin-top: -70px;
display: flex;
padding-top: 100px;
justify-content: center;
}
.innerlabelforaddacct{
margin-top: 0px;
height: 95%;
width: 50%;
border: 1px solid black;
border-radius: 2%;
/* background-color: aqua; */
}
.upperlabelforaddacct{
background-color: rgb(75, 93, 103);
height: 40px;
width: 98.5%;
border: 1px solid black ;
border-radius: 10px 10px 0px 0px;
padding-top: 20px;
padding-left: 10px;
}
.adduserlabelindicator{
color: white;
font-weight: bold;
margin-right: 70%;

}
.homelabelindicator{

color: white;
font-weight: bold;
}
.homelabelindicator:hover{
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
.inputfieldaddacct{
margin-top: 20px;
margin-left: 20px;
}
.inputacctclasslvl{
padding-left: 0px;
margin-right: 20px;
border: 1px solid black;
border-radius: 4px;
height: 30px;
width: 93%;
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.9);
 
}
.inputacctclass{
padding-left: 5px;
margin-right: 20px;
border: 1px solid black;
border-radius: 4px;
height: 30px;
width: 92%;
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.9);

}
.Show_Password{
margin-top: 10px;
}
.lowerBTN{
display: flex;
/* background-color: aqua; */
padding-top: 30px;
justify-content: center;
}
.btnacct1{
margin-right: 10px;
height: 5vh;
width: 40%;
background-color: rgb(75, 93, 103);
color: white;
font-weight: bold;
border: 1px solid rgb(136, 131, 131);
border-radius: 5px;
/* position:absolute; */
}
.wdj{
margin-right: 10px;
height: 5vh;
width: 30vw;
/* background-color: rgb(22, 119, 172); */

}
.btnacct{
margin-right: 10px;
margin-left: 100px;
height: 5vh;
width: 25%;
background-color: rgb(75, 93, 103);
color: white;
font-weight: bold;
border: 1px solid rgb(136, 131, 131);
border-radius: 5px;
}
.btnacct:hover{
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
.btnacct1:hover{
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
.inputacctclass2{
padding-left: 20px;
margin-right: 20px;
border: 1px solid black;
border-radius: 4px;
height: 30px;
width: 61%;
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.9);
}
.containeracctdetails{
width: 70%;
height: 70vh;
margin-top: 5%;
border: 1px solid black;
border-radius: 10px;
}
.containeracctdetails2{
width: 48%;
height: 70vh;
margin-top: 5%;
/* background-color: aqua; */
border: 1px solid black;
border-radius: 10px;
}

.headerclass{
/* width: 99%; */
height: 5vh;
background-color: rgb(75, 93, 103);
border: 1px solid black;
border-radius: 10px 10px 0px 0px ;
padding-top: 15px;
padding-left: 10px;
}
.acctviewlb{
color: white;
padding-top: 50px;
font-size: 12pt;
font-weight: bold;
}
.Back{
color: white;
padding-top: 50px;
font-size: 12pt;
font-weight: bold;
float: right;
margin-top: -50px;
margin-right: 20px;
}
.Back:hover {
/* background-color: RoyalBlue; */
transition-duration: 0.4s;
cursor: pointer;
}
.contentmanage{
width: 99%;
height: 70%;
/* background-color: rgb(255, 255, 255);
border: 1px solid black; */
/* border-radius: 10px 10px 0px 0px ; */
padding-top: 15px;
padding-left: 10px;
}
.btnclass{
width: 99%;
height: 7vh;
/* background-color: rgb(143, 27, 27); */
/* border: 1px solid black; */
/* border-radius: 10px 10px 0px 0px ; */
padding-top: 15px;
padding-left: 10px;
}
.inputacctclassi{
padding-left: 5px;
margin-right: 20px;
border: 1px solid black;
border-radius: 4px;
height: 30px;
width: 100%;
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.9);

}
.inputacctclasslvlu{
padding-left: 0px;
/* margin-right: 20px; */
border: 1px solid black;
border-radius: 4px;
height: 30px;
width: 95%;
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.9);
 
}
.inputacctclass2r{
padding-left: 10px;
/* margin-right: 20px; */
border: 1px solid black;
border-radius: 4px;
height: 30px;
width: 68%;
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.9);
}
.btnclass2{
width: 95%;
height: 7vh;
padding-top: -300px;
padding-left: 65px;
position:inherit;
/* background-color: aqua; */
}
.fitterdivdataupdate{
width: 95%;
height: 45vh;
/* background-color: aquamarine; */
}
.cntner{
position:relative;
content: normal;
}
.settingslabel{
letter-spacing: 1px;
padding-top: 10px;
padding-left: 10px;
font-size: larger;
color: white;
}
.fileviewerdiv{
float: right;
margin-top: -31.5%;
width: 20%;
height: 65vh;
border: 1px solid black;
border-radius: 10px;
}
.labelheaderfileviewer{
color: white;
padding-top: 10px;
letter-spacing: 2px;
font-weight: bold;
align-content: center;
padding-left: 35%;
height: 30px;
width: 65%;
background-color: rgb(75, 93, 103);
border: 0px solid black;
border-radius: 10px 10px 0px 0px;
}
.AddColumn{
background-image: url("images/addcol.png");
background-repeat: no-repeat;
background-size: 40px;
background-color: rgb(75, 93, 103); 
border: 1px solid rgb(255, 255, 255);
padding: 12px 16px;
font-size: 12px;  
cursor: pointer;
background-position:top;
background-position-y: 5px;
text-orientation: upright;
height: 90px;
width: 90px;
margin-top: 3px;
margin-left:10px;
margin-right: 10px;
text-align:left;
vertical-align: middle;
border-radius: 10px;
}
.AddColumn:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
.button-text-addcolumn1{
background-color: transparent;
position: relative;
color: white;
transform: translateX(-50%);
font-size: smaller;
bottom: -16px;
width: 10%;
left: -10%;
}


.btndeletecolumn{
background-image: url("images/deleteCol.png");
background-repeat: no-repeat;
background-size: 40px;
background-color: rgb(75, 93, 103); 
border: 1px solid rgb(255, 255, 255);
padding: 12px 16px;
font-size: 12px;  
cursor: pointer;
background-position:top;
background-position-y: 5px;
text-orientation: upright;
height: 90px;
width: 90px;
margin-top: 3px;
margin-left: 10px;
text-align:left;
vertical-align: middle;
border-radius: 10px;
}
.btndeletecolumn:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
.button-text-deletecol{
background-color: transparent;
position: relative;
color: white;
transform: translateX(-50%);
font-size: smaller;
bottom: -16px;
width: 10%;
left: -20%;
}
.btnbr{
background-image: url("images/backuprestore.png");
background-repeat: no-repeat;
background-size: 40px;
background-color: rgb(75, 93, 103); 
border: 1px solid rgb(255, 255, 255);
/*padding: 12px 16px;*/
/*padding-left:5px;*/
font-size: 12px;  
cursor: pointer;
background-position:top;
background-position-y: 5px;
text-orientation: upright;
height: 90px;
width: 90px;
margin-top: 3px;
/*margin-left: 10px;*/
text-align:center;
vertical-align: middle;
border-radius: 10px;
}

.btnrenamecolumn{
background-image: url("images/rename.png");
background-repeat: no-repeat;
background-size: 40px;
background-color: rgb(75, 93, 103); 
border: 1px solid rgb(255, 255, 255);
padding: 12px 16px;
font-size: 12px;  
cursor: pointer;
background-position:top;
background-position-y: 5px;
text-orientation: upright;
height: 90px;
width: 90px;
margin-top: 3px;
margin-left: 2px;
text-align:left;
vertical-align: middle;
border-radius: 10px;
}
.btnrenamecolumn:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
.button-text-br{
background-color: transparent;
position: relative;
color: white;
transform: translateX(-50%);
font-size: smaller;
bottom: -16px;
width: 10%;
left: 2%;
}
.button-text-renamcolum{
background-color: transparent;
position: relative;
color: white;
transform: translateX(-50%);
font-size: smaller;
bottom: -16px;
width: 10%;
left: -25%;
}
.contentsbtn{
/* margin-top: 70%; */
/* margin: 10% -20% -30% -20% ; */
width: 100%;
height: 20%;
/* background-color: rgb(255, 255, 255); */
background-color: rgb(243, 243, 243);
border: 1px solid black;
/* margin-top: auto; */
/* margin-left: auto; */
/* margin-right: auto; */
/* align-items: center; */
padding-top: 10px;

/* padding-right: 90px; */
/* padding-left: -30%; */

}
.contentstoeddelre{
height: 70%;
width: 100%;
padding-left: 10px;
/* background-color:aquamarine ; */
}
#tablenames5{
background-color: rgb(255, 255, 255);
color: rgb(0, 0, 0);
width:95.5%;
box-shadow: 2px 2px 2px black;
height: 30px;
}

#tablenames5:hover{
cursor: pointer;
}

#tablenames6{
background-color: rgb(255, 255, 255);
color: rgb(0, 0, 0);
width:95.5%;
box-shadow: 2px 2px 2px black;
height: 30px;
}

#tablenames6:hover{
cursor: pointer;
}
#selectedtablename33{
background-color: rgb(255, 255, 255);
color: rgb(0, 0, 0);
width:95%;
box-shadow: 2px 2px 2px black;
height: 30px;
padding-left: 5px;
}
#columntoadd{
background-color: rgb(255, 255, 255);
color: rgb(0, 0, 0);
width:95%;
box-shadow: 2px 2px 2px black;
height: 30px;
padding-left: 5px;
}
#txtcolumntoadd{
background-color: rgb(255, 255, 255);
color: rgb(0, 0, 0);
width:95%;
box-shadow: 2px 2px 2px black;
height: 30px;
padding-left: 5px;
}
#txtcolumntoadd2{
background-color: rgb(255, 255, 255);
color: rgb(0, 0, 0);
width:95%;
box-shadow: 2px 2px 2px black;
height: 30px;
padding-left: 5px;
}


#saveitencol{
background-color: transparent;
color: rgb(255, 255, 255);
bottom: -16px;
width: 10%;
height: 40px;
width: 150px;
background-color: rgb(75, 93, 103); 
}
#saveitencol:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
#deleteitencol{
background-color: transparent;
color: rgb(255, 255, 255);
bottom: -16px;
width: 10%;
height: 40px;
width: 150px;
background-color: rgb(75, 93, 103); 
}
#deleteitencol:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}

#tablenames51{
background-color: rgb(255, 255, 255);
color: rgb(0, 0, 0);
width:95.5%;
box-shadow: 2px 2px 2px black;
height: 30px;
}

#tablenames51:hover{
cursor: pointer;
}
#newnamerename{
background-color: rgb(255, 255, 255);
color: rgb(0, 0, 0);
width:95%;
box-shadow: 2px 2px 2px black;
height: 30px;
padding-left: 5px;
}
#renameitencol{
background-color: transparent;
color: rgb(255, 255, 255);
bottom: -16px;
width: 10%;
height: 40px;
width: 150px;
background-color: rgb(75, 93, 103); 
}
#renameitencol:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}

/* ################ */

.box {
height: 110%;
width: 30%;
background-color: rgb(75, 93, 103); 
padding-top: 10px;
}
.circle {
border-radius: 50%;
}
.inner-border {
border: 20px solid rgb(75, 93, 103);
box-shadow: inset 0px 0px 0px 2px rgb(255, 255, 255);
box-sizing: border-box; /* Include padding and border in element's width and height */
}
/* CSS3 solution only for rectangular shape */
.inner-outline {
outline: 10px solid rgb(255, 255, 255);
outline-offset: -30px;
}
.ecaloginlabel{
color: white;
font-size: 20pt;
font-weight: bold;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
margin-top: 10px;
margin-left: 10%;
/* margin-right: auto; */
/* align-self: center; */
}
.line{
color: white;
margin-left: 45px ;
margin-top: 5px;
height: 2px;
width: 78.5%;
background-color: white;
}
#imglogo{
padding-left: 28%;
/* align-self: center; */
}
#motherwrapper234 {
height: 79vh;
margin-top: -70px;
display: flex;
padding-top: 100px;
justify-content: center;
}
.uplb{
margin-left: 15px;
color: white;
font-weight: bold;
font-size: 14pt;
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
.uplb2{
margin-left: 5px;
color: white;
font-weight: bold;
font-size: 12pt;
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
.unameandpass{
padding-left: 10px;
}
.tarea{
padding-left: 20px;
border: 0px solid black;
border-radius: 20px;
height: 4vh;
width: 90%;
}
.chkb{
margin-left: 10px;

/* background-color: rgb(150, 150, 150); */
}
.lgbtn{
background-color: rgb(75, 93, 103);
height: 40px;
width: 95%;
border: 1px solid white;
border-radius: 20px;
font-weight: bold;
color: white;

}
.lgbtn:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}
.exitbtn{
margin-top: -5px;
background-color: rgb(238, 40, 66);
color: white;
width: 30px;
height: 30px;
float: right;
}
.exitbtn:hover {
background-color: red;
transition-duration: 0.4s;
cursor: pointer;
}
.aexitbtn{
margin-top: -30px;
margin-right: 10px;
background-color: rgb(238, 40, 66);
color: white;
width: 30px;
height: 30px;
float: right;
}
.aexitbtn:hover {
background-color: red;
transition-duration: 0.4s;
cursor: pointer;
}
.a3exitbtn{
margin-top: 5px;
margin-right: 5px;
background-color: rgb(238, 40, 66);
color: white;
width: 30px;
height: 30px;
float: right;
}
.a3exitbtn:hover {
background-color: red;
transition-duration: 0.4s;
cursor: pointer;
}
.a2exitbtn{
margin-top: -25px;
margin-right: 5px;
background-color: rgb(238, 40, 66);
color: white;
width: 30px;
height: 30px;
float: right;
}
.a2exitbtn:hover {
background-color: red;
transition-duration: 0.4s;
cursor: pointer;
}

.btnhistory{
background-image: url("images/history.png");
background-repeat: no-repeat;
background-size: 28px;
background-color: rgb(75, 93, 103); 
border: 1px solid rgb(255, 255, 255);
padding: 12px 16px;
font-size: 12px;  
cursor: pointer;
background-position:top;
background-position-y: 5px;
text-orientation: upright;
height: 50px;
width: 50px;
margin-top: 3px;
margin-left: 2px;
text-align:left;
vertical-align: middle;
}
.btnhistory:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}

.button-text-history{
  background-color: transparent;
  position: relative;
  color: white;
  font-size: smaller;
  transform: translateX(-50%);
  bottom: -16px;
  width: 10%;
  left: -17%;
}

/* history */

.mainhistorydiv{
margin-top: 5px;
margin-left: 10px;
height: 97vh;
width: 98.5%;
background-color:transparent;
border: 1px solid black;
}
.headerhistory{
padding-top: 7px;
width: 100%;
height: 35px;
background-color: rgb(216, 216, 216);
border: .5px solid black;
}
.hisbtn{
background-color: rgb(75, 93, 103); 
color: white;
border-color: azure;
font-size: 10pt;
text-align: center;
width: 7em;
height: 30px; 
text-align:center;
font-weight: bold;
margin-top:2px;
margin-left: 5px;
}
.hisbtn:hover {
background-color: RoyalBlue;
transition-duration: 0.4s;
cursor: pointer;
}

.exitbtnh{
margin-top: -30px;
margin-right: 5px;
background-color: rgb(238, 40, 66);
color: white;
width: 30px;
height: 30px;
float: right;
}
.historycontents{
overflow-y: auto;

}

.histxt1{
  background-color: rgb(75, 93, 103); 
  color: white;
  border-color: azure;
  font-size: 10pt;
  text-align: center;
  width: 7em;
  height: 30px; 
  text-align:center;
  font-weight: bold;
  margin-top:2px;
  margin-left: 5px;
}

.input#historyid.histxt1{
margin-top: 5px;
/*background-color: rgb(255, 255, 255);*/
color: rgb(0, 0, 0);
width:95%;
box-shadow: 2px 2px 2px black;
height: 30px;
padding-left: 5px;
}

/* ######### item status counts */
/*#pa{*/
/*     background-image: url("images/pending.png");*/
/*    background-repeat: no-repeat;*/
/*    background-size: 30px;*/
/*    background-position:center ;*/
/*    background-position-x: 3px;*/
/*    background-color: rgb(75, 93, 103); */
/*    color: white;*/
/*    border-color: azure;*/
/*    font-size: 10pt;*/
/*    text-align: center;*/
/*    float: right;*/
/*    width: 12em;*/
/*    height: 35px; */
  /* height: 23px; */
/*    margin-right: 13.5em;*/
/*    text-align:left;*/
/*    font-weight: bold;*/
/*    margin-top: -45px;*/
/*}*/
#wop,#step,#wp,#ep,#pa{
 
margin-top: -29px;
  background-color: rgb(7, 52, 82);
  color: rgb(255, 255, 255);
  float: right;
  margin-right: 2px;
  width: 11em;
  height: 30px; 
  padding-top: 5px;
  padding-left: 5px;
     text-align:center; 
    font-weight: bold;
    padding-bottom: 2px;
        border: 1px solid black;
  border-radius:  5px;
}
#wop:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
#step:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
#wp:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
#ep:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
#pa:hover {
  background-color: RoyalBlue;
  transition-duration: 0.4s;
  cursor: pointer;
}
 



.hisbtnacct {
    background-color: rgb(75, 93, 103);
    color: white;
    border-color: azure;
    font-size: 10pt;
    text-align: center;
    width: 10em;
    height: 30px;
    text-align: center;
    font-weight: bold;
    margin-top: 2px;
    margin-left: 5px;
}

.hisbtnacct:hover {
    background-color: RoyalBlue;
    transition-duration: 0.4s;
    cursor: pointer;
}


/* ################# */