@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
* {
  margin: 0%;
  padding: 0%;
  box-sizing: border-box;
  font-family: "Poppins", system-ui;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
body {
  width: 100%;
  height: 100%;
  /* overflow: hidden; */
}

body::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #f5f5f5;
}

body::-webkit-scrollbar {
  width: 10px;
  background-color: #f5f5f5;
}

body::-webkit-scrollbar-thumb {
  background-color: black;

  background-image: -webkit-gradient(
    linear,
    0 0,
    0 100%,
    color-stop(0.5, rgba(255, 255, 255, 0.2)),
    color-stop(0.5, transparent),
    to(transparent)
  );
}

.main {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
}

.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 85px;
  background-color: #e2e2e2;
  padding-left: 0;
  position: fixed;
  width: 100%;
  z-index: 999;
  padding-left: 9px;
  border-bottom: 1px solid #d6d6d6;
}

.head1 {
  box-shadow: 0px 4px 10px 0px #0000004f;
  width: 173px;
  border-radius: 11px;
  overflow: hidden;
}

.head2 {
  display: flex;
  align-items: center;
  gap: 29px;
}

.head2 i {
  background-color: #fff;
  color: #000;
  padding: 7px;
  border-radius: 50%;
  font-size: 16px;
  width: 33px;
  height: 33px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.head1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.head2 img {
  width: 31px;
  mix-blend-mode: color-burn;
}

.head2 select {
  padding: 2px 7px;
  font-size: 12px;
  border: 1px solid #b7b7b7;
  outline: none;
  color: #5c5c5c;
  border-radius: 5px;
}

.i2 {
  padding-top: 8px;
}

#header {
  padding-bottom: 5px;
  width: 100%;
  height: 55px;
  position: fixed;
  width: 100%;
  background: dodgerblue;
}

#header p {
  font-size: 22px;
  font-weight: 700;
}

.tab-papa div {
  color: black !important;
}

#tabs input {
  display: none;
}

i {
  cursor: pointer;
}
.rechargebtn {
  width: 100%;
  padding-left: 18px;
  padding-bottom: 10px;
}
#tabs label {
  width: 213px;
  margin: 0 auto;
  padding: 5px 10px;
  cursor: pointer;
  margin-bottom: 1rem;
}

#home-lb {
  background-color: #9c3b3b;
  color: #000000;
}

.text {
  /* margin-top: 4.7rem; */
  width: 100%;
}

.text .txt-head {
  font-weight: 600;
  font-size: 18px;
  padding: 5px 0;
}

.project-txt {
  width: 100%;
}

.tab {
  overflow: hidden;
  background-color: #f1f1f1;
}
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}
.tab button:hover {
  background-color: #ddd;
}
.tab button.active {
  background-color: #8f0000 !important;
  color: #fff;
}

.tabcontent {
  display: none;
  padding: 6px 12px;
}
.Plantabcontent {
  display: none;
  padding: 6px 12px;
}
.Plantabcontent2 {
  display: none;
  padding: 6px 12px;
}
@media screen and (max-width: 490px) {
  #tabs {
    padding-bottom: 5px;
    margin-bottom: 5px;
    border-bottom: 2px solid #9c3b3b;
  }
}

.wrap {
  /* display: flex; */
  padding: 40px 10px;
  justify-content: center;
  padding-top: 3.9rem;
  width: 100%;
}

.wrap #home-txt {
  width: 100%;
  /* padding: 40px; */
}

.i1 {
  position: fixed;
  top: 63px;
  left: 7px;
  font-size: 25px;
}

.i2 {
  padding-top: 10px;
  text-align: end;
  padding-right: 12px;
  /* margin-bottom: 1rem; */
}

.first-text span button {
  all: unset;
  cursor: pointer;
  color: #fff;
  background: #b72828;
  padding: 7px;
  font-size: 12px;
  box-shadow: 2px 2px 3px #29292929;
  border-radius: 5px;
}

.second-text {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 18px;
}

.second-text input {
  all: unset;
  border: 1px solid #aeaeae;
  border-radius: 6px;
  padding: 5px 11px;
  font-size: 13px;
}

.third-text {
  margin-top: 1rem;
}

.third-text th span {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-left: 9px;
  line-height: 2px;
  position: relative;
  top: 3px;
}

.wrap-dk {
  width: 100%;
  padding: 33px;
}

.th {
  display: flex;
  align-items: center;
  justify-content: center;
}

.th span i {
  position: relative;
  line-height: 5px;
  font-size: 10px;
}

tbody button {
  padding: 2px 9px;
  font-size: 13px;
}

.fouth-text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 23px;
}

.fouth-text span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  text-transform: capitalize;
}

.fouth-text span button {
  padding: 0px 7px;
  border: 2px solid gray;
}

p {
  margin-bottom: 0 !important;
}
.tabdiv {
  width: 100%;
  height: auto;
}
.text-update {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  padding-right: 24px;
}

