html {
  scroll-behavior: smooth;
}

body {

  font-family: Arial, sans-serif;

  margin: 0;

  padding: 0;

}

:root {
  color-scheme: only light;
}
.myInput {

  background-position: 10px 12px; /* Position the search icon */
  background-repeat: no-repeat; /* Do not repeat the icon image */
  width: 100%; /* Full-width */
  font-size: 16px; /* Increase font-size */
  padding: 12px 20px 12px 40px; /* Add some padding */
  border: 1px solid #ddd; /* Add a grey border */
  margin-bottom: 12px; /* Add some space below the input */
}
.container {

  display: flex;

  justify-content: center;

  align-items: center;

  height: 100vh;

}



.card {

  width: 300px;

  background-color: #fff;

  padding: 20px;

  border-radius: 10px;

  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

  text-align: center;

}

h2 {

  color: #007BFF;

  margin-bottom: 20px;

}



.loginForm {

  display: flex;

  flex-direction: column;

}



label {

  text-align: left;

  margin-bottom: 5px;

}

a{

  text-decoration: none;

}

.loginForm input {

  padding: 10px;

  margin-bottom: 10px;

  border: 1px solid #ddd;

  border-radius: 5px;

}



.card button {

  padding: 10px;

  background-color: #007BFF;

  color: #fff;

  border: none;

  border-radius: 5px;

  cursor: pointer;

}



.switch {

  margin-top: 15px;

  font-size: 14px;

}



.switch a {

  color: #007BFF;

  text-decoration: none;

}







li{

  list-style: none;

}

.licard{

  margin-bottom: 15px;

  min-width: 380px;

  background-color: #fff;

  padding: 10px;

  border-radius: 10px;

  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

  height: 70px;

}
.licard h3{
  font-size: 15px;
  margin-left: 8px;
  color: rgb(31, 30, 30);

  float: left;
  margin-bottom: 0;
}

.licard .alink {


  left: 20px;

  position: absolute;

  clear: both;

}

.licard .space{

  margin-bottom: 30px;

  position: relative;

}

.assigned{
  height: 120px;
  background-color: #f3eaea;

}
.formX{
float: right;

}
.formX .x{
  background-color: red;
  width: 0px;
  padding: 15px;
  margin-right: 15px;
  height: 0px;
}
.formX .x:hover {
  width: 0px;

  margin-right: 15px;

  margin-left: 30px;

  background-color: red;

  color: #ddd;

  height: 0px;
}
.shared{
  position: absolute;
  left: calc(380px - 223px);
  bottom: 35px;
}
.licard button{

  float: right;

  margin-left: 5px;

  background-color: #A29BFF;

  border-radius: 5px;

  font-size: 0.8em;

  font-weight: bold;

  color: rgba(24, 24, 24, 0.925);

  border: none;

  width: 140px;

  height: 100%;

  letter-spacing: 0.3px;

  cursor: pointer;

  margin-right: 5px;

  transition: 300ms all;

}


/* .licard button{

  float: right;

  margin-left: 40px;

  background-color: #6A64F1;

  border-radius: 5px;

  font-size: 1em;

  font-weight: bold;

  color: #ddd;

  border: none;

  width: 260px;

  height: 60px;

  letter-spacing: 0.3px;

  cursor: pointer;

  margin-right: 15px;

  transition: 300ms all;

}

.licard button:hover{

  width: 280px;

  margin-right: 5px;



  margin-left: 30px;

  background-color: #A29BFF;

  color: rgba(24, 24, 24, 0.925);



  height: 60px;

} */




.resizer {

  position: absolute;

  top: 0;

  right: 0;

  width: 5px;

  cursor: col-resize;

  user-select: none;

}



.resizer:hover,

.resizing {

  border-right: 2px solid blue;

}



.dragging {

  background-color: #f0f0f0;

}



.container2 {

  z-index: 1;

  position: absolute;

  top: 50px;

  margin-left: 300px;



  transition: margin-left 1s;

}

.toLeft{

  margin-left: 150px;

}

.btnDelete{

  background-color: #fc3f26;

}

#showPassword{

  background-color: #0ace14;

}

#rightside .formbold-form-input
{
  width: 100%;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #e0e0e0;
  background: white;
  font-weight: 500;
  font-size: 15px;
  color: #6b7280;
  outline: none;
  resize: none;
}

#rightside .formbold-form-label {
  display: block;
  font-weight: 500;
  font-size: 14px;
  color: #07074d;
  margin-bottom: 1px;
  width: 140px;
}


#rightside .names {
width: 100%;
}
#rightside .nameinp{
  width: 150px;
  float: left;
}
#rightside .adresinp{
  float: right;
}
#rightside .adresinp .formbold-form-input{
 width: 150px;
}
#rightside .adresinp{
  width: 150px;
}

/* 
.formbold-btn:hover {
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.05);
} */
#rightside .passt{
  margin-top: 5px;
}
.allbuttons{
  width: 100%;
  height: 200px;
}
.allbuttons .formbold-btn {
float: left;
width: 160px;

font-size: 14px;

padding: 7px 16px;
border: none;

}
#rightside .allbuttons .deletebtn{
  float: right;
}