.fifth-text {
  /* border: 2px solid black; */
  /* width: 200px; */
  height: auto;
  display: flex;
  margin-top: 2rem;
  transition: cubic-bezier(0.19, 1, 0.22, 1) 3s;
}
.fifth-text i {
  /* background: #b51c1c; */
  color: #fff;
  padding: 0px 10px;
}
.first-sem {
  width: 236px;
  border-right: none;
  display: flex;
  flex-direction: column;
  padding: 10px 0px;
  gap: 11px;
  background: linear-gradient(90deg, #b71717, #140101);
  color: #fff;
}

.second-sem {
  border: 2px solid gray;
  width: 100%;
}

.sem1 {
  /* height: 53px; */
  display: flex;
  align-items: center;
  padding: 10px;
}

.sem2 {
  /* height: 73px; */
  display: flex;
  padding: 10px;
  gap: 16px;
  align-items: center;
}
.sem-two {
  height: 500px;
  overflow-y: scroll;
}
.sem2-main {
  display: flex;
  flex-direction: row-reverse;
  padding: 10px;
  gap: 11px;
  /* height: 73px; */
  align-items: center;
}

.circle {
  width: 38px;
  height: 38px;
  border: 2px solid;
  border-radius: 50%;
  overflow: hidden;
  background: #ff9cade0;
  border: none !important;
}

.circle img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.rectangle p {
  color: black;
  overflow-wrap: break-word;
}
.rectangle {
  width: 363px;
  background: #fff;
  padding: 16px;
  height: auto;
  border-radius: unset;
  border-radius: 5px;
}

.second-sem {
  border: none;
  width: 100%;
  display: flex;
  flex-direction: column;
  /* align-items: center; */
  justify-content: space-between;
  background: radial-gradient(#d73030, #420808);
  color: #fff;
}

.sem3 {
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

.sem3 input {
  width: 569px;
  padding: 10px;
  outline: none;
  border-radius: 13px;
  border: 1px solid gray;
}

.sem3 span {
  display: flex;
  align-items: center;
  gap: 18px;
}

.sem3 span button {
  padding: 3px 15px;
  border: none;
  border-radius: 6px;
}

.project-txt .CreatCompany1 {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  gap: 30px;
  row-gap: 67px;
}

.project-txt .CreatCompany1 button {
  padding: 10px;
  border: none;
  background: #8f0000;
  color: #fff;
  border-radius: 5px;
  white-space: nowrap;
  font-size: 14px;
}

.project-txt select {
  border-radius: 3px;
  padding: 3px 10px;
  border: 1px solid #e10a0a;
}

.FormBody1 {
  gap: 15px;
  width: 30%;
  height: 50px;
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
}

.FormBody1 input {
  border: 1px solid #8f0000;
  border-radius: 4px;
  padding: 5px 10px;
  font-size: 13px;
  width: 232px;
  outline: none;
}
.Mysand {
  z-index: 1050 !important;
}
.FormBody1 button {
  width: auto;
  background: #8f0000;
  color: #fff;
  border: none;
  background: linear-gradient(93.26deg, #d31313 2.68%, #280303 97.65%);
  box-shadow: 1px 2px 6px #999999;
  padding: 3px 16px;
}
.modal-body h4 {
  margin: 0;
  font-size: 21px;
  font-weight: 600;
}
/* end */
.project-txt .FormBody2 {
  width: 33%;
}

.project-txt .FormBody2 .modal-content {
  background: #fff !important;
  height: 200px;
}

.FormBody2 .modal-content .modal-body {
  gap: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  align-items: center;
}

/* Assign Company Complaint */

.project-txt .FormBody3 {
  width: 25%;
}

.project-txt .FormBody3 .modal-content {
  background: #fff !important;
  /* height: 400px */
}

.FormBody3 .modal-content .modal-body {
  gap: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  align-items: center;
}

/* End */

.tab-maker {
  width: 236px;
  padding: 10px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.tab-maker input {
  all: unset;
}

.text-flex1 input {
  border: 1px solid black;
  border-radius: 5px;
  padding: 3px 5px;
  outline: none;
  font-size: 14px;
}
.tab-maker select {
  width: 100%;
  border: 1px solid black;
  border-radius: 5px;
  padding: 3px 5px;
  outline: none;
  font-size: 14px;
}

.flex-last {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.text-flex1 {
  display: flex;
  align-items: center;
  gap: 24px;
  justify-content: center;
}

.text-flex1 button {
  color: #fff;
  background: #8f0000;
  padding: 5px 19px;
  border: none;
  border-radius: 5px;
  font-size: 13px;
}
.three-update {
  width: 80%;
}

.no button {
  all: unset;
  width: 100%;
  padding: 8px 0px;
  display: flex;
  align-items: center;
  gap: 9px;
  outline: none;
  font-size: 19px;
  text-transform: capitalize;
  background: linear-gradient(40deg, #8f0000, #000000);
  box-shadow: 1px 2px 6px #999999;
  margin-top: 0rem;
  color: #fff;
  justify-content: center;
}

.no img {
  width: 30px;
}

.view {
  display: flex;
  flex-direction: column;
  gap: 25px;
  background: radial-gradient(#d73030, #420808);
  padding: 14px;
  /* opacity: 0; */
  transition: cubic-bezier(0.19, 1, 0.22, 1) 3s;
}

.box-view {
  display: flex;
  align-items: center;
  /* gap: 25px; */
  justify-content: space-around;
}

.box-view1 {
  width: 538px;
  height: 254px;
}

.box-view button {
  padding: 3px 22px;
}

.inputs input {
  display: block !important;
}

.text-t img {
  position: absolute;
  left: 1253px;
  top: 36px;
  width: 706px;
  opacity: 0.4;
}

.inputs {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 421px;
  gap: 20px;
}

.inputs input {
  width: 218px;
  border-radius: 6px;
  padding: 7px;
}

.resp-nav1 {
  width: 299px !important;
  padding: 15px;
}

.wrap-wala {
  width: 301px;
  padding: 17px;
}

.first-text-one {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.tinder {
  display: flex;
  align-items: center;
  gap: 9px;
}

.tinder2 {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
}

.tinder3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.tinder2 button {
  box-shadow: 1px 2px 6px #999999;
  border: none;
  border-radius: 4px;
}

.tinder button {
  /* box-shadow: 1px 2px 6px #999999; */
  border: none;
  border-radius: 4px;
  background-color: #fff;
}

.red {
  color: red;
}

.detail1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  width: 45%;
}

.detail1 input {
  padding: 7px 7px;
  font-size: 12px;
  width: 212px;
  outline: none;
  border: 1px solid #cecccc;
  border-radius: 5px;
}

.profile .detail1 {
  gap: 6vw;
}
.profile .detail1 p {
  /* white-space: nowrap; */
  width: 100%;
}
.contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* overflow-y: scroll; */
  width: 100%;
}

.detail-box {
  width: 100%;
  padding: 2rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.h2 {
  text-align: center;
}

.bol {
  padding: 0px 20px;
  font-weight: 700;
}

.detail-box button {
  display: flex;
  align-items: center;
  margin: auto;
  border: none;
  width: 100px;
  border-radius: 5px;
  justify-content: center;
  padding: 5px;
  font-size: 17px;
  gap: 9px;
  color: #fff;
  box-shadow: 2px 2px 5px #262626;
  background: linear-gradient(40deg, #8f0000, #000000);
  box-shadow: 1px 2px 6px #999999;
}

.detail-box img {
  width: 23px;
  border-radius: 50%;
  height: 23px;
}

.text-third {
  padding: 0rem 2rem;
}

.text-third1 {
  padding: 30px 4rem;
}

.add-one {
  margin-left: 29px;
}

.but {
  display: flex;
  align-items: center;
  gap: 8px;
}

.but input {
  all: unset;
  /* background: #e0e0e0; */
  border-radius: 5px;
  width: 270px !important;
  padding: 4px 11px;
  font-size: 13px;
}

.but select {
  width: 300px !important;
  font-size: 13px;
  height: 35px;
  outline: none;
}
.inputread input {
  background: #e0e0e0;
}
.dropdowns {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 15px;
  /* justify-content: space-between; */
  /* gap: 1px; */
}

.drop1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.drop1 p {
  border-bottom: 1px solid gray;
  width: 100%;
  /* display: none; */
  text-align: center;
  background: #8f0000;
  color: #fff;
  padding: 9px 10px;
  font-size: 12px;
  font-weight: 500;
}

.button-wala {
  display: flex;
  align-items: center;
  border: none;
  width: 91px;
  border-radius: 5px;
  justify-content: center;
  padding: 6px;
  font-size: 14px;
  gap: 9px;
  color: #fff;
  background: linear-gradient(93.26deg, #d31313 2.68%, #280303 97.65%);
  box-shadow: 1px 2px 6px #999999;
  padding: 5px 16px;
}

.button-wala img {
  width: 23px;
  border-radius: 50%;
  height: 23px;
}

.dropdowns1 {
  display: flex;
  justify-content: center;
  padding-bottom: 31px;
}

.drop2 {
  display: flex;
  align-items: center;
  flex-direction: column;
}

.drop2 span {
  display: flex;
  width: 100%;
  border: 1px solid #cdcccc;
  border-left: none;
  border-right: none;
  padding: 6px 13px;
  height: 40px;
  gap: 5px;
  border-bottom: none;
  align-items: center;
}

.drop2change span {
  display: initial !important;
  height: auto;
}

.drop2 input[type="radio"] {
  margin-bottom: 0px;
}
.drop2change input {
  all: unset;
  border: none;
  background: #d5d5d5;
  width: 155px;
  background: #fff;
  /* box-shadow: 1px 1px 4px #bdbcbc;  */
  border-radius: 4px;
}

.drop-wala {
  width: 200px;
}

.drop2chane2 span {
  justify-content: space-between;
}

.drop2chane2 button {
  font-size: 12px;
  padding: 2px 8px;
}

/* .drop2chane2 button:hover {
    text-transform: none;
    background: #ff0f0f;
    transform: scale(1.2);
} */

.drop2chane2 span p {
  font-size: 12px;
}

.drop2 span label {
  font-size: 13px;
}

.drop2 {
  border: 1px solid #cdcccc;
  /* padding: 10px; */
  border-right: none;
}

.drop2 input {
  margin-bottom: 7px;
  text-align: center;
  font-size: 11px;
  padding: 9px;
}

.drop2new {
  padding: 0px;
  border-right: 1px solid #cdcccc;
}

.drop2change hr {
  width: 198px;
}
.drop2new input {
  padding: 7.7px 7px;
  border: 1px solid #cdcccc;
  outline: none;
  margin-bottom: 0px;
  border-bottom: none;
  border-left: none;
  border-right: none;
  text-align: center;
  height: 40px;
  font-size: 15px;
}

.new-drop {
  padding: 0px 33px;
}

.new-drop .bol1 {
  padding-bottom: 0 !important;
}

.update-span {
  display: flex;
  align-items: center !important;
  gap: 4px !important;
  flex-direction: row !important;
}

.update-span select {
  width: 18px;
  height: 18px;
  border-radius: 50%;
}

.update-span p {
  font-size: 13px;
}

.track td p {
  font-size: 13px;
}

.update-span2 {
  display: block !important;
  line-height: normal !important;
  padding: 0 !important;
}

.hr-button {
  display: flex;
  align-items: center;
  border: none;
  background: #fff;
  width: 105px;
  background: radial-gradient(#d73030, #420808);
  border-radius: 5px;
  justify-content: center;
  padding: 4px;
  font-size: 17px;
  gap: 9px;
  color: #fff;
}

.hr-button img {
  width: 23px;
  border-radius: 50%;
  height: 23px;
}

.hr-input {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 13px;
}

.hr-input input {
  width: 245px;
  height: 39px;
  border-radius: 8px;
  padding: 6px;
  border: none;
  font-size: 10px;
  border: 1px solid #c8c8c8;
}

.add-hr {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 13px;
  background: #fff;
  padding: 16px;
  border-radius: 11px;
  width: 412px;
}

.add-hr h3 {
  font-size: 20px !important;
}

.add-hr h3 {
  margin-bottom: 0 !important;
  font-weight: 700 !important;
  color: black;
}

.heading-text {
  margin-bottom: 1rem;
  text-align: center;
}

.tab-hr-wrap {
  background: linear-gradient(40deg, #8f0000, #000000);
  padding: 21px;
  color: #fff;
}
.tab-hr {
  display: flex;
  align-items: center;
  background: #ffffff59;
  width: 613px;
  gap: 41px;
  justify-content: center;
  padding-bottom: 2rem;
  padding: 18px 39px;
  margin: auto;
  border-top-right-radius: 60px;
  border-bottom-left-radius: 60px;
}
.tab-hr span {
  width: 297px;
}
.img {
  width: 161px;
  background: #e58989;
  height: 161px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.img i {
  font-size: 100px;
}

.hr-profile {
  padding: 2rem 0px;
}

.hr-profile h4 {
  text-align: center;
}

.tab-hr .para-hr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
}

.hr-profile input {
  all: unset;
}

.tab-hr-detail {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-top: 44px;
  padding-left: 169px;
  width: 534px;
}
.tab-hr-detail .detail-text {
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
}

.tab-hr-detail p {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 320px;
}
.data-text span {
  font-weight: 400;
  text-transform: math-auto;
}
.img img {
  width: 100%;
  object-fit: cover;
}

.upload img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.upload {
  background: gray;
  width: 400px;
  height: 300px;
}

.button-wala-upload1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 92px;
  padding: 10px 51px;
}

.button-wala-upload {
  display: flex;
  align-items: center;
  padding: 19px;
  position: relative;
}

.button-wala-upload input {
  position: absolute;
  opacity: 0;
}
.button-wala-upload button {
  padding: 10px 16px;
  font-size: 12px;
  border: none;
  background: #8f0000;
  color: #fff;
  outline: none;
  border-radius: 5px;
}
.card-body {
  background: #8f0000;
}
.card {
  border-radius: 10px !important;
  overflow: hidden;
}

.upload-buttons hr {
  margin: 2rem 0px;
}

.button-wala-upload1 button {
  padding: 5px 22px;
  border: 1px solid #c63131;
  border-radius: 6px;
  font-size: 14px;
  color: #860000;
  background-color: #fff;
}

.recharge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 37px;
  padding: 1rem !important;
}

.recharge1 {
  display: flex;
  border-radius: 11px;
  flex-direction: column;
  width: 400px;
  height: 330px;
  align-items: center;
  padding: 0px;
  background: linear-gradient(40deg, #8f0000, #000000);
  color: #fff;
  justify-content: center;
  gap: 12px;
}
.recharge1 h3 {
  font-size: 24px;
  margin: 0;
}

.recharge1 .RechargeTable {
  width: 100%;
}
.recharge1 .RechargeTable tbody {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
}
.recharge1 .RechargeTable tr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 80%;
}
.data_td {
  width: 100px;
}

.AllPlan {
  height: 270px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: space-around;
}

.AllPlan h2 {
  font-size: 22px;
  font-weight: 700;
}

.AllPlan .PlanTable {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  height: 200px;
}

.AllPlan .PlanTable .Table001 {
  background: linear-gradient(101deg, #8f0000, #000000);
  width: 25%;
  height: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #fff;
  font-size: 15px;
  justify-content: flex-end;
  border-radius: 10px;
}

.Table001 .Thead1 {
  display: flex;
  width: 60%;
  justify-content: space-between;
  margin-left: 80px;
}

.Table001 .Thead2 {
  display: flex;
  width: 60%;
  justify-content: space-between;
  margin-left: 80px;
}

.Table001 .Thead1 i {
  font-size: 30px;
  display: flex;
  color: #03c903;
}

.redIcon {
  color: red !important;
  font-size: 30px;
  display: flex;
}

.Table001 h3 {
  font-size: 20px;
}

.Table001 table {
  width: 90%;
  /* height: 120px; */
  margin-left: 26px;
  caption-side: bottom;
  border-collapse: collapse;
  margin-bottom: 8px;
}

/* .Table001 table tbody, td, tfoot, th, thead, tr {
    height: 31px;
} */

.Table001 .RechargeButton {
  width: 100%;
  height: 44px;
  display: flex;
  justify-content: center;
  background-color: #ffffff7a;
  align-items: center;
}

.Table001 .RechargeButton button {
  width: 45%;
  height: 25px;
  border-radius: 20px;
  border: none;
  font-size: 12px;
  color: #fff;
  background-color: #4eff4e9c;
}

.IncomingPlanAll {
  display: flex;
  width: 100%;
  margin-top: 20px;
  flex-direction: column;
  align-items: start;
  gap: 20px;
}
.IncomingPlanAll h3 {
  padding-left: 18px;
  margin-bottom: 0;
  font-weight: 600;
  font-size: 26px;
}
.Plan1A h4 {
  font-size: 21px;
  font-weight: 500;
}

.IncomingPlanAll .IncomingPlanAll1 {
  display: flex;
  width: 100%;
  height: auto;
  justify-content: left;
  align-items: center;
  gap: 30px;
  flex-wrap: wrap;
}
a {
  text-decoration: none !important;
}
.IncomingPlanAll .IncomingPlanAll1 .Plan1A {
  border-radius: 10px;
  width: 30%;
  display: flex;
  flex-direction: column;
  color: #fff;
  background: linear-gradient(40deg, #8f0000, #000000);
  align-items: center;
  padding: 10px;
  gap: 15px;
}

.IncomingPlanAll .IncomingPlanAll1 .Plan1A tr {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 3px 17px;
}
.IncomingPlanAll .IncomingPlanAll1 .Plan1A tbody {
  width: 100%;
}
.IncomingPlanAll .IncomingPlanAll1 .Plan1A table {
  display: flex;
  width: 100%;
  justify-content: center;
  font-size: 13px;
  align-items: center;
  text-align: center;
}

.Plan1A .DelEdit {
  display: flex;
  align-items: flex-end;
  padding: 5px;
  width: 93%;
  justify-content: space-between;
  flex-direction: row-reverse;
}
.IncomingPlanAll .IncomingPlanAll1 .Plan1A tr td {
  font-size: 15px;
}

.Plan1A .DelEdit div {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  font-size: 17px;
  justify-content: center;
  border-radius: 360px;
  background: #fff;
  color: #db0202;
}
.Plan1A .DelEdit .bi-pencil-square {
  color: #4cff00;
}
.Plan002 {
  display: flex;
  width: 100%;
  /* margin-top: 40px; */
  flex-direction: column;
  align-items: center;
}
.Plan002 h3 {
  font-size: 25px;
  font-weight: 600;
}
.Plan002 img {
  width: 25px;
}
.Plan002 .SellectPlan {
  width: 50%;
  height: 40px;
  text-align: center;
  margin: 25px;
  padding: 0px 17px;
  border: none;
  color: #fff;
  text-transform: capitalize;
  outline: none;
  border-radius: 6px;
  background: #8f0000;
}

.Plan002 .input-group {
  position: relative !important;
  display: flex;
  align-items: center;
  width: 35% !important;
  padding: 18px;
}

.Plan002 .Plan02 {
  display: flex;
  width: 100%;
  height: 250px;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
  gap: 25px;
}

.Plan002 .Plan02 table {
  width: 90%;
  height: 130px;
  font-size: 13px;
  margin-left: 27px;
}

.Plan002 .Plan02 .Plan1B {
  height: 230px !important;
  border-radius: 10px;
  width: 25%;
  display: flex;
  flex-direction: column;
  color: #fff;
  background: linear-gradient(40deg, #8f0000, #000000);
  align-items: center;
}

.Plan002 .Plan02 .Plan1B .DelEdit {
  display: flex;
  align-items: flex-end;
  width: 100%;
  background: #ffffff61;
  height: 60px;
  padding: 5px;
  justify-content: space-between;
}

.Plan002 .Plan02 .Plan1B .DelEdit div {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  font-size: 20px;
  justify-content: center;
  border-radius: 360px;
  background: #fff;
  color: #db0202;
}

.Plan002 .Plan02 .Plan1B .DelEdit .AddIcone02 {
  font-size: 25px;
  color: #fff;
  background: #21e621;
}

.Plan002 .Plan02 .Plan1B .DelEdit .AddIcone02 i {
  display: flex;
}

.Plan002 .Plan02 .Plan1B .PlanIcon02 {
  display: flex;
  width: 100%;
  height: 50px;
  justify-content: space-around;
  align-items: center;
  background: #ffffff61;
}

.Plan002 .Plan02 .Plan1B .PlanIcon02 h4 {
  margin-left: 71px;
  width: 37%;
  font-weight: 400;
  display: flex;
  height: 100%;
  /* text-align: center; */
  align-items: center;
}

.Plan002 .Plan02 .Plan1B .PlanIcon02 i {
  color: #17d617;
  width: 23px;
  font-size: 27px;
  border-radius: 3px;
  height: 23px;
  display: flex;
  background: #fff;
  justify-content: center;
  align-items: center;
}

.Plan002 .Plan02 .Plan1B .PlanIcon02 .IconX {
  color: #f1313f !important;
}

.re1 {
  display: flex;
  align-items: center;
  gap: 18px;
  /* padding: 20px; */
}

.re1 span {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
}

.main2 {
  display: flex;
  padding: 4rem 0px;
  overflow: hidden;
  align-items: center;
  padding-bottom: 0;
}

.left2 {
  width: 574px;
  height: 100vh;
  background-color: #ffffff;
  box-shadow: 1px 2px 6px #999999;
  z-index: 9;
}

.left {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: flex-end;
  gap: 24px;
}

.left2 h2 {
  padding-bottom: 19px;
  color: #ffff;
  font-size: 25px;
  font-weight: 700;
}

.left input {
  border: 2px solid #b90303;
  padding: 8px 12px;
  border-radius: 12px;
  width: 302px;
  outline: none;
  font-size: 13px;
}

.left button {
  border: none;
  border-radius: 4px;
  margin-top: 13px;
  background: linear-gradient(122deg, #ff1717, #000000);
  color: #fff;
  padding: 4px 26px;
  box-shadow: 1px 1px 2px #484848;
  transition: cubic-bezier(0.19, 1, 0.22, 1) 1s;
}
.left button:hover {
  scale: 0.9;
}

.left img {
  width: 24px;
}

.left2 {
  background: linear-gradient(122deg, #ff1717, #000000);
  display: flex;
  flex-direction: column;
  /* align-items: center; */
  justify-content: flex-end;
  padding: 1rem;
}

.right {
  width: 956px;
  overflow: hidden;
  /* height: 800px; */
}

.right img {
  width: 581px;
  position: relative;
  bottom: -79px;
  right: -414px;
  opacity: 0.2;
}

.recharge {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 37px;
  padding: 2rem;
}

/* .span1 input {
    width: 25px;
    height: 25px;
}

.span2 input {
    width: 62px;
}

.span3 input {
    width: 62px;
} */

.plan {
  display: flex;
  flex-direction: column;
  /* align-items: center; */
  gap: 10px;
  /* padding: 1rem; */
  width: 100%;
  text-align: center;
  color: #fff;
}

.IncomingPlan {
  width: 100%;
  display: flex !important;
  justify-content: space-around;
}

.IncomingPlan .Txt1 {
  width: 179px !important;
  height: 50px;
  color: #fff;
  background-color: #8f0000;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  border: none;
}

/* .IncomingPlan .Txt1:hover {
    background: #e11313 !important;
    border-radius: 5px;
    border: none;
    transform: scale(1.1);
}

button:hover{
    transform: scale(1.1);
}

i:hover{
    transform: scale(1.1);
} */

.AllIncoming1 {
  width: 100%;
  display: flex;
  flex-direction: column;
  /* justify-content: center; */
  align-content: center;
  align-items: center;
}

.IncomingPlan2 {
  width: 40%;
  text-align: center;
  font-size: 15px;
  height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.IncomingPlanTable {
  background: linear-gradient(40deg, #8f0000, #000000);
  border-radius: 10px;
  width: 100%;
  height: 250px;
  display: flex;
  color: #fff;
  align-content: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.IncomingPlanTable form {
  width: 100%;
}
.wrap_hr_admin .IncomingPlanAll .IncomingPlanAll1 {
  width: 83%;
  gap: 7px;
  margin: auto;
}

.IncomingPlanTable table {
  width: 100%;
  height: 185px;
  text-align: start;
  display: flex;
  justify-content: center;
  align-items: center;
}
.IncomingPlanTable table tr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 80%;
  margin: auto;
}
.IncomingPlanTable table tbody {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  gap: 5px;
}

.IncomingPlanTable table input {
  width: 100%;
  border-radius: 4px;
  border: none;
  background: #ded9d9;
  outline: none;
  padding: 2px;
}

.IncomingPlanTable button {
  /* width: 60px; */
  /* margin-top: 20px; */
  font-weight: 500;
  color: #a60808;
  border-color: #ee6565;
  border-radius: 4px;
  padding: 3px 22px;
  float: right;
  margin-right: 50px;
}

.recharge3 {
  background: #fff2f2;
  /* padding: 23px; */
}

.plan .plan-wala {
  background: #bb5b5b;
  line-height: 32px;
}

.recharge2 {
  display: flex;
  align-items: center;
  gap: 30px;
}

.recharge3 {
  display: flex;
  width: 240px;
  height: 290px;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 36px 0px;
  border-radius: 10px;
}

.recharge3 button {
  all: unset;
  background-color: #b8b8b8;
  padding: 5px 10px;
}

.pa {
  font-size: 16px;
  font-weight: 700;
}

.recharge1 span input {
  background: #c4c4c45e;
  border: none;
  outline: none;
  width: 93px;
  height: 25px;
  border-radius: 4px;
  text-align: center;
  color: #fff;
  font-size: 12px;
}

.alert-type {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 16px;
  width: 100%;
  background: #fff;
}

.alert-type textarea {
  height: 174px;
  width: 100%;
  padding: 10px;
  background: #fffdfdde;
  outline: none;
  border: 1px solid #8f0000;
  border-radius: 5px;
}

.alert-type button {
  padding: 5px 11px;
  border: none;
  border-radius: 4px;
  font-size: 14px;
  color: #fff;
  background: linear-gradient(40deg, #8f0000, #000000);
}

#myForm {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  background: #ffffffe8;
  padding: 21px;
  border-top-right-radius: 92px;
  border-bottom-left-radius: 92px;
  height: 100%;
  width: 100%;
  justify-content: center;
}

#Employee {
  width: 100% !important;
}

.resp-nav ul {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding-top: 18px;
}

.resp-nav li {
  width: 100%;
}

.resp-nav li button {
  width: 100%;
  box-shadow: 1px 3px 4px #bfbfbf;
  border-radius: 0px !important;
}

.nav-pills .nav-link {
  color: black;
  background: #fff !important;
  text-align: start;
  font-size: 13px;
  font-weight: 600;
}

.nav-pills .nav-link:hover {
  color: black !important;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff;
  background-color: #8f0000 !important;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link:hover {
  color: #fff !important;
}

/* .modal-content {
  background-color: transparent !important;
  border: unset !important;
} */

/* .first-text span button:hover {
    color: #fff !important;
    background-color: #8F0000 !important;
    border-color: unset !important;
} */

/* .first-text span button:focus {
    box-shadow: 2px 2px 2px #00000085 !important;
} */

.notification .modal-content {
  width: 500px;
}
.dt-button {
  background-color: #8f0000 !important;
  color: #fff !important;
}
.notification .modal-dialog {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

@media (min-width: 576px) {
  .notification .modal-dialog {
    max-width: unset;
    margin: unset;
  }
}

.button-sent {
  width: 100%;
  padding: 10px;
  display: flex;
  gap: 11px;
  justify-content: space-evenly;
  align-items: center;
  padding-bottom: 0;
}

.head-view {
  display: flex;
  /* align-items: center; */
  justify-content: space-between;
  color: #fff;
  width: 100%;
}

.box-view button:nth-child(2) {
  border: none;
  background: green;
  color: #fff;
  box-shadow: 1px 1px 2px green;
}

.box-view button:nth-child(3) {
  background: red;
  border: none;
  color: #fff;
  box-shadow: 1px 1px 2px red;
}

.box-view1 textarea {
  width: 100%;
  height: 100%;
  outline: none;
  padding: 10px;
}

.box-view button:hover {
  scale: 0.9;
  transition: cubic-bezier(0.19, 1, 0.22, 1) 1s;
}

.edit .modal-dialog {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.edit .modal-content {
  width: 500px;
}

.edit .alert-type textarea {
  height: 344px !important;
}

.table > :not(caption) > * > * {
  padding: 0.5rem 0.5rem;
  background-color: var(--bs-table-bg);
  border-bottom-width: 1px;
  box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
  border: 1px solid #d7d7d7;
  text-align: center;
}

.table > tbody {
  border: 1px solid #c5c5c5 !important;
  border-style: double !important;
}

.page-show {
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.page-show2 {
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.tasklisassign {
  margin-top: 10px;
  display: flex;
}
.page-show button {
  color: #000000;
  display: flex;
  height: 27px;
  align-items: center;
  border: none;
  border-radius: 4px;
  text-transform: uppercase;
  font-size: 10px;
}
.page-show2 button {
  color: #000000;
  display: flex;
  height: 27px;
  align-items: center;
  border: none;
  border-radius: 4px;
  text-transform: uppercase;
  font-size: 10px;
}

.page-td {
  padding: 2px 2px;
  border-radius: 5px;
}

.sem3 span button:nth-child(1) {
  color: red;
}

.sem3 span button:nth-child(2) {
  color: blue;
}

.user-name {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.first-sem .users-head p {
  text-align: center;
}

.first-sem .user-name p {
  background: #dbd3d3;
  color: #000000;
  padding: 3px;
}

#pills-document #Employee4 button {
  padding: 1px 8px;
  font-size: 13px;
  background: #fff;
  border: 1px solid #b20000;
  color: #ba0000;
  border-radius: 4px;
  font-family: emoji;
}

#pills-document #Employee4 select {
  border: 1px solid gray;
  border-radius: 30px;
  padding: 3px 8px;
  margin: 0px 11px;
}

.table > :not(caption) > * > * {
  font-size: 14px;
}

.button-upload {
  background: #226d00 !important;
  color: #ffff !important;
  border: none !important;
  white-space: nowrap;
  padding: 3px 9px;
  border-radius: 4px;
}
.button-upload i {
  position: relative;
  top: -3px;
}

.button-upload1 {
  color: #ffff !important;
  border: none !important;
  white-space: nowrap;
  padding: 3px 9px;
  border-radius: 4px;
  background: #005eff;
}
.button-upload1 i {
  position: relative;
  top: -2px;
}

.button-upload2 {
  color: black !important;
  border: none !important;
  white-space: nowrap;
  padding: 0px 0px;
  display: flex;
  border-radius: 4px;
  gap: 2px;
  border: 1px solid #ff0000 !important;
  padding-right: 5px;
  align-items: center;
  background-color: #fff;
  font-weight: 500;
  font-size: 13px;
}
.delete_icon {
  background: #ff0000 !important;
  color: #fff;
  height: 100%;
  padding: 1px 4px;
}
.delete_icon i {
  position: relative;
  top: -2px;
}

.select-slip {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.select-slip button:hover + small {
  display: block;
  opacity: 1;
  transition: cubic-bezier(0.19, 1, 0.22, 1) 1s;
}
.select-slip a:hover + small {
  display: block;
  opacity: 1;
  transition: cubic-bezier(0.19, 1, 0.22, 1) 1s;
}

.select-slip small {
  font-size: 8px;
  opacity: 0;
  color: #ba0000;
}

.one-update {
  /* background: #f7f7f7; */
  padding: 10px 20px;
}

/* .two-update {
    background: #fdf5f7;
}

.two-update .main-svg {
    background: #fdf5f700 !important;
} */

.three-update .js-plotly-plot {
  border-radius: 27px;
  overflow: hidden;
  /* background: #fff6fc; */
  margin: 1rem;
}

.three-update .main-svg {
  background-color: inherit !important;
}

.doc {
  position: absolute;
  width: 87px;
  cursor: pointer;
  opacity: 0;
}

#pills-document .second-text button {
  background: #8f0000;
  color: #fff;
  padding: 5px 14px;
  font-size: 12px;
  border: none;
  border-radius: 4px;
  box-shadow: 2px 2px 4px #c5c5c5;
}

#pills-document .second-text {
  justify-content: space-between;
  padding: 0px 10px;
}

#pills-document .third-text {
  margin-top: 1rem;
}

.form-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #ffff;
  padding: 10px;
  justify-content: center;
  gap: 11px;
  border-radius: 6px;
  /* box-shadow: 2px 2px 4px dimgrey; */
  height: 273px;
  width: 376px;
}
.form_box_d .form-body {
  height: 100% !important;
}
.form_box_d .form-select {
  border: 1px solid #d3d3d3;
  border-radius: 4px;
  font-size: 13px;
  width: 254px;
  padding: 6px;
  outline: none;
}

.form-inp-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 8px;
}

.inp1 {
  display: flex;
  flex-direction: column;
}

.inp1 input {
  border: 1px solid #d3d3d3;
  border-radius: 4px;
  font-size: 13px;
  width: 254px;
  padding: 6px;
  outline: none;
}

.inp1 label {
  font-size: 15px;
  padding-bottom: 2px;
}

.form-body h4 {
  font-size: 24px;
  margin-bottom: 0;
}

.inp-btn button {
  background: linear-gradient(40deg, #8f0000, #000000);
  border: none;
  color: #fff;
  padding: 5px 27px;
  border-radius: 5px;
  font-size: 14px;
  box-shadow: 2px 2px 4px #c5c5c5;
}

.form-body-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

.one-update input {
  border: 1px solid black;
  border-radius: 5px;
  padding: 5px;
  outline: none;
  font-size: 14px;
  width: 194px;
}

table.dataTable > thead > tr > th,
table.dataTable > thead > tr > td {
  padding: 17px !important;
}

table.dataTable th.dt-type-numeric,
table.dataTable th.dt-type-date,
table.dataTable td.dt-type-numeric,
table.dataTable td.dt-type-date {
  text-align: center !important;
}
#Employee2 {
  width: 100% !important;
}
#Employee3 {
  width: 100% !important;
}
#Employee4 {
  width: 100% !important;
}

.upload-btn {
  display: flex;
  gap: 29px;
}

/* company css */ /* company css */ /* company css */ /* company css */ /* company css */ /* company css */
/* company css */ /* company css */ /* company css */ /* company css */ /* company css */ /* company css */

.company .first-text button {
  background: #8f0000;
  color: #fff;
  padding: 7px 16px;
  font-size: 13px;
  border: none;
  box-shadow: 2px 2px 4px gray;
  border-radius: 5px;
}

/* .first-text button:hover {
    background: #e82323;
    transform: scale(1.1);
} */

.company-modal .modal-dialog {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.company-modal .modal-body {
  display: flex;
  align-items: center;
  justify-content: center;
}

.form-item {
  position: relative;
  /* margin-bottom: 15px */
}
.form-item input {
  display: block;
  width: 285px;
  height: 35px;
  background: #fff;
  border: solid 1px #8f0000;
  transition: all 0.3s ease;
  padding: 0 15px;
  outline: none;
  border-radius: 4px;
  font-size: 14px;
}
.form-item label {
  position: absolute;
  cursor: text;
  z-index: 2;
  top: 8px;
  left: 10px;
  font-size: 12px;
  background: #fff;
  color: #999;
  transition: all 0.3s ease;
  border-radius: 10px;
  padding: 0px 9px;
}
.form-item input:focus + label,
.form-item input:valid + label {
  font-size: 11px;
  top: -5px;
}
.form-item input:focus + label {
  color: rgb(0, 0, 0);
}
.company .task {
  border: none;
  padding: 2px 8px;
  outline: none;
}
table.dataTable {
  width: 100% !important;
}
.page-show-green button {
  background: green;
}
.page-show-green .page-td {
  background: green;
}
.page-show-orange button {
  background: orange;
}
.page-show-orange .page-td {
  background: orange;
}
.page-td {
  background-color: transparent !important;
}
#Employee5 select {
  font-size: 12px;
  border: 1px solid #d0d0d0;
  padding: 4px 9px;
  border-radius: 4px;
}
.data-text {
  width: 180px;
  text-align: start;
}
.detail-text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  white-space: nowrap;
}
#Employee7 select {
  font-size: 12px;
  border: 1px solid #d0d0d0;
  padding: 4px 9px;
  border-radius: 4px;
}

.imgupload_div .modal-content {
  background: #fff !important;
  width: 420px;
  display: unset !important;
  padding: 10px;
}
.imgupload_div .modal-content .modal-body {
  padding: unset !important;
  height: 300px;
  width: 400px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.imgupload_div .modal-content .modal-body img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
}
.imgupload_div .modal-dialog {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.res-btn1 {
  background: #fff;
  border: none;
  padding: 4px 13px;
  border-radius: 5px;
  color: #4d0000;
  font-size: 13px;
  font-weight: 500;
}
.first-text button {
  background-color: #9c1010;
  color: #fff;
  border-radius: 4px;
  border: none;
  padding: 6px 14px;
  box-shadow: 2px 2px 3px #29292969;
  font-size: 12px;
}
/* company css */ /* company css */ /* company css */ /* company css */ /* company css */ /* company css */
/* company css */ /* company css */ /* company css */ /* company css */ /* company css */ /* company css */

.contact h2 {
  font-size: 21px;
}
.detail1 p {
  font-size: 14px;
  font-weight: 600;
}
.plan-pack {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}
.detail1 div {
  width: 100%;
  text-align: center;
}
.plan1 {
  background: linear-gradient(75deg, #8f0000, #000000);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10px;
  border-radius: 10px;
  gap: 14px;
  box-shadow: 2px 2px 4px #7e7e7e;
  height: 214px;
  width: 284px;
}
.plan1 span {
  display: flex;
  align-items: center;
  gap: 79px;
  width: 100%;
  justify-content: space-between;
}
.plan1 span p {
  font-size: 15px;
}
.plan1 button {
  background: #e43a3a;
  border: none;
  color: #fff;
  box-shadow: 1px 1px 4px #000000ba;
  border-radius: 4px;
  padding: 4px 18px;
  font-size: 14px;
}
.plan1 h2 {
  font-size: 22px;
}
.Add-plan {
  background: linear-gradient(75deg, #8f0000, #000000) !important;
  color: #fff;
  border-radius: 11px !important;
}
.create-bar {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
}
.bar-inp1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0px 30px;
}
.bar-inp1 input {
  border: 1px solid #ff5b5b;
  border-radius: 4px;
  outline: none;
  padding: 2px 8px;
}

.text #home-txt .AddCompany001 {
  position: fixed;
  z-index: 999;
}

.modal-dialog {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Add-plan .modal-body {
  height: 245px;
  display: flex;
}
.Add-plan button {
  margin-top: 11px;
  color: #c53131;
  background-color: #fff;
  border-radius: 4px;
  border: none;
  padding: 4px 18px;
  box-shadow: 2px 2px 3px #323232;
}
#pills-report h4 {
  font-size: 1.3rem;
}

.drop2change {
  display: flex;
  border: none;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  width: 92%;
  margin: auto;
}
.drop2change span input {
  background: #feaeae79;
  border: 1px solid #feaeae;
  color: #c20303;
  font-size: 16px;
  padding: 4px;
}
.drop2change span .inputwidth {
  width: 300px;
}
.drop2change span {
  display: flex !important;
  flex-direction: row;
  height: auto;
  border: none;
  width: auto;
  align-items: center;
  padding-left: 5px;
}

.project-txt .edit {
  display: none !important;
  background: #fff;
  color: black;
  border: 1px solid #00000045;
  border-radius: 2px;
}
.delete {
  background: #ce1212;
  color: #fff;
  border: none;
  border-radius: 2px;
}
.drop-head {
  padding: 7px;
}
.head-view i {
  color: #fff;
}
a {
  text-decoration: none !important;
}
.message-wrap .fifth-text {
  display: flex;
  margin-top: 0px;
}
.message-wrap .fifth-text a {
  background: #b51c1c;
}
.tab-hr-wrap a {
  color: #fff;
}
.tab-hr-wrap a:hover {
  color: #fff;
}

.profile-wrap .hr-profile {
  display: block;
  padding: 0px;
}

.Addcomapny-wrap .company-detail {
  display: flex;
}

/* .Addcomapny-wrap .AllIncoming1{
    display: none;
} */
.head-profile-wrap {
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 19px;
}
.head-profile-wrap a {
  position: absolute;
  left: 35px;
}
.head-profile-wrap a i {
  color: black;
}
.head-profile-wrap h2 {
  margin-bottom: 0;
  font-weight: 700;
  font-size: 30px;
}
.Profile-company .profile {
  display: flex !important;
}
.rate-div {
  display: flex;
  gap: 30px;
}
.rate-div span {
  display: flex;
  gap: 8px;
    align-items: center;
}
.button-sent select {
  padding: 4px;
  font-size: 12px;
}

.rate-div-star p:nth-child(1) {
  color: #ffa41c;
}

.AllIncoming1 .back_from_IncomimgPlan {
  width: 100%;
}

.back_from_IncomimgPlan i {
  font-size: 20px;
}

.createcompany .wrap-create-plan {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.blog_txt {
  width: 80%;
}

/* -----------------
DK NEW CSS CHANGES
 STC UPDATE
 -------------- */

.wrap_super_admin,
.wrap_hr_admin,
.wrap_admin {
  display: inline-flex;
  /* align-items: center; */
  justify-content: center;
  width: 100%;
}

.tab-papa {
  width: 16%;
  background: #e2e2e2;
  transition: cubic-bezier(0.19, 1, 0.22, 1) 1s;
  position: relative;
  left: 0;
  padding-top: 58px;
}
#tabs {
  display: flex;
  flex-direction: column;
  background: #e2e2e2;
  height: 100vh;
  transition: cubic-bezier(0.19, 1, 0.22, 1) 1s;
  width: 16%;
  position: fixed;
}

.contact::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.9);
  border-radius: 10px;
  background-color: #cccccc;
}

.contact::-webkit-scrollbar {
  width: 12px;
  background-color: #f5f5f5;
}

.contact::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #d62929;
  background-image: -webkit-linear-gradient(
    90deg,
    transparent,
    rgba(0, 0, 0, 0.4) 50%,
    transparent,
    transparent
  );
}
#contaniner::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.9);
  border-radius: 10px;
  background-color: #cccccc;
}

#contaniner::-webkit-scrollbar {
  width: 12px;
  background-color: #f5f5f5;
}

#contaniner::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #d62929;
  background-image: -webkit-linear-gradient(
    90deg,
    transparent,
    rgba(0, 0, 0, 0.4) 50%,
    transparent,
    transparent
  );
}

#contaniner {
  width: 84%;
  /* overflow-y: scroll; */
}
/* #contaniner::-webkit-scrollbar{
    display: none;
} */
.sdbtn {
  border: 0;
  background-color: #8f0000;
  color: #fff;
}
.Txt1 i {
  height: 25px;
  padding-right: 7px;
  position: relative;
  top: -1px;
}
.emp-data {
  width: 100%;
}
.emp-list {
  width: 100%;
}
.users-head {
  display: flex;
  align-items: center;
}
.home-txt .first-text {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.update_td button {
  height: 28px;
  background: #6f42c1 !important;
  border: none;
  padding: 2px 6px;
}
.update_td i {
  font-size: 19px;
  height: 29px;
  position: relative;
  top: -3px;
  color: #fff;
}
.page-td button {
  padding: 0px;
  gap: 7px;
  padding-right: 7px;
  height: 22px;
  background: #fff;
}
.page-td .icons {
  border-radius: 3px;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 1px 7px;
}
.taskbtn {
  display: flex;
  gap: 5px;
}
.tasksandbtn {
  all: unset;
  width: 50px;
  padding: 0px;
  height: 30px !important;
}
.icons_green .icons {
  color: #fff;
  background: green;
  padding-bottom: 5px;
}
.icons_red .icons {
  color: #fff;
  background: red;
  padding-bottom: 5px;
}
.icons_green {
  border: 1px solid green !important;
  color: green !important;
}
.icons_red {
  border: 1px solid red !important;
  color: red !important;
}
.paging_full_numbers .current {
  background: transparent !important;
  border: 1px solid #3f3f3f !important;
  border-radius: 8px !important;
  padding: 4px 12px !important;
}
.company .first-text button svg {
  width: 19px;
  height: 14px;
  position: relative;
  top: -1px;
}
.header_notification {
  display: flex;
  justify-content: center;
  width: 100%;
  align-items: center;
  padding: 20px 0px;
}
.header_notification2 {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  padding: 20px 0px;
}
.head_icon {
  position: absolute;
  left: 250px;
  text-decoration: none;
  background: #8f0000 !important;
  color: #fff;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: unset;
  justify-content: center;
  border-radius: 50%;
}
.head_icon:hover {
  color: #fff;
}
.head_icon i {
  position: relative;
  top: 1px;
}
.third-text .dt-end input {
  margin-left: 10px;
  border: 1px solid #3f3f3f !important;
  border-radius: 8px !important;
  outline: none;
}
.third-text .dt-start select {
  padding: 5px 0 !important;
  width: 40px;
  height: 32px;
  margin-right: 10px;
  border: 1px solid #3f3f3f !important;
  border-radius: 8px !important;
}
.code-txt .page-td button {
  background-color: #8f0000;
  color: #fff;
  padding: 5px 10px;
}
.select_item {
  border: 1px solid #8f0000;
  outline: none;
  font-size: 12px;
  font-weight: 600;
  padding: 3px;
}
table.dataTable > tbody > tr > td {
  font-size: 12px;
  font-weight: 600;
}
.message_user_img img {
  width: 100%;
  height: 100%;
}
.message_user_img {
  width: 40px;
  border-radius: 50%;
  overflow: hidden;
}
.message_user_box {
  display: flex;
  align-items: center;
  gap: 11px;
}
.message_user_text h5 {
  margin-bottom: 0;
}
.message_section {
  display: flex;
  margin: 10px;
  height: 78vh;
  border-radius: 5px;
  overflow: hidden;
}
.message_user_text small {
  font-size: 9px;
  font-weight: 300;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 153px;
}
.message_user_text h5 {
  font-size: 11px;
}
.message_left_section {
  background: #5c0f0f;
  color: #fff;
  display: flex;
  flex-direction: column;
  /* align-items: center; */
  /* justify-content: center; */
  padding: 15px;
}
.message_left_section h3 {
  font-size: 18px;
  text-align: center;
  padding-bottom: 10px;
}
.message_wrap_box {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.message_user_time small {
  font-size: 10px;
  font-weight: 300;
}
.message_user_text {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.message_right_section {
  background: #f5f5f5;
  width: 73%;
  padding: 14px;
  padding-top: 0;
}

.message_right_msg1 {
  display: flex;
  align-items: start;
  gap: 12px;
}
.message_right_msg_img {
  width: 47px;
  border-radius: 50%;
  overflow: hidden;
}
.message_right_msg_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.message_text_data {
  /* box-shadow: 0px 5px 30px 0px #5C0F0F59; */
  box-shadow: 0px 2px 7px -2px #5c0f0f59;
  padding: 10px;
  width: 310px;
  border-radius: 10px;
  border: 1px solid #d5d5d5;
}
.message_text_data p {
  font-size: 12px;
  font-weight: 600;
}
.message_right_top_section {
  display: flex;
  flex-direction: column;
  gap: 13px;
  height: 90%;
  overflow-y: scroll;
  padding: 10px 0px;
  padding-right: 15px;
}
.user .message_text_data {
  background-color: #8f0000;
  color: #ffff;
}
.mesage_notification {
  width: 100%;
}
.admin {
  justify-content: end;
  flex-direction: row-reverse;
}
.message_right_bottom_section > div {
  /* background: linear-gradient(40deg, #8F0000, #000000); */
  border-radius: 5px;
}
.message_right_bottom_section > div button {
  all: unset;
  color: #fff;
  padding: 7px 22px;
  border-radius: 14px;
}
.message_right_bottom_section > div input {
  all: unset;
  padding: 9px 12px;
  color: #fff;
  width: 530px;
  font-size: 13px;
}
.chatdatetime {
  font-size: 10px;
  text-align: end;
}

.message_right_bottom_section > div input::placeholder {
  color: #fff;
}
.message_right_bottom_section > div {
  background: linear-gradient(40deg, #8f0000, #000000);
}
.message_right_bottom_section {
  display: flex;
  /* align-items: center;
  justify-content: space-evenly;
  padding: 10px; */
  padding-top: 16px;
  gap: 10px;
  border-top: 1px solid #dedede;
}
.message_wrap_box {
  overflow-y: scroll;
}
.message_wrap_box::-webkit-scrollbar {
  display: none;
}
.message_right_top_section::-webkit-scrollbar-track {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #f5f5f5;
}

.message_right_top_section::-webkit-scrollbar {
  width: 10px;
  background-color: #f5f5f5;
}

.message_right_top_section::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: black;

  background-image: -webkit-gradient(
    linear,
    0 0,
    0 100%,
    color-stop(0.5, transparent),
    to(transparent),
    color-stop(0.5, transparent),
    to(transparent)
  );
}
.msg_wrap {
  padding-bottom: 4px;
}
.alert-type select {
  width: 100%;
  outline: none;
  border: 1px solid #bababa;
  padding: 10px 10px;
  border-radius: 4px;
  margin: 10px 0px;
  font-size: 13px;
}
.doc_wrap .second-text button {
  color: #fff;
  background: #8f0000;
  border: none;
  outline: none;
  box-shadow: unset;
}
.select-slip button {
  all: unset;
  border: 2px solid #8f0000;
  padding: 2px 4px;
  background-color: #fff;
  border-radius: 5px;
}
.select-slip a {
  all: unset;
  border: 2px solid #8f0000;
  padding: 2px 4px;
  background-color: #fff;
  border-radius: 5px;
  color: #000 !important;
  cursor: pointer;
}
.td_wrapper {
  display: flex;
  align-items: center;
  gap: 18px;
}
.td_wrapper .doc_btn {
  all: unset;
  border: 2px solid #8f0000;
  padding: 2px 4px;
  background-color: #fff;
  border-radius: 5px;
  white-space: nowrap;
}
.td_wrapper select {
  border: 2px solid #8f0000;
  padding: 2px 0px;
  background-color: #fff;
  border-radius: 5px;
  width: 119px;
}
.doc_wrap .second-text {
  justify-content: unset;
}

.page_header_btns {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
  width: 84%;
  gap: 10px;
  top: 10px;
  left: 17px;
}

.page_header_btns .page-td_btns button {
  border: none;
  outline: none;
  background-color: #e00404;
  color: #fff;
  padding: 4px 10px;
  font-size: 12px;
  border-radius: 5px;
}
.page_header_btns .page-td_btns button i {
  padding-right: 5px;
  font-size: 10px;
  position: relative;
  top: -1px;
}
.header_notification_edit {
  width: 100%;
  padding-left: 60px;
}
.header_notification_edit2 {
  width: 100%;
  padding-left: 10px;
}
.plans_incoming {
  border: 1px solid #8f0000;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 16px;
  gap: 33px;
  border-radius: 10px;
}
.plans_incoming img {
  width: 200px;
  height: 200px;
}
.Txt1 i {
  position: relative;
  top: -1px;
  padding-right: 6px;
}
.Txt1 img {
  position: relative;
  top: -1px;
  padding-right: 6px;
}
.CreatCbutton {
  display: flex;
  flex-direction: column-reverse;
  gap: 10px;
  border: 1px solid #8f0000;
  padding: 10px;
  align-items: center;
  width: 245px;
  border-radius: 7px;
}

.CreatCbutton img {
  width: 87px;
}
.drop1 input {
  width: 300px;
  padding: 4px 13px;
  border: 1px solid #f80000;
  border-radius: 3px;
  font-size: 14px;
  outline: none;
}
.AllIncoming1 h3 {
  font-size: 25px;
  font-weight: 600;
  margin: 0;
}
.AllIncoming1 h3 i {
  font-size: 24px;
  position: relative;
  top: -5px;
}
.table > :not(:last-child) > :last-child > * {
  text-align: center;
}
.update_complain .dt-container {
  width: 90% !important;
}
.profile_header_company {
  background: linear-gradient(88.51deg, #b41111 0%, #400606 100%);
  width: 100%;
  padding: 21px;
  height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 19px;
}
.profile_text_company {
  color: #ffff;
  display: flex;
}
.profile_text_company h4 {
  font-size: 18px;
  font-weight: 400;
  margin: 0;
  padding-right: 10px;
}
.profile_header_company_img {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #fff;
  overflow: hidden;
}
.profile_header_company_img img {
  width: 100%;
  height: 100%;
}

.profile-detail .detail-box {
  justify-content: space-around;
}
.profile-detail .detail1 {
  width: 37%;
  align-items: unset;
  flex-direction: column;
}
.profile-detail .detail1 input {
  width: 100%;
}
.btns {
  display: flex;
  align-items: center;
  margin: auto;
  border: none;
  width: 100px;
  border-radius: 5px;
  justify-content: center;
  padding: 5px;
  font-size: 17px;
  gap: 9px;
  color: #fff !important;
  box-shadow: 2px 2px 5px #262626;
  background: linear-gradient(40deg, #8f0000, #000000);
  box-shadow: 1px 2px 6px #999999;
}
.update_complain .page-show {
  justify-content: space-between;
}
.admin_profile .profile_text_company {
  flex-direction: column;
}
.txt_admin {
  display: flex;
}
.admin_profile .detail1 input {
  width: 339px;
}
.admin_profile .detail1 {
  flex-direction: column;
  justify-content: unset;
  align-items: unset;
}
.admin_profile .detail-box {
  justify-content: space-around;
}
.admin_profile .detail1 {
  width: 35%;
}
.first-text .bi-arrow-bar-up {
  position: relative;
  top: -2px;
}
.admin_w .first-text {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.wrap_txt {
  display: flex;
  justify-content: end;
}
.ticket .page-show button {
  background-color: #8f0000;
  color: #fff;
  padding: 5px 10px;
}
.btn_del button {
  height: 28px;
  width: 72px;
}
.card_wrap .card-body {
  padding-bottom: 7px;
  display: flex;
  align-items: center;
}
.card_wrap {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
  justify-content: start;
  padding-left: 20px;
}
.card_wrap .card {
  width: 16rem;
  height: 197px;
}
.card_wrap .card img {
  height: 130px;
  object-fit: cover;
}
.history_head h3 {
  font-weight: 600;
  font-size: 25px;
  padding: 10px 0px;
}

.crete_plan_wrap .modal-content {
  color: #fff !important;
  background: linear-gradient(40deg, #8f0000, #000000);
}

.crete_plan_wrap .plan_header h2 {
  font-size: 28px;
  text-align: center;
}

.crete_plan_wrap .plan_body_input {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

.crete_plan_wrap .plan_inp1 {
  width: 95%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.crete_plan_wrap .plan_inp1 h3 {
  font-size: 16px;
  font-weight: 300;
  margin: 0;
}

.crete_plan_wrap form {
  width: 100%;
}
.crete_plan_wrap .plan_inp1 input {
  /* width: 100%; */
  border-radius: 4px;
  border: none;
  background: #ded9d9;
  outline: none;
  padding: 1px 3px;
}
.plan_btn button {
  font-weight: 500;
  color: #a60808;
  border-color: #ee6565;
  border-radius: 4px;
  padding: 3px 22px;
}
.select2-selection--multiple {
  width: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: unset;
}
.select2-container--default {
  width: auto !important;
}

.survey_modal_data {
  display: flex;
  flex-direction: column;
  width: 75%;
  gap: 10px;
  padding: 10px 16px;
  border: 1px solid #9c1010;
  border-radius: 6px;
}

.survey_modal_data_item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.survey .modal-content {
  background-color: #fff !important;
  width: 373px;
}
.survey .modal-body {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.data_item_box {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.data_item {
  display: flex;
  gap: 10px;
}
.data_item_box1 {
  background: #1d6000;
}
.data_item_box i {
  position: relative;
  top: -4px;
}
.data_item_box2 {
  background: #ff0000;
}
.survey_modal_data2 .bi-star-fill {
  color: #ffd900;
}
.survey_modal_data2 span i:nth-child(5) {
  color: #929292;
}
.survey_modal_inp {
  padding-bottom: 12px;
  width: 74%;
}
.survey_modal_data p {
  font-size: 16px;
}
.survey_modal_header h3 {
  font-size: 23px;
}
.survey_modal_inp input {
  width: 100%;
  border: 1px solid #9c1010;
  padding: 5px 12px;
  font-size: 14px;
  outline: none;
  border-radius: 4px;
}
.modal_button button {
  font-size: 15px;
  margin-top: 11px;
}
.survey_modal_inp input::placeholder {
  color: black;
}
.left_login_section {
  height: 86vh;
}
.left_login_section img {
  height: 100%;
  margin-left: 5px;
}
#AssPlanDisBlk {
  width: 100%;
}
.right_login_section span {
  color: #d11313;
}
.right_login_section form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: center;
}
.input_form_sec input {
  all: unset;
  padding: 7px 10px;
  background: #e2e2e2;
  width: 373px;
  border-radius: 4px;
}
.right_login_section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 50%;
  gap: 20px;
  position: relative;
  top: 30px;
}
.input_form_btn {
  padding-top: 60px;
}
.right_login_header h2 {
  font-weight: 700;
  font-size: 41px;
  margin-bottom: 0;
}
.right_login_header {
  width: 67%;
}
.right_login_header b {
  font-weight: 500;
  font-size: 15px;
}
.DocusPrint {
  width: 100%;
  height: auto;
  border: 1px solid green;
  padding: 10px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.DocusContainer {
  width: fit-content;
  height: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid green;
  color: #fff;
}
.viewDocuts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.docusNameCss {
  padding: 2px 10px;
  background-color: green;
}
.btnicon {
  width: 30px;
  display: flex;
  justify-content: center;
  height: 100%;
  color: #8f0000;
}
.btnicon i {
  color: #8f0000;
}
.DocusContainer a {
  color: #fff;
}
.docusNameCss:hover {
  cursor: pointer;
  color: #fff !important;
}
/* -----------------
DK NEW CSS CHANGES
 STC UPDATE
 -------------- */