@charset "UTF-8";
@import "../../../assets/css/pms_profiler/color.css";
body {
  font-family: "Lato-regular";
  padding-bottom: 0;
  background: var(--dark-900);
}

/* placeholder */
/* fonts */
@font-face {
  font-family: "Opensans-regular";
  src: url("../../fonts/OpenSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Opensans-semibold";
  src: url("../../fonts/OPENSANS-SEMIBOLD.TTF") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato-black";
  src: url("../../fonts/font-lato/Lato-Black.woff2") format("woff2"),
    url("../../fonts/font-lato/Lato-Black.woff") format("woff"),
    url("../../fonts/font-lato/Lato-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato-bold";
  src: url("../../fonts/font-lato/Lato-Bold.woff2") format("woff2"),
    url("../../fonts/font-lato/Lato-Bold.woff") format("woff"),
    url("../../fonts/font-lato/Lato-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lato-semibold";
  src: url("../../fonts/font-lato/Lato-Semibold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato-light";
  src: url("../../fonts/font-lato/Lato-Light.woff2") format("woff2"),
    url("../../fonts/font-lato/Lato-Light.woff") format("woff"),
    url("../../fonts/font-lato/Lato-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../../fonts/font-lato/Lato-Hairline.woff2") format("woff2"),
    url("../../fonts/font-lato/Lato-Hairline.woff") format("woff"),
    url("../../fonts/font-lato/Lato-Hairline.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato-regular";
  src: url("../../fonts/font-lato/Lato-Regular.woff2") format("woff2"),
    url("../../fonts/font-lato/Lato-Regular.woff") format("woff"),
    url("../../fonts/font-lato/Lato-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lato-medium";
  src: url("../../fonts/font-lato/Lato-Medium.woff2") format("woff2"),
    url("../../fonts/font-lato/Lato-Medium.woff") format("woff"),
    url("../../fonts/font-lato/Lato-Medium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lato-BoldItalic";
  src:url("../../fonts/font-lato/Lato-BoldItalic.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

.fa-trash:before {
  /* color: var(--primary-200); */
}
label {
  font-weight: normal;
}

/* header */


.rc-main-header .main-header > .container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
}

@media screen and (max-width: 1366px) {
  .toast {
    width: 32%; /* position: static; */
  }
}

@media (max-width: 991px) {


  .header-with-right-nav .navbar-brand > img {
    width: 90%;
  }
  .two-col-tabs {
    flex-wrap: wrap;
  }
}

@media (max-width: 767px) {
  /* header */
  .dashboard .header-with-right-nav .main-header > .container {
    padding-left: 50px;
  }

  .header-with-right-nav .main-header {
    padding: 14px 0 70px 0;
  }

  .dashboard .header-with-right-nav .main-header {
    padding: 14px 0;
  }

  .rc-main-header .main-header .navbar-header {
    width: 60%;
    height: auto;
    margin: 0;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }


  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form {
    padding: 0 15px 10px 15px;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form
    .form-group-seachbox {
    margin: 0;
  } 

}



@media (max-width: 359px) {
  
}

/* navigation right side nav design end */
/* header end */
/* komal- new header design 07-09-2023*/
.hero-banner {
  width: 100%;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
}


@media screen and (max-width: 578px) {
  .hero-banner__content {
    right: 1rem;
  }
}

@media screen and (max-width: 578px) {
 
}



@media screen and (max-width: 578px) {
  .hero-banner__content {
    right: 1rem;
  }
}


.sidebar-wrapper .dropdown-toggle::after{
  display: none;
}
.sidebar-wrapper .dropdown-menu > li{
  font-size: 14px;
}

body {
/*  font-family: "Lato";*/
  padding-bottom: 0;
  /* overflow-y: hidden; */
}

@media (max-width: 991px) {
  body {
    overflow-y: auto;
  }
}
.hidden,.hide{
  display: none;
}

/*Scrollbar Css Start Point*/
* {
  scrollbar-width: thin;
  scrollbar-color: #1b4a98 #ccc;
}

/* Works on Chrome, Edge, and Safari */
input,select{
  outline:0;
}

*::-webkit-scrollbar-track {
  background: #ccc;
  -webkit-border-radius: 20px;
  border-radius: 20px;
}

*::-webkit-scrollbar-thumb {
  background-color: var(--primary-200);
  -webkit-border-radius: 20px;
  border-radius: 20px;
  border: 3px solid #707070cc;
}

/*Scrollbar Css End Point*/
.cjsndcndsl {
  font-size: 200px;
}

.mrt-2 {
  margin-top: 2rem;
}

.mrb-8 {
  margin-bottom: 8px;
}

.rc--topsection {
  color: var(--white);
  font-size: 18px;
  font-weight: normal;
  line-height: 1.83;
  letter-spacing: 0.04px;
  text-align: center;
  padding: 6px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background-color: #08579d;
}

 
.rc-banner {
  background-image: url(../../img/landing-pg-banner.png);
  background-repeat: no-repeat;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
  position: relative;
  height: 200px;
}

 
.rc-banner__innercontent {
  position: absolute;
  right: 28px;
  bottom: 28px;
  display: flex;
  flex-direction: column;
}

.rc-banner__quote {
  color: var(--white);
  font-size: 24px;
  font-family: "Lato-semibold";
  line-height: 30px;
  margin: 0;
}

.rc-banner__quote-name {
  color: var(--white);
  font-size: 22px;
  font-family: "Lato-bold";
  line-height: 30px;
  letter-spacing: 0.48px;
  margin: 0;
}

.rc-dashboard-container {
  margin-left: 140px;
  margin-right: auto;
  width: 88%;
}

@media (max-width: 1199px) {
  .rc-dashboard-container {
    margin-left: 120px;
  }
}

@media (max-width: 991px) {
  .rc-dashboard-container {
    margin-left: 95px !important;
    margin-right: 25px !important;
  }
}

@media (max-width: 767px) {
  .rc-dashboard-container {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

.rc--blcks__title {
  color: #2e384d;
  font-weight: 600;
  margin: 0 0 20px 0;
}


 
.rc_roleallocator img,
.rc_roleacceptor img,
.rc_iobmicrosite img,
.rc_uploadexcel img,
rc_user-master img,
.rc_assignmentdetails img,
.rc_trainings img,
.rc_role_clarity_exceptions img {
  float: right;
}

.rc_roleacceptor {
/* padding: 25px 15px; */
  padding: 15px;
  -webkit-border-radius: 14px !important;
  border-radius: 14px !important;
  -webkit-box-shadow: 0 0 6px 0 rgba(213, 224, 254, 0.48);
  box-shadow: 0 0 6px 0 rgba(213, 224, 254, 0.48);
  background-color: #8ba7f0;
  color: var(--white);
}



/**Dashboard View css end point**/
/*comment box css start point*/
.tri {
  position: relative;
  /* border: 1px dashed #987B02; */
  padding: 8px 15px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  border: 0 none;
  background: #f2f2f2;
  /* z-index: 1; */
  /* width: 100%; */
}

p.date.comment-heading {
  margin-right: 0;
  color: var(--dark-100);
  font-size: 14px;
  text-align: right;
}

.tri_recd {
  position: relative;
  border: 1px solid #f2f2f2;
  padding: 8px 15px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: #f2f2f2;
}

.comment_holder_repo p {
  font-size: 16px;
  /*font-weight: 600;*/
  line-height: 1.21;
  color: var(--dark-100);
}

.comment_holder_repo .comment-heading {
  color: #ad690b;
  font-size: 16px;
  font-weight: 600;
}


.right-sidebar__menus img {
  margin-right: 1rem;
}





/*My Role Css End Point*/
.modal--comment {
  padding-left: 2rem;
  padding-top: 1rem;
  padding-right: 2rem;
}

.txtarea--comment {
  width: 100%;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background-color: #f4f6fc;
  border: 0;
  padding: 10px;
  margin-top: 0.5rem;
  font-family: "Lato-regular";
}

.comment--radio {
  font-weight: normal;
  color: #2e384d;
}

.initials--login {
  color: var(--white);
  padding-left: 1rem;
}

/* modal popup css */
.ml-auto {
  display: block;
  margin-left: auto;
}

.ml-0 {
  margin-left: 0 !important;
}

.mrt-5 {
  margin-top: 25px;
}

.rc_wrapper {
  background: var(--white);
  -webkit-border-radius: 10px;
  border-radius: 10px;
  border: 1px solid var(--white);
  margin: 20px;
  margin-top: 20px;
  height: auto;
  width: 91%;
  padding: 30px;
  margin-left: 65px;
}

.rc_header {
  color: var(--dark-100);
  background-color: transparent;
  border-top: 1px solid black;
  border-collapse: separate;
  border-spacing: 0px 10px;
  text-align: center;
}

.rc-details {
  border-bottom: 1px solid #cdcdcd5c;
  text-align: center;
}

.kra_add_btn {
  margin-right: 40%;
}



.dropdown {
  position: relative;
  display: inline-block;
  width: 100% !important;
}

.dropdown:hover {
  background-color: var(--primary-200);
}

.show {
  display: block;
}

/* dashboard */
.myrole.myrole-dashboard {
  margin-top: 24px;
}

.myrole-dashboard .rc--blocks__myrole {
  width: 28%;
  margin-bottom: 0;
}

.myrole-dashboard .myrole_rightblock {

  height: calc(100vh - 363px);
  overflow-y: auto;
  gap: 15px;
  padding: 5px;
}

.myrole_block {
  list-style: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  align-content: flex-start;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
}

.myrole_block li {
  background-color: var(--white);
  border: 0.5px solid #70707040;
  position: relative;
  box-shadow: 0 0 9px 1px rgba(0, 0, 0, 0.11);
  width: 200px;
  max-width: 315px;
  height: 200px;
  border-radius: 14px !important;
  padding: 15px;
}
.myrole_block li h4 {
  color: #eb7979;
  text-align: center;
  font-size: 21px;
  font-family: "Lato-regular";
  /* font-weight: 600; */
  min-height: 70px;
}
.myrole_block li::before {
  content: "";
  position: absolute;
  background-color: #eb7979;
  border-radius: 0px 0px 10px 10px;
  height: 10px;
  width: 100%;
  bottom: 0;
  left: 0;
}

.myrole_block li:nth-child(n + 4) {
  margin-top: 0;
  background-color: var(--white);
}

/* end dashboard */
/* boostrap css */
.w-100 {
  width: 100% !important;
}

.m-0 {
  margin: 0 !important;
}

.p-0 .no-border {
  border: none !important;
}

.d-inline-block {
  display: inline-block;
}

.d-block {
  display: block;
}

.ml-auto {
  display: block;
  margin-left: auto;
}

.mrt-5 {
  margin-top: 25px;
}

.mrt-15 {
  margin-top: 15px !important;
}

.mrl-10 {
  margin-left: 10px;
}

@media (max-width: 767px) {
  .mrl-10 .mrbm-767-15 {
    margin-bottom: 15px;
  }
}

.mrt-8 {
  margin-top: 8px;
}

.block-items-right {
  text-align: right;
}

.word-wrap {
  word-break: break-word;
}

.pl-0 {
  padding-left: 0;
}

.pr-0 {
  padding-right: 0;
}

.lists-unstyled {
  list-style: none;
}

.lists-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.text-wrap {
  word-break: break-word;
}

.text-left {
  text-align: left !important;
}

.w-auto {
  width: auto;
}

/* boostrap css end */
/* global css */
.text-green {
  color: #119f5a !important;
}

.white-bg-radius {
  background-color: var(--white);
  -webkit-box-shadow: 0px 3px 16px var(--box-shadow-1);
  box-shadow: 0px 3px 16px var(--box-shadow-1);
}

/* .dropdown-style */
.dropdown-style-1 .btn-style-1 {
  width: 100%;
  color: #2e384d;
  font-family: "Lato-regular";
  font-size: 14px;
  padding: 12px;
  text-align: left;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border: solid 0px #b0bac9;
  background-color: #f4f6fc;
  position: relative;
}

.dropdown-style-1 .btn-style-1:after,
.dropdown-style-1 .btn-style-1:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
}

.dropdown-style-1 .btn-style-1:before {
  top: 50%;
  /* left: 237px; */
  content: "\f078";
  font-family: "FontAwesome";
  font-size: 13px;
  color: var(--dark-100);
  padding: 13px;
  display: block;
  margin: 0 auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

.dropdown-style-1 .btn-style-1:after {
  width: 45px;
  height: 42px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.dropdown-style-1 .btn-style-1:focus,
.dropdown-style-1 .btn-style-1:active:focus,
.dropdown-style-1 .btn-style-1.active:focus,
.dropdown-style-1 .btn-style-1.focus,
.dropdown-style-1 .btn-style-1:active.focus,
.dropdown-style-1 .btn-style-1.focus,
.dropdown-style-1 .btn-style-1:hover {
  outline: none;
  color: #2e384d;
  background-color: #f4f6fc;
}

.dropdown:hover,
.dropdown:focus {
  background-color: transparent;
}

.dropdown-with-search button {
  width: auto;
  padding: 8px 12px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  /* margin-left: auto; */
  display: block;
}

.dropdown-with-search-box {
  width: 100% !important;
}

.dropdown-with-search-box #search_list {
  width: 100%;
  font-size: 12px;
  padding: 10px 12px;
}

.dropdown-with-search-box a {
  padding: 3px 12px;
  color: #2e384d;
  background-color: #f4f6fc;
}

.dropdown-with-search-box a:hover,
.dropdown-with-search-box a:focus {
  color: var(--white);
  background-color: var(--primary-200);
}

@media (max-width: 575px) {
  .dropdown-style-1 .btn-style-1 {
    width: 100%;
  }

  .dropdown-style-1 .btn-style-1:before {
    right: 3%;
    -webkit-transform: translateY(-50%) translateX(-3%);
    -moz-transform: translateY(-50%) translateX(-3%);
    -ms-transform: translateY(-50%) translateX(-3%);
    -o-transform: translateY(-50%) translateX(-3%);
    transform: translateY(-50%) translateX(-3%);
  }
}

@media (max-width: 500px) {
  .dropdown-style-1 .btn-style-1:before {
    right: 0%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }
}
@media (max-width: 420px) {
  .myrole_block li {
    width: 45%;
    height: 150px;
  }
  .myrole_block li h4 {
    min-height: 45px;
  }
  .myrole_block {
    justify-content: center;
  }
}
@media (max-width: 359px) {
  .dropdown-style-1 .btn-style-1:before {
    right: 0%;
  }
  .myrole_block li {
    width: 50%;
  }
}

/* dropdown-style ends */
.ml-auto {
  display: block;
  margin-left: auto;
}

/* button */
.btn.back-btn{
  background: #fff;
  color: #000000;
  font-size: 12px;
  border-radius: 15px !important;
  padding: 3px 8px;
  box-shadow: 0px 3px 16px var(--box-shadow-1);
  margin-right: 10px;
  min-width: auto;
}
.back-btn img{
  width: 15px;
  margin-right: 5px;
}
.btn-primary-radius {
  font-family: "Lato-bold";
  color: #0c56bb;
  font-size: 13px;
  /* font-weight: 700; */
  line-height: 17px;
  padding: 9px 15px;
  border: solid 1px #0c56bb;
  background-color: transparent;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  text-decoration: none;
  min-width: auto;
  text-align: center;
  margin-right: 18px;
}

.btn-primary-radius:hover,
.btn-primary-radius:focus {
  color: var(--white);
  border-color: #0c56bb;
  background-color: #0c56bb;
  text-decoration: none;
}

.btn-primary,
.btn-secondary {
  font-family: "Lato-bold";
  font-size: 14px;
  line-height: 17px;
  /* font-weight: 700; */
  text-align: left;
  color: var(--white);
  padding: 8px 15px;
  cursor: pointer;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  text-align: center;
  min-width: auto;
  /* width: calc(60px + 15px); */
  width: auto;
  font-weight: 700;
  position: relative;
}

.btn-primary {
  border: 1px solid var(--primary-200);
  background-color: var(--primary-200);
}

.btn-primary:hover,
.btn-primary:focus {
  color: var(--primary-200);
  border-color: var(--primary-200);
  background-color: #fff !important;
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
  text-decoration: none;
}

.btn-primary[disabled],
.btn-secondary[disabled] {
  color: var(--primary-200);
  background-color: transparent;
  cursor: not-allowed;
}

.btn-primary[disabled]:hover,
.btn-primary[disabled]:focus {
  color: var(--primary-200);
  background-color: transparent;
}

@media screen and (max-width: 767px) {
  .btn-primary[disabled],
  .btn-secondary[disabled] {
    color: var(--white);
    background-color: gray;
    cursor: not-allowed;
    text-align: center;
    margin: 4px 0px;
  }

  .comment_name,
  .date {
    font-size: 14px;
  }
}

.btn-secondary {
  border: 1px solid var(--primary-200);
  background-color: var(--primary-200);
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
  color: var(--primary-200);
  border-color: var(--primary-200);
  background-color: var(--white);
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.05);
  text-decoration: none;
}

.btn-gray {
  color: var(--grey-200);
  padding: 9px 15px;
  background-color: transparent;
  border: 1px solid var(--grey-200);
  text-decoration: none;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  font-family: "Lato-bold";
  font-size: 14px;
  font-weight: 700;
  line-height: 17px;
  /* min-width: 115px; */
  min-width: 76px;
}

.btn-gray:hover,
.btn-gray:focus {
  color: #fff !important;
  border-color: #525252;
  background-color: #525252 !important;
  text-decoration: none;
}

.btn-secondary-radius {
  font-family: "Lato";
  color: var(--primary-200);
  font-size: 14px;
  padding: 6px 15px;
  border: solid 1px var(--primary-200);
  background-color: var(--white);
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  text-decoration: none;
  min-width: 115px;
}

.btn-secondary-radius:hover,
.btn-secondary-radius:focus {
  color: var(--white);
  background-color: var(--primary-200);
  text-decoration: none;
}

.btn-gray--md,
.btn-primary--md {
  padding: 6px 15px;
}

@media (max-width: 991px) {
  .btn-primary,
  .btn-secondary {
    font-size: 14px;
    line-height: 18px;
    /* padding: 8px 30px; */
  }

  .btn-primary-radius {
    font-size: 14px;
    /* padding: 8px 30px; */
  }
}

@media (max-width: 767px) {
  .btn-primary-radius {
    font-size: 14px;
    /* padding: 6px 20px; */
  }
}

/* button end */
/* form css */
.form-control {
  font-family: "Lato-regular";
  height: auto;
  color: #2e384d;
  font-size: 14px;
  padding: 4px 10px 4px 10px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border: solid 0.5px #b0bac9;
  background-color: rgba(244, 246, 252, 0.21);
}

.form-control:focus,
.form-control:hover {
  -webkit-box-shadow: none;
  box-shadow: none;
  border: solid 0.5px #b0bac9;
  background: transparent;
}

.form-control--text-area__title {
  font-family: "Lato-semibold";
  font-size: 16px;
  color: #2e384d;
  margin: 0 0 14.5px 0;
  line-height: 19px;
  padding-left: 12px;
}

.form-control--text-area {
  font-family: "Lato";
  font-size: 14px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: solid 0.5px rgba(27, 74, 152, 0.4);
  background-color: #f4f6fc;
  padding: 10px 14px;
}

.form-control--text-area:focus {
  outline: none;
}

.form-group-seachbox {
  position: relative;
}

.form-group-seachbox .form-control {
  color: #b0bac9;
  background-color: #f4f6fc;
  padding: 10px 10px 10px 39px;
}

.form-group-seachbox .form-control::-webkit-input-placeholder {
  font-family: "Lato";
  font-size: 14px;
  color: rgba(46, 56, 77, 0.44);
}

.form-group-seachbox .form-control::-moz-placeholder {
  font-family: "Lato";
  font-size: 14px;
  color: rgba(46, 56, 77, 0.44);
}

.form-group-seachbox .form-control:-ms-input-placeholder {
  font-family: "Lato";
  font-size: 14px;
  color: rgba(46, 56, 77, 0.44);
}

.form-group-seachbox .form-control::placeholder {
  font-family: "Lato";
  font-size: 14px;
  color: rgba(46, 56, 77, 0.44);
}

.form-group-seachbox:after {
  content: "\f002";
  position: absolute;
  top: 50%;
  left: 12px;
  font-family: "FontAwesome";
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  color: #b0bac9;
}

.form-control--date-picker {
  font-family: "Lato";
  font-size: 16px;
  font-weight: 600;
  line-height: 1.21;
  color: rgba(23, 23, 23, 0.6);
  width: 100%;
  padding: 12px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: solid 0 #b0bac9;
  background-color: rgba(239, 239, 239, 0.5);
}

.form-control--date-picker:focus {
  outline: none;
}

.form-control--select-style-1
  .select2-container--default
  .select2-selection--single {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: none !important;
  height: auto !important;
  padding: 0 !important;
}
.select2-results__option {
  font-size: 14px;
}
.select2-container .select2-dropdown .select2-results ul .select2-results__option--highlighted[aria-selected] {
  background-color: #deecff;
}

.form-control--select-style-1
  .select2-container--default
  .select2-selection--single[aria-expanded="true"]
  .select2-selection__arrow:after {
  -webkit-transform: translate(-50%, -50%) rotate(180deg);
  -moz-transform: translate(-50%, -50%) rotate(180deg);
  -ms-transform: translate(-50%, -50%) rotate(180deg);
  -o-transform: translate(-50%, -50%) rotate(180deg);
  transform: translate(-50%, -50%) rotate(180deg);
}

.form-control--select-style-1
  .select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  display: inline-block;
  width: -webkit-calc(100% - 45px);
  width: -moz-calc(100% - 45px);
  width: calc(100% - 45px);
  font-size: 14px;
  font-weight: 600;
  color: #ad690b;
  padding: 5.5px 12px;
  background-color: #f4f6fc;
  border: solid 0.5px #b0bac9;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  margin: 0 !important;
  line-height: 28px !important;
}

.form-control--select-style-1
  .select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  position: relative;
  top: 2px;
  right: -17px;
  width: 7px;
  height: 5px !important;
  padding: 0;
  background-color: var(--primary-200);
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.form-control--select-style-1
  .select2-container--default
  .select2-selection--single
  .select2-selection__arrow
  b {
  display: none;
}
.select2-container--default.select2-container--disabled .select2-selection--single {
  background-color: rgba(175, 176, 176, 0.3) !important;
}
.form-control--select-style-1
  .select2-container--default
  .select2-selection--single
  .select2-selection__arrow:after {
  content: "\e906";
  position: absolute;
  top: 50%;
  left: 50%;
  color: var(--white);
  font-family: "icomoon" !important;
  z-index: 1;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: rotate 0.5s ease;
  -o-transition: rotate 0.5s ease;
  -moz-transition: rotate 0.5s ease;
  transition: rotate 0.5s ease;
}

/* custom checkbox */
.custom-input {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
}

.custom-input__label {
  display: inline-block;
  font-family: "Lato";
  color: #2e384d;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.19;
  padding: 0 0 0 14px;
  margin: 0 !important;
}

.custom-input input[type="checkbox"],
.custom-input input[type="radio"] {
  position: absolute;
  width: 100%;
  opacity: 0;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1;
  cursor: pointer;
  margin: 0;
}

.custom-input .action {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  position: relative;
  max-width: 18px;
  max-height: 18px;
  width: 18px;
  height: 18px;
}

.custom-input .cus-radio {
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 2px solid darkgray;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.custom-input input[type="checkbox"]:checked ~ span.action > .cus-radio {
  background: var( --primary-200);
  border: 2px solid var( --primary-200);
}

.custom-input input[type="checkbox"]:checked ~ span.action > .cus-radio:before,
.custom-input input[type="checkbox"]:checked ~ span.action > .cus-radio:after {
  content: "";
  position: absolute;
  height: 2px;
  background: var(--white);
}

.custom-input input[type="checkbox"]:checked ~ span.action > .cus-radio:before {
  top: 8px;
  left: 1px;
  width: 6px;
  -webkit-transform: rotate(44deg);
  -moz-transform: rotate(44deg);
  -ms-transform: rotate(44deg);
  -o-transform: rotate(44deg);
  transform: rotate(44deg);
}

.custom-input input[type="checkbox"]:checked ~ span.action > .cus-radio:after {
  top: 6px;
  left: 3px;
  width: 12px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.custom-input input[type="radio"] ~ span.action > .cus-radio {
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.custom-input input[type="radio"]:checked ~ span.action > .cus-radio {
  border-color: var(--primary-200);
}

.custom-input input[type="radio"]:checked ~ span.action > .cus-radio:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: 10px;
  height: 10px;
  display: block;
  margin: 0 auto;
  background: var(--primary-200);
  -webkit-border-radius: 100%;
  border-radius: 100%;
  -webkit-transition: all 0.1s ease;
  -o-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  transition: all 0.1s ease;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* custom checkbox ends */
/* select */
.form-control-select {
  width: 100%;
  border: none;
  background-color: #dddddd38;
}

.form-control-select:focus {
  outline: none;
}

.form-control-select.form-control-select--style-1 {
  padding: 0;
  background-color: transparent;
  margin-left: -5px;
}

/* select ends */
/* form end css */
/* accordion */
.panel-group-style-1 .panel-group {
  margin: 0;
}
.user_details_modal .modal-dialog {
  width: 100%;
  height: auto;
  transform: translate(0, 0) !important;
  margin: 0  auto;
  right: 0;
  position: relative;
}

.user_details_modal .btn-close{
  position: absolute;
  right: 5px;
  font-size: 10px;
  color: white;
  border-radius: 100% !important;
  padding: 5px;
  top: 5px;
  background-color: white;
}
.user_details_modal .modal-body  h5.popup-info-message{
  font-size: 22px;
  color: var(--grey-200);
}
.user_details_modal .modal-content{
  height: auto;
  width: 90%;
  margin: 0 auto;
  right: 0;
  left: 0;
}
.user_details_modal .modal-header h5,.user_details_modal .modal-header p{
  font-size: 14px;
  font-weight: bold;
  text-align: left;
}
.user_details_modal .modal-body h5{
  font-size: 14px;
  margin-bottom: 4px;
  font-weight: bold;
  text-align: left;
}
.user_details_modal .modal-body p{
  font-weight: bold;
  text-align: left;
  font-size: 14px;
  margin-bottom: 10px;
  color: var(--primary-200);
}
.adminbanner-wrapper{
  background-image: url(../../img/rct/banner.png);
  background-size: cover;
  display: inline-block;
  height: 220px;
  /* margin: 30px 0 0; */
  border-radius: 8px !important;
  display: flex;
  align-items: center;
}
.adminbanner-wrapper .banner-content{
  padding:30px;
  
}
.adminbanner-wrapper .banner-content h4,.adminbanner-wrapper .banner-content h6{
  font-size: 26px;
  color: var(--white);
}
.banner_wrapper{
  /* height: 100vh; */
  /* height: calc(100vh - (10px * 2)); */
  background: var(--dark-900);
}
.tiles-wrapper .tile-icon{
  width: 60px;
  height: 60px;
  border-radius: 100% !important;
  background-color: var(--primary-200);
  position: relative;
  top:35px;
}
.tiles-wrapper .tile-icon img{
  width: 30px;
}
.tiles-wrapper .tile-text{
  border-radius: 10px !important;
  border: solid 1px var(--dark-600);
  background-color: var(--white);
  padding:20px;
  height:110px;
  width: 100%;
}
.tiles-wrapper .tile-text p{
  font-size: 18px;
  font-weight: bold;
  color: var(--black);
}
#user_master_filter input.form-control,#location_filter input.form-control,#user_assignment_filter input.form-control{
  border: solid 0 transparent;
  background-color: rgba(2, 41, 75, 0.13);
  color: var(--dark-100);
  height: 42px;
  padding:5px 10px;
  /* margin-top: -50px; */
  /* border-bottom-right-radius: 0 !important; */
  /* border-top-right-radius: 0 !important; */
}
.emp-micro-header .input-group .btn {
  background-color: var(--primary-200);
  border: solid 1px transparent;
  box-shadow: none;
  color: var(--white);
  height: 42px;
  /* border-radius: 4px !important; */
  border-bottom-left-radius: 0 !important;
  border-top-left-radius: 0 !important;
}
.user-table table thead th,.user-table table tbody td{
  font-size: 14px;
  font-weight: normal;
  text-transform: capitalize;
  padding: 10px;
  text-align: left;
}
.user-table table {
  border-collapse: collapse;
  border:none;
  /* table-layout: fixed;  */
  word-wrap:break-word; 
}
.user-table table thead th{
  background-color: var(--primary-200);
  color: var(--white);
  border:none;
}
.user-table table tbody td{
  /* color:var(--primary-200a); */
  border:none;
  border-bottom: 1pt solid #ccc;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  min-width: 1.5em;
  padding: 3px 10px;
  margin-left: 2px;
  border: 1px solid white;
  border-radius: 2px !important;
  background: transparent;
}
table.dataTable thead tr>.dtfc-fixed-left, table.dataTable thead tr>.dtfc-fixed-right, table.dataTable tfoot tr>.dtfc-fixed-left, table.dataTable tfoot tr>.dtfc-fixed-right {
  background-color: var(--primary-200) !important;
  color: var(--white);
}
.action-items span{
  margin-right:8px;
}
.user-table .dataTables_filter {
  display: inline-flex !important;
  width: 30%;
  margin-bottom: 10px;
  /* float: left; */
  margin-bottom: 10px;
  justify-content: end;
}
.user-table .dataTables_filter label{
  width:100%;
}
.action-items span i{
  font-size: 16px;
}
.action-items span i.fa-eye,.action-items span i.fa-pencil-square-o{
  color: var(--primary-200);
}
.action-items span i.fa-trash:before{
  color: var(--danger-100);
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: var(--primary-200) !important;
  border: 1px solid var(--primary-200) !important;
  color: white !important;
  background: unset;
}
.panel-group-style-1 .panel {
  border: none;
  background-color: transparent;
  margin-top: 12px !important;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.panel-group-style-1 .panel-heading {
  padding: 0;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  border: 0.3px solid #ddd5d590;
  background-color: var(--white);
}

.panel-group-style-1 .panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  color: inherit;
}

.panel-group-style-1 .panel-title a {
  font-family: "Lato-regular";
  font-size: 18px;
  line-height: 25px;
  /*font-weight: 700;*/
  color: #2e384d;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  position: relative;
  padding: 17px 100px 19px 50px;
}

@media (max-width: 767px) {
  .panel-group-style-1 .panel-title a {
    padding: 19px 16% 19px 4% !important;
    font-size: 12px;
  }
  .rc-exception-body .panel-group-style-1 .panel-title a{
    font-size: 14px;
    padding: 15px;
  }
}

@media (max-width: 767px) {
  .panel-group-style-1 .panel-title a span:nth-child {
    display: inline-block;
    padding: 0 0 0 10px;
  }
}

.panel-group-style-1 .panel-title a:after {
  content: "\f107";
  font-family: "FontAwesome";
  position: absolute;
  top: 50%;
  right: 18px;
  width: 25px;
  height: 25px;
  padding: 10.6px 7.4px 8.8px 7.7px;
  background-color: rgba(27, 74, 152, 0.12);
  -webkit-border-radius: 100%;
  border-radius: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

.panel-group-style-1 .panel-title a:hover,
.panel-group-style-1 .panel-title a:focus {
  text-decoration: none;
  outline: none;
}

.panel-group-style-1 .panel-title a.collapsed:after {
  -webkit-transform: translateY(-50%) rotate(270deg);
  -moz-transform: translateY(-50%) rotate(270deg);
  -ms-transform: translateY(-50%) rotate(270deg);
  -o-transform: translateY(-50%) rotate(270deg);
  transform: translateY(-50%) rotate(270deg);
}

.panel-group-style-1 .panel-collapse.collapse {
  display: none !important;
}

.panel-group-style-1 .panel-collapse.collapse.in {
  display: block !important;
  visibility: visible;
}

.panel-group-style-1 .panel-body {
  margin: 13.2px 0 18px 2px;
  padding: 0 18.3px 11.7px 19px;
  border: none;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
  background-color: var(--white);
}

@media (max-width: 767px) {
  .panel-group-style-1 .panel-title a {
    padding: 19px 19% 19px 4%;
    font-size: 14px;
  }
}

.panel-group-style-2 {
  -webkit-border-radius: 14px;
  border-radius: 14px;
  border: solid 0.5px #cdcdcd;
  background-color: var(--white);
  -webkit-box-shadow: 0 0 6px 0 rgba(213, 224, 254, 0.48);
  box-shadow: 0 0 6px 0 rgba(213, 224, 254, 0.48);
}

.panel-group-style-2 .panel-heading {
  background: none;
  margin: 0;
  padding: 0;
  border: none;
}

.panel-group-style-2 .panel-title a {
  padding: 10px 12px 14px 12px;
}

.panel-group-style-2 .panel-title a.collapsed .accordion-title span:before {
  -webkit-transform: translate(-50%, -50%) rotate(-90deg);
  -moz-transform: translate(-50%, -50%) rotate(-90deg);
  -ms-transform: translate(-50%, -50%) rotate(-90deg);
  -o-transform: translate(-50%, -50%) rotate(-90deg);
  transform: translate(-50%, -50%) rotate(-90deg);
}

.panel-group-style-2 .accordion-title {
  color: #2e384d;
  font-size: 18px;
  font-weight: 500;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.panel-group-style-2 .accordion-title span {
  position: relative;
  padding: 13px;
  -webkit-border-radius: 3px !important;
  border-radius: 3px !important;
  color: var(--white);
  background-color: #ad690b;
  margin: 0 10px 0 0;
}

@media (max-width: 575px) {
  .panel-group-style-2 .accordion-title span {
    padding: 15px;
  }
}

.panel-group-style-2 .accordion-title span:before {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

/* accordion ends */
/* datatable */
/* table-primary-1 start */
.table-primary-1 {
  border-collapse: collapse;
  border-spacing: 0 11px;
}

.table-primary-1 thead tr th,
.table-primary-1 tbody tr td {
  font-family: "Lato-regular";
  font-size: 18px;
  text-align: center;
  color: #2e384d;
  border: none;
  padding: 10px 0;
}
.table-primary-1 thead tr th{
  color: var( --primary-200);
}
.table-primary-1 tbody tr td {
  font-size: 16px;
}

.table-primary-1 thead tr {
  border-bottom: 1px solid var( --primary-200)33;
}

.table-primary-1 tbody tr:last-of-type {
  border-bottom: 0 none;
}

.table-primary-1 thead tr th {
  /* font-weight: 700; */
  font-family: "Lato-bold";
}

.table-primary-1 tbody tr td {
  font-weight: 400;
}

.table-primary-1 thead tr th:last-child,
.table-primary-1 tbody tr td:last-child {
  text-align: right;
}

.table-primary-1-with-header thead tr {
  background-color: transparent;
  border-bottom: 1px solid #17a36857;
  color: var(--dark-100);
}

.table-primary-1-with-header thead tr th {
  color: var( --primary-200);
  background-color: transparent;
  border-bottom: none;
}

/* delete button */
.table-primary-1 .rc-details i.fa.fa-trash {
  cursor: pointer;
  
}
.table-primary-1 .rc-details i.fa.fa-trash::before{
  color: var(--dark-300a);
  font-size: 15px;
}
.rc-exception-main .add-new-kra-table .rc-details td{
  vertical-align: middle;
}
@media (max-width: 991px) {
  .table-primary-1 thead tr th,
  .table-primary-1 tbody tr td {
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  .table-primary-1 {
    /* display: block; */
    overflow: auto;
  }

  .panel-group-style-1 .panel-title a {
    padding: 19px 19% 19px 4%;
  }

  .table-primary-1 thead tr th,
  .table-primary-1 tbody tr td {
    font-size: 16px;
    padding: 10px;
  }
}

/* table-primary-1 end */
/* .table-primary-2 */
.table-primary-2 thead,
.table-primary-2 tbody {
  display: block;
}

.table-primary-2 thead tr {
  background-color: transparent;
}

.table-primary-2 thead tr,
.table-primary-2 tbody tr,
.table-primary-2--md tfoot tr {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 10px 0;
}

.table-primary-2 thead tr {
  border-bottom: solid 0.3px var( --primary-200b);
}

.table-primary-2 tbody tr {
  border-bottom: solid 0.3px #eee;
}

.table-primary-2 thead tr th {
  color: var( --primary-200);
  background-color: transparent;
  border-bottom: none;
}

.table-primary-2 thead tr th,
.table-primary-2 tbody tr td,
.table-primary-2--md tfoot tr {
  text-align: left;
  padding: 0 12px;
}

.table-primary-2 tbody tr td,
.table-primary-2--md tfoot tr td {
  border-top: none;
}

.table-primary-2 thead tr th:nth-child(1),
.table-primary-2 tbody tr td:nth-child(1) {
  width: 45%;
}

.table-primary-2 thead tr th:nth-child(2) {
  width: 40%;
}

.table-primary-2 tbody tr td:nth-child(2) {
  width: 40%;
}

.table-primary-2 thead tr th:nth-child(3),
.table-primary-2 tbody tr td:nth-child(3) {
  width: 10%;
  text-align: center;
}

.table-primary-2 tbody {
  height: 110px;
  overflow-y: auto;
}

.table-primary-2--md tbody {
  max-height: 156px;
  min-height: 156px;
}

.table-primary-2--md thead tr {
  margin: 0;
}

.table-primary-2--md__total-title {
  font-size: 16px;
  font-weight: normal;
  color: #2e384d;
  margin: 0;
}

.table-primary-2--md__total-title + .table-primary-2--md__total-title {
  margin: 12px 0 0 0;
}

@media (max-width: 767px) {
  .table-primary-2 thead tr th,
  .table-primary-2 tbody tr td {
    font-size: 14px;
  }
}

/* .table-primary-2  end */
/* table-primary-3 start */
.table-primary-3 {
  width: 100%;
  border-collapse: collapse;
}

.table-primary-3 td:first-child,
.table-primary-3 td:last-child,
.table-primary-3 th:first-child,
.table-primary-3 th:last-child {
  text-align: left;
}

.table-primary-3 td:last-child,
.table-primary-3 th:last-child {
  text-align: center;
}
.table-primary-3 td:last-child {
  font-family: "Lato-bold";
}
.table-primary-3--style-2 thead td:first-child,
.table-primary-3--style-2 thead th:first-child,
.table-primary-3--style-2 tbody td:first-child,
.table-primary-3--style-2 tbody th:first-child {
  text-align: left;
}

.table-primary-3--style-2 thead td:nth-child(2),
.table-primary-3--style-2 thead th:nth-child(2),
.table-primary-3--style-2 tbody td:nth-child(2),
.table-primary-3--style-2 tbody th:nth-child(2) {
  text-align: center;
}
.table-primary-3 thead {
  /* background-color: #003378; */
}

.table-primary-3 thead,
.table-primary-3 tbody {
  width: auto;
}

.table-primary-3 thead tr,
.table-primary-3 tbody tr {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

/* .table-primary-3 tbody tr:last-of-type {
  border-top: 1px dashed #cdcdcd;
} */

.table-primary-3 thead tr th,
.table-primary-3 tbody tr td {
  font-family: "Lato-regular";
  font-size: 16px;
  /* font-weight: 400; */
  text-align: left;
  color: var(--dark-200);
  border: none;
  padding: 8px 0;
  line-height: 16px;
}


.table-primary-3 thead tr {
  background-color: transparent;
  border-bottom: 1px dotted var(--dark-400);
}

.table-primary-3 thead tr th {
  color: var( --primary-200);
  background-color: transparent;
  border-bottom: none;
  /* font-weight: 700; */
  font-size: 17px;
  font-family: "Lato-bold";
  padding: 8px 0;
  line-height: 19px;
  /* padding-left: 10px;
  padding-right: 10px; */
}
.table-primary-3 thead tr th:first-of-type {
  border-radius: 3px 0 0 3px !important;
}
.table-primary-3 thead tr th:last-of-type {
  border-radius: 0 3px 3px 0 !important;
}

.table-primary-3 tbody tr td {
  border-top: solid 0 var(--primary-200);
  border-bottom: solid 0 var(--primary-200);
}

.table-primary-3 tbody tr td:first-child,
.table-primary-3 thead tr th:first-child {
  border-left: solid 0 var(--primary-200);
  -webkit-border-top-left-radius: 6px;
  border-top-left-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.table-primary-3.table-primary-3--style-2 tfoot tr td {
  font-size: 16px;
  line-height: 19px;
  color: var(--primary-200);
  border: 0;
  font-family: "Lato-bold";
  padding-left: 0;
}
.table-primary-3.table-primary-3--style-2 tfoot tr td:last-child{
  padding-left: 10px;
}


.table-primary-3 thead tr th {
  white-space: nowrap;
}

.table-primary-3 tbody tr td:last-child,
.table-primary-3 thead tr th:last-child {
  border-right: solid 0 var(--primary-200);
  -webkit-border-top-right-radius: 6px;
  border-top-right-radius: 6px;
  -webkit-border-bottom-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.table-primary-3 thead tr th:nth-child(2),
.table-primary-3 tbody tr td:nth-child(2) {
  text-align: left;
  padding-left: 15px;
  padding-right: 15px;
}

.table-primary-3--style-2 {
  padding: 10px 25px;
}

.table-primary-3--style-2 thead td:first-child,
.table-primary-3--style-2 thead th:first-child,
.table-primary-3--style-2 tbody td:first-child,
.table-primary-3--style-2 tbody th:first-child {
  text-align: left;
}

.table-primary-3--style-2 thead td:nth-child(2),
.table-primary-3--style-2 thead th:nth-child(2),
.table-primary-3--style-2 tbody td:nth-child(2),
.table-primary-3--style-2 tbody th:nth-child(2) {
  text-align: right !important;
}

@media (max-width: 991px) {
  .table-primary-3 thead tr th,
  .table-primary-3 tbody tr td {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .table-primary-3 {
    /* display: block; */
    overflow: auto;
  }

  .panel-group-style-3 .panel-title a {
    padding: 19px 19% 19px 4%;
  }

  .table-primary-3 thead tr th,
  .table-primary-3 tbody tr td {
    font-size: 16px;
    padding: 10px;
  }
}

.com-error-popup .fa-exclamation-circle {
  color: #dd4b39;
}

.com-error-popup .close-icon {
  position: absolute;
  top: 9px;
  right: 9px;
  width: 8px;
  height: 8px;
  cursor: pointer;
}

.com-error-popup .close-icon:after,
.com-error-popup .close-icon:before {
  content: "";
  position: absolute;
  width: 1px;
  height: 8px;
  background-color: gray;
}

.com-error-popup .close-icon:after {
  -webkit-transform: rotate(140deg);
  -moz-transform: rotate(140deg);
  -ms-transform: rotate(140deg);
  -o-transform: rotate(140deg);
  transform: rotate(140deg);
}

.com-error-popup .close-icon:before {
  -webkit-transform: rotate(40deg);
  -moz-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
  -o-transform: rotate(40deg);
  transform: rotate(40deg);
}

.com-error-popup__message {
  font-family: "Lato";
  font-size: 15px;
  color: #da2932;
  text-align: center;
  margin: 5px 0 0 0;
}


/* error pop design */
/* modal */
.modal {
  /* left: auto; */
  font-family: "Lato-regular";
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.4);
}
.modal--header,
.bootstrap-dialog-title {
  background: transparent;
  color: #2c2c2c;
  font-size: 18px;
  line-height: 22px;
  border-bottom: 0;
  padding: 0;
}
/* .modal-header{
  padding: 25px 23px 15px 23px;
  display: block;
} */
.modal-title {
  color:var( --primary-200);
  font-family: "Lato-bold";
  font-size: 20px;
  line-height: 24px;
}

.bootstrap-dialog-header {
  position: relative;
}
.bootstrap-dialog .modal-header {
  background: transparent;
  color: #2c2c2c;
  font-size: 18px;
  font-weight: bold;
  line-height: 22px;
  border-bottom: 0;
  padding: 0;
}
.modal .bootstrap-dialog-close-button .close {
  z-index: 999;
  font-size: 30px;
  color: #b0bac9 !important;
  position: absolute;
  top: 2px;
  right: 27px;
  margin: 0;
  display: flex;
  align-items: center;
  box-sizing: content-box;
  width: auto;
  height: -webkit-fill-available;
  padding: 0;
  color: var(--black);
  border: 0;
  -webkit-border-radius: 0.375rem;
  border-radius: 0.375rem;
  opacity: 0.5;
}
.bootstrap-dialog .modal-body {
  height: calc(100vh - 75px);
}
.modal-body p,
.bootstrap-dialog-message {
  font-family: "Lato-regular";
}
.bootstrap-dialog-body {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* .modal-dialog {
  width: 100%;
  height: 100%;
  transform: translate(0, 0) !important;
  margin: 0 0 0 auto;
  right: 0;
  position: relative;
} */

/* .modal-content {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  height: 100vh;
  width: 421px;
  border: 0;
  box-shadow: -8px 0px 36px var(--box-shadow-1);
  position: absolute;
  right: 0;
  padding: 0;
} */

.modal-content div[class^="modal_dynamic"] {
  height: calc(100vh - 89px);
  overflow-y: auto;
  padding: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-body {
  float: none;
  -webkit-border-bottom-left-radius: 10px;
  border-bottom-left-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  border-bottom-right-radius: 10px;
  /* padding-bottom: 2rem; */
 /* text-align: center; */
}

.modal .close {
  position: absolute;
  top: 20px;
  right: 27px;
  width: 37px;
  height: 37px;
  padding: 12.1px 12.5px 12.9px 12.5px;
  background-color: var(--white);
  -webkit-border-radius: 100%;
  border-radius: 100%;
  opacity: 1;
  -webkit-border-radius: 50px !important;
  border-radius: 50px !important;
  margin: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  width: 1em;
  height: 1em;
  padding: 0.25em 0.25em;
  color: var(--black);
  border: 0;
  -webkit-border-radius: 0.375rem;
  border-radius: 0.375rem;
  opacity: 0.5;
  z-index:9999;
}
.modal .close span {
  font-size: 30px;
  color: #191c1b70;
  font-family: "Lato";
}

.modal .close:hover,
.modal .close:focus {
  outline: none;
}

.modal .close:after,
.modal .close:before {
  position: absolute;
  top: 48%;
  right: 48%;
  width: 2px;
  height: 14px;
  background-color: var(--dark-100);
  -webkit-transform: translate(-48%, -48%) rotate(40deg);
  -moz-transform: translate(-48%, -48%) rotate(40deg);
  -ms-transform: translate(-48%, -48%) rotate(40deg);
  -o-transform: translate(-48%, -48%) rotate(40deg);
  transform: translate(-48%, -48%) rotate(40deg);
}

.modal .close:after {
  -webkit-transform: translate(-48%, -48%) rotate(-40deg);
  -moz-transform: translate(-48%, -48%) rotate(-40deg);
  -ms-transform: translate(-48%, -48%) rotate(-40deg);
  -o-transform: translate(-48%, -48%) rotate(-40deg);
  transform: translate(-48%, -48%) rotate(-40deg);
}

@media (max-width: 767px) {
  .modal .close {
    top: 9px;
    bottom: -59px;
    right: -92%;
    left: 0;
    width: 20px;
    height: 20px;
    display: block;
    margin: 0 auto;
    border: 0 none;
    background-color: #ffffff7d;
    -webkit-border-radius: 100%;
    border-radius: 100%;
  }

  .modal .close:after,
  .modal .close:before {
    background-color: var(--white);
  }
}

@media (max-width: 767px) {
  .modal .modal-dialog {
    width: calc(100% - 0px);
  }
}

/* modal end */
/* block-title */
.block-title {
  color: #2e384d;
  font-family: "Lato";
  font-size: 24px;
  font-weight: 500;
  margin: 0 0 28px 0;
}
.block-title--style-2 {
  font-size: 25px;
  line-height: 31px;
  font-family: "Lato-bold";
  /* font-weight: 700; */
  color: var( --primary-200);
  margin: 0;
  display: flex;
  align-items: center;
}
/* block-title ends */
/* breadcrumb */
.com-breadcrumb {
  display: none;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  margin-bottom: 25px;
}

.com-breadcrumb li {
  position: relative;
}

.com-breadcrumb a {
  color: #2e384d;
  font-family: "Lato", sans-serif;
  font-size: 16px;
  opacity: 0.5;
}

.com-breadcrumb a:hover,
.com-breadcrumb a:focus {
  text-decoration: none;
}

.com-breadcrumb a.active {
  opacity: 1;
}

.com-breadcrumb li + li {
  padding-left: 20px;
}

.com-breadcrumb li + li:after {
  content: "/";
  position: absolute;
  top: 0;
  left: 7px;
}

/* com-breadcrumb ends */
/* accordion design */
.panel-group .panel {
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.accordion-style-1 .panel-default > .panel-heading {
  padding: 0;
  border: none;
}

.accordion-style .panel-title a {
  position: relative;
  display: block;
  text-decoration: none;
}

.accordion-style .panel-title a:hover,
.accordion-style .panel-title a:focus {
  text-decoration: none;
}

.accordion-style .accordion-style-arrow {
  position: absolute;
  top: 50%;
  right: 0;
  width: 33px;
  height: 33px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.accordion-style .accordion-style-arrow .fa {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(0deg);
  -moz-transform: translateY(-50%) rotate(0deg);
  -ms-transform: translateY(-50%) rotate(0deg);
  -o-transform: translateY(-50%) rotate(0deg);
  transform: translateY(-50%) rotate(0deg);
  -webkit-transition: rotate 0.5s ease;
  -o-transition: rotate 0.5s ease;
  -moz-transition: rotate 0.5s ease;
  transition: rotate 0.5s ease;
}


.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border: none;
}

/* style 1 */
.accordion-style-1 .panel-title a {
  font-family: "Lato-bold";
  font-size: 18px;
  color: var(--dark-100);
  /* font-weight: bold; */
  line-height: 1.33;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  background-color: var(--grey-900);
  padding: 11px 13px 10.4px 28px;
  border: 0.3px solid #ddd5d590;
}

.accordion-style.accordion-style-1 .accordion-style-arrow {
  right: 13px;
  background-color: transparent;
  padding: 12px 9px 12px 8.2px;
  border: 0 none;
}

.accordion-style.accordion-style-1 .accordion-style-arrow .fa {
  font: normal normal normal 20px/1 FontAwesome;
}

.accordion-style-1 .panel-body {
  padding: 0;
  margin: 15px 0 0;
}

/* style 1 */
.accordion-style-2 .panel-title a {
  font-family: "Lato";
  font-size: 18px;
  color: var(--dark-100);
  font-weight: bold;
  line-height: 1.33;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  background-color: var(--grey-900);
  padding: 8px 9.7px 8.9px 19.2px;
  border: 0.3px solid #1c1a1a90;
}

.accordion-style.accordion-style-2 .accordion-style-arrow {
  right: 9px;
  background-color: transparent;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  padding: 12px 9px 12px 8.2px;
}

.accordion-style.accordion-style-2 .accordion-style-arrow .fa {
  font: normal normal normal 20px/1 FontAwesome;
}

.accordion-style-2 .panel-body {
  background-color: var(--white);
  padding: 15px 19px;
  margin: 0;
}

/* accordion-style-3 */
.accordion-style-3 .panel-title a {
  font-family: "Lato";
  font-size: 18px;
  font-weight: bold;
  font-style: normal;
  line-height: 1.21;
  color: #2e384d;
  padding: 10px 11.2px 10.3px 24.3px;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  border: 0.3px solid #ddd5d590;
  background-color: var(--grey-900);
}

.accordion-style.accordion-style-3 .accordion-style-arrow {
  width: 13.9px;
  height: 7.9px;
  color: #da2932;
  background-color: transparent;
  padding: 0;
}

/* accordion design ends */
/* global ends */
/* common kra page design start here */
.rc-exception-main {
  padding: 15px;
  margin: 15px 0;
  height: calc(100vh - 235px);
  overflow-y: auto;
}

.rc-exception-list {
  height: calc(100vh - 120px);
}

.rc-exception-main .add-new-kra-table thead th:last-of-type,
.rc-exception-main .add-new-kra-table thead td:last-of-type,
.rc-exception-main .add-new-kra-table tbody th:last-of-type,
.rc-exception-main .add-new-kra-table tbody td:last-of-type {
  text-align: right;
}
.add-new-kra-table thead th:nth-child(2),
.add-new-kra-table tbody .kra_wgt_exp {
  width: 12%;
}

.add-new-kra-table thead th:nth-child(3),
.add-new-kra-table tbody td:nth-child(3) {
  width: 5%;
}
.add-new-kra-table .kra_added-row-highlight .kra_wgt_exp {
  display: none;
}
.rc-exception-main .add-new-kra-table .rc-details {
  border-top: 1px solid #cdcdcd5c;
  border-bottom: 0 none;
}
.rc-exception-main .add-new-kra-table .rc-details:first-child {
  border-top: 0 none;
}

.rc-exception-main .add-new-kra-table .rc-details td:first-of-type {
  padding: 10px 0 10px 10px;
  white-space: pre-wrap;
}

.rc-exception-main .add-new-kra-table .rc-details td:last-of-type {
  padding: 10px 10px 10px 0;
}
.rc-exception-main .add-new-kra-table .rc-details.kra_added-row-highlight td:first-child {
    width: 95%;
}
.kra-desc-table thead tr th{
  padding: 0 0 8px 0;
}
.kra-desc-table tbody tr td:first-of-type {
  width: 80%;
}
.kra-desc-table tbody tr td:nth-child(2) {
  /* background: pink; */
  position: relative;
}
.kra-desc-table tbody tr td:nth-child(2)::before {
  content: "";
  position: absolute;
  /* left:0; */
}
.kra-desc-table.scrollTable th:last-of-type, .kra-desc-table.scrollTable td:last-of-type {
  width: 13%;
}
.kra-desc-table.scrollTable th:last-of-type{
  width: 15%;
}
.rc-exception-main .add-new-kra-table .rc-details.kra_added-row-highlight,
.kra-desc-table tbody .kra_wgt-modified {
  background: rgba(255, 244, 198, 0.5);
  outline: 0.3px dashed #987b02;
  -webkit-border-radius: 5px !important;
  border-radius: 5px !important;
  position: relative;
  margin-bottom: 10px;
}
.kra-desc-table tbody .kra_wgt-modified td{
  padding-left: 5px;
}
.rc-exception-main .add-new-kra-table .rc-details.kra_added-row-highlight td,
.kra-desc-table tbody .kra_wgt-modified td {
  font-family: "Lato-bold";
  color: #ad690b;
}
.kra-desc-table.scrollTable tfoot {
  display: block;
}
.kra-desc-table.scrollTable tbody,
.kra-desc-table.scrollTable tfoot {
  padding: 2px 3px 0 1px;
  /* margin-right: 10px; */
}
.rc-exception-main
  .add-new-kra-table
  .rc-details.kra_added-row-highlight
  td:last-child,
.kra-desc-table tbody .kra_wgt-modified td:last-child,
.kra-desc-table tbody .kra_wgt-modified td:nth-child(2) {
  display: block;
  position: relative;
  width: auto;
}

.rc-exception-main
  .add-new-kra-table
  .rc-details.kra_added-row-highlight
  td:last-child::before,
.rc-exception-main
  .add-new-kra-table
  .rc-details.kra_added-row-highlight
  td:last-child::after {
  content: "";
  display: block;
  position: absolute;
  right: 100%;
  width: 20px;
  height: 9px;
  z-index: 2;
  background-color: var(--white);
  border: 0.3px dashed #987b02;
}

.kra-desc-table tbody .kra_wgt-modified td:nth-child(2)::before,
.kra-desc-table tbody .kra_wgt-modified td:nth-child(2)::after {
  content: "";
  display: block;
  position: absolute;
  width: 20px;
  height: 9px;
  z-index: 2;
  background-color: var(--white);
  border: 0.3px dashed #987b02;
  right: 0;
}
.rc-exception-main
  .add-new-kra-table
  .rc-details.kra_added-row-highlight
  td:last-child::before,
.kra-desc-table tbody .kra_wgt-modified td:nth-child(2)::before {
  top: -2px;
  -webkit-border-radius: 0 0 15px 15px;
  border-radius: 0 0 15px 15px;
  border-top: 0;
}

.rc-exception-main
  .add-new-kra-table
  .rc-details.kra_added-row-highlight
  td:last-child::after,
.kra-desc-table tbody .kra_wgt-modified td:nth-child(2)::after {
  bottom: -2px;
  -webkit-border-radius: 15px 15px 0 0;
  border-radius: 15px 15px 0 0;
  border-bottom: 0;
}
.scroll-table .kra-desc-table td,
th {
  background-color: initial;
}
.rc-exception-main .rc_next_btn {
  margin-right: 0;
}
.kra-desc-table tbody .kra_wgt-modified td:last-child{
  display: table-cell;
  width: 15%;
}
.kra-desc-table tbody .kra_wgt-modified td:nth-child(2) {
  display: table-cell;
  width: 7%;
}
.rc-exception-breadcrumb {
  display: none;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* .rc-exception-head {
  margin-bottom: 9px;
} */

.rc-exception-head .rc-exception-breadcrumb {
  margin-bottom: 25px;
}

.rc-exception-breadcrumb li {
  position: relative;
}

.rc-exception-breadcrumb a {
  color: #2e384d;
  font-family: "Lato", sans-serif;
  font-size: 16px;
  opacity: 0.5;
}

.rc-exception-breadcrumb a:hover,
.rc-exception-breadcrumb a:focus {
  text-decoration: none;
}

.rc-exception-breadcrumb a.active {
  opacity: 1;
}

.rc-exception-breadcrumb li + li {
  padding-left: 20px;
}

.rc-exception-breadcrumb li + li:after {
  content: "/";
  position: absolute;
  top: 0;
  left: 7px;
}

/* main */
.rc-exception-main__title {
  color: var( --primary-200);
  /* font-family: "Lato"; */
  font-family: "Lato-semibold";
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 5px 0;
}

.rc-exception-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  /*flex-wrap: wrap;*/
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #cdcdcd;
}

.rc-exception-row:last-of-type {
  border-bottom: 0 none;
}

.rc-exception-field-head {
  background-color: transparent;
  color: var(--dark-100);
  border-bottom: 1px solid #15734E57;
  padding: 0 0 8px 0;
  margin-right: 20px;
}

.rc-exception-row p {
  color: #2e384d;
  font-family: "Lato-regular";
  font-size: 18px;
  margin: 0;
}

.rc-exception-field-head p {
  color: var( --primary-200);
  /* font-weight: 700; */
  font-family: "Lato-bold";
  text-align: center;
}

/* common kra page design start here */
/* add  kra page design start here */
.add-kra-page {
  margin-top: 5px;
}
@media (max-width: 767px) {
  .add-kra-page .rc-exception-main {
    padding: 20px;
  }
  .rc-exception-main{
    height: auto;
  }
}

/* title */
.add-kra-page-main-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin: 0 0 5px 0;
}

.add-kra-page-main-header .rc-exception-main__title {
  margin: 0;
}

@media (max-width: 767px) {
  .add-kra-page-main-header,
  .add-kra-page-main-header .rc-exception-main__title {
    margin: 0 0 18px 0;
  }
}

/* title end */
/* modal btn */
.add-kra-page__add-modal {
  font-family: "Lato-bold";
  font-size: 13px;
  color: var(--white);
  padding: 8px 15px;
  border: 1px solid var(--primary-200);
  background-color: var(--primary-200);
  /* padding-right: 40px; */
}

.add-kra-page__add-modal:hover,
.add-kra-page__add-modal:focus {
  text-decoration: none;
  color: var(--primary-200);
  border: 1px solid var(--primary-200);
  background-color: var(--white);
}
.add-kra-page__add-modal:hover .modal-btn-yes-white-arrow,
.btn:hover .modal-btn-yes-white-arrow {
  display: none;
}
.add-kra-page__add-modal:hover .modal-btn-yes-blue-arrow,
.btn:hover .modal-btn-yes-blue-arrow {
  display: inline-block;
}

.add-kra-page__add-modal i {
  margin: 0 18px 0 0;
  padding: 9px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: var(--white);
  background-color: #f6cf23;
}

/* modal btn end */
.add-kra-page .table-primary-1 thead tr th:first-child,
.add-kra-page .table-primary-1 tbody tr td:first-child {
  text-align: left;
}

.add-kra-page .btn-primary {
  display: block;
  margin-left: auto;
}

/* modal design */
.kra-modal .modal-dialog {
  /* width: 653px; */
  /* margin: 85px auto 0 auto; */
  margin: 0 0 0 auto;
}

.kra-modal .modal-content {
  -webkit-border-radius: 14px;
  border-radius: 14px;
  /* background-color: transparent; */
  border: none;
}

.kra-modal .modal-header {
  min-height: auto;
  border: none;
  padding: 25px;
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important;
  position: relative;
  background-color: transparent !important;
}

.kra-modal .modal-title {
  font-family: "Lato-bold", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--primary-200);
  line-height: 1;
  opacity: 1;
}
.modal.kra-modal .btn-primary{
  padding:8px 16px;
}

.rc_kra_title .close {
  top: 0;
}

.kra-modal .modal-body {
  width: 100%;
  -webkit-border-radius: 0;
  border-radius: 0;
  padding: 20px 25px 25px;
  margin-top: 0;
}

.ADDNewKRA.hide,
.add_new_kra.hide,
.CreatenewKra-content,
.reason_change_kra {
  display: none;
}

.CreatenewKra-content.acitve,
.reason_change_kra.acitve {
  display: block;
}

.textarea-modal {
  margin-top: 15px;
}

.textarea-modal p {
  font-family: "Lato";
  font-size: 15px;
  margin-bottom: 14px;
}

.textarea-modal textarea {
  width: 100%;
  color: #2e384d;
  font-family: "Lato";
  font-size: 13px;
  padding: 12px;
  text-align: left;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: solid 0px #b0bac9;
  background-color: #f4f6fc;
}

button:hover,
button:focus {
  outline: none !important;
}

.textarea-modal .kra_add_btn,
.textarea-modal .existing_kra_add_btn {
  font-size: 13px;
  /* margin: 0 auto; */
  display: block;
  padding: 6px 15px;
  -webkit-border-radius: 0;
  border-radius: 0;
  border-color: #0c56bb;
  text-transform: capitalize;
  margin-top: 21px;
  min-width: 115px;
}

.kra-modal .dropdown-kra-list-search .existing_kra_add_btn {
  /*padding-right: 45px;*/
  width: auto;
}

@media (max-width: 991px) {
  .kra-modal .modal-dialog {
    width: calc(90% - 30px);
  }

  .kra-modal .modal-body > .row > div + div {
    margin-top: 63px;
  }
}

@media (max-width: 767px) {
  .kra-modal .modal-body {
    padding: 33px 15px;
  }

  .textarea-modal .kra_add_btn {
    width: 100%;
    font-size: 14px;
  }

  .kra-modal .modal-title {
    font-size: 16px;
  }
}

@media (max-width: 575px) {
  .kra-modal .modal-dialog {
    width: 100%;
  }
}

.rc-exception-add-kra .rc-exception-body p {
  font-size: 16px;
}

.rc-exception-add-kra .rc-exception-right {
  width: 20%;
}

.rc-exception-add-kra .rc-exception-right .form-control {
  padding: 4px 1px;
}

.rc-exception-add-kra .rc-exception-row .form-control {
  width: 36px;
  height: 28px;
  display: block;
  margin: 0 auto;
  text-align: center;
  font-size: 16px;
  font-family: "Lato-regular";
  background: #cacaca24;
  border: 1px solid #cacaca4d;
  border-radius: 4px !important;
  color: var(--dark-200);
}

.rc-exception-add-kra .rc-exception-footer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 27px;
}

.rc-exception-add-kra .form-control--text-area {
  width: 100%;
  height: 142px;
  background: #978c5f12;
  border-radius: 5px !important;
  border: 0 none;
  font-size: 14px;
  font-family: "Lato-regular";
  color: #a5a5a5;
}

.rc-exception-add-kra .rc-exception-body .rc-exception-row:last-child {
  text-align: center;
}

.rc-exception-add-kra
  .rc-exception-body
  .rc-exception-row:last-child
  .rc-exception-left
  p {
  font-size: 16px;
  text-align: left;
}

.rc-exception-body .panel-group-style-1 .panel-body {
  overflow-x: auto;
}

@media (max-width: 767px) {
  .rc-exception-add-kra .form-control--text-area {
    width: 100%;
    height: 142px;
  }

  .rc-exception-add-kra .rc-exception-body .rc-exception-row {
    flex-wrap: nowrap;
  }
}

@media (max-width: 767px) {
  .rc-exception-add-kra .rc-exception-row .form-control {
    width: 100%;
  }

  .rc-exception-add-kra .rc-exception-right {
    width: 20%;
  }
}

.rc-exception-add-kra .rc-exception-add-kra__error-popup {
  position: relative;
  width: 85%;
  margin: 0 auto;
  /* padding-right: 20px; */
}

/* kra weightage design end */
/* rc-exception-ExList */
.rc-exception-ExList .rc-exception-row.rc-exception-field-head {
  padding: 17px 0;
}
.rc-exception-ExList .rc-exception-body .exp_list-table thead th:last-of-type{
  width:11%;
}

@media (max-width: 991px) {
  .rc-exception-main {
    padding: 31px 3.33% 74px 3.68%;
  }

  .rc-exception-add-kra .rc-exception-footer {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
  }

  .rc-exception-add-kra .rc-exception-footer > div {
    width: 100%;
  }

  .rc-exception-add-kra .weightage-error-pop {
    left: 127px;
    bottom: -48px;
  }
}

@media (max-width: 767px) {
  /* common kra page design start here */
  .rc-exception-head .rc-exception-breadcrumb {
    margin-bottom: 15px;
  }

  .rc-exception-main__title {
    font-size: 16px;
    margin: 0 0 18px 0;
  }

  .rc-exception-row p {
    font-size: 16px;
    text-align: left;
  }

  .rc-exception-add-kra .rc-exception-footer > div + div {
    margin-top: 0px !important;
  }

  .rc-exception-add-kra .rc-exception-footer {
    margin-top: 25px;
  }

  .rc-exception-add-kra .weightage-error-pop {
    left: 0;
    bottom: 297px;
    width: 100%;
  }

  .rc-exception-main {
    padding: 31px 3.33% 31px 3.68%;
  }

  /* common kra page design start end */
  /* kra weightage */
  .rc-exception-add-kra .rc-exception-footer > div {
    width: 100%;
  }

  .rc-exception-add-kra .rc-exception-footer > div + div,
  .rc-exception-add-kra .rc-exception-footer > div button + button {
    margin-top: 10px;
  }

  .rc-exception-add-kra .rc-exception-footer > div button {
    text-align: center;
  }

  /* kra weightage end */
}

/* dahsboard changes on production */
.login_details span {
  color: var(--primary-200);
}

.login_details {
  border-bottom: 1px solid var(--primary-200);
  padding: 0 0 5px 10px;
}

.login a {
  text-align: left;
  padding: 10px !important;
}


/* dahsboard changes on production end */
/* header */


.rc-main-header .main-header > .container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.rc-main-header .main-header .navbar-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  float: none;
  margin-left: 0;
  /* width: 32%; */
}

.rc-main-header .main-header .navbar-nav {
  width: calc(100% - 12%);
  float: none;
  align-items: center;
  justify-content: flex-start;

}

.rc-main-header .main-header .navbar-nav > li.navbar-nav--global-search {
  width: 65%;
}

.rc-main-header .main-header .navbar-nav > li {
  float: none;
}

.rl-main-nav .initials--login {
  display: none;
}

/* header - brand design */
.rc-main-header .main-header .navbar-header .navbar-brand {
  padding: 0;
  height: auto;
  float: none;
  /* width: 50%; */
}

.rc-main-header .main-header .navbar-header .navbar-brand + .navbar-brand {
  margin-left: 10px;
}

.rc-main-header .main-header .navbar-header .navbar-brand img {
  width: auto;
  height: 65px;
}

/* header - right side design */
.rc-main-header
  .main-header
  .navbar-nav
  > li.navbar-nav--global-search
  .navbar-form {
  margin: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.rc-main-header
  .main-header
  .navbar-nav
  > li.navbar-nav--global-search
  .navbar-form
  .form-group-seachbox,
.rc-main-header
  .main-header
  .navbar-nav
  > li.navbar-nav--global-search
  .navbar-form
  .form-group-seachbox
  .form-control {
  width: 100%;
}

/* right side nav design */
.left-quick-nav {
  position: absolute;
  left: 10px;
  top: 45%;
  width: 48px;
  height: 48px;
  -webkit-transform: translateY(-45%);
  -moz-transform: translateY(-45%);
  -ms-transform: translateY(-45%);
  -o-transform: translateY(-45%);
  transform: translateY(-45%);
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.main-header .left-quick-nav:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 48px;
  height: 48px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  background-color: #f4f6fc;
}

.main-header .left-quick-nav:after {
  content: "\f0c9";
  position: absolute;
  font: normal normal normal 14px/1 FontAwesome;
  top: 50%;
  left: 50%;
  color: #da2932;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.hr-left-nav {
  position: absolute;
  min-height: 100%;
  top: 83px;
  left: -100%;
  width: 68px;
  padding: 0;
  margin: 0;
  z-index: 9999;
  list-style: none;
  background-color: var(--white);
  -webkit-box-shadow: 0 3px 6px 0 rgba(213, 224, 254, 0.48);
  box-shadow: 0 3px 6px 0 rgba(213, 224, 254, 0.48);
  -webkit-transition: left 0.5s ease;
  -o-transition: left 0.5s ease;
  -moz-transition: left 0.5s ease;
  transition: left 0.5s ease;
}

.hr-left-nav li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.hr-left-nav li span.fa {
  color: #b0bac9;
  font-size: 19px;
  padding: 20px;
}

.hr-left-nav li a {
  width: 100%;
  color: #b0bac9;
  font-size: 19px;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.hr-left-nav li a:hover,
.hr-left-nav li a:focus {
  color: var(--white);
  background-color: var(--primary-200);
  text-decoration: none;
}

.hr-left-nav.active {
  left: 0;
}

.hr-left-nav__title {
  display: none;
}

@media (max-width: 991px) {


  .header-with-right-nav .container.rc-dashboard-container {
    width: 90%;
  }

  .header-with-right-nav .navbar-brand > img {
    width: 90%;
  }

  .rc-main-header .main-header .navbar-nav > li.navbar-nav--global-search {
    width: 100%;
    padding: 0;
  }

  .header-with-right-nav .navbar-header {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .header-with-right-nav .main-header {
    max-height: initial;
  }

  /* .header-with-right-nav .form-group {
    width: 70%;
  } */

  .header-with-right-nav .form-group-seachbox .form-control {
    width: 100%;
  }

  .header-with-right-nav .navbar-header {
    padding-left: 0;
  }

  .left-quick-nav {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  .advance-btn {
    margin-left: 10px;
  }

  .hr-left-nav {
    top: 169px;
  }
}

@media (max-width: 767px) {
  .header-with-right-nav .container.rc-dashboard-container {
    width: 100%;
  }

  /* header */
  .dashboard .header-with-right-nav .main-header > .container {
    padding-left: 50px;
  }

  .header-with-right-nav .main-header {
    padding: 0;
  }

  .dashboard .header-with-right-nav .main-header {
    padding: 14px 0;
  }

  .rc-main-header .main-header .navbar-header {
    width: 100%;
    height: auto;
    margin: 0;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }



  .header-with-right-nav .navbar-brand > img {
    width: 100%;
  }

  .rc-main-header .main-header .navbar-header .navbar-brand + .navbar-brand {
    margin-left: 15px;
  }

  .header-with-right-nav .navbar-nav li.navbar-nav--global-search {
    position: absolute;
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    float: none;
    left: 0;
    bottom: 0;
    padding-left: 63px;
  }

  .header-with-right-nav .navbar-nav li:nth-child(4) {
    display: none;
  }

  .dashboard .header-with-right-nav .navbar-nav li:nth-child(4) {
    position: absolute;
    left: 0;
    display: block;
  }

  .dashboard .header-with-right-nav .navbar-nav li:nth-child(4) a {
    background-color: transparent;
  }

  /* faq side bar design */
  .sidebar-mini.sidebar-collapse .main-sidebar {
    width: 100% !important;
  }

  .sidebar-mini .main-sidebar {
    position: absolute !important;
    width: 100% !important;
    padding-top: 0;
    top: 121px;
    height: auto;
    right: 100% !important;
    left: auto;
    min-height: initial;
    -webkit-transform: initial !important;
    -moz-transform: initial !important;
    -ms-transform: initial !important;
    -o-transform: initial !important;
    transform: initial !important;
    -webkit-transition: right 0.5s ease;
    -o-transition: right 0.5s ease;
    -moz-transition: right 0.5s ease;
    transition: right 0.5s ease;
  }

  .sidebar-mini.sidebar-open .main-sidebar {
    right: 0 !important;
  }

  .main-sidebar.right-sidebar .sidebar {
    padding-bottom: 0;
  }

  .main-sidebar.right-sidebar .sidebar .right-sidebar__menus {
    margin-top: 0;
  }

  .header-with-right-nav .navbar-nav li {
    width: auto;
  }

  .rl-main-nav {
    width: auto;
    margin: 0 0 0 auto;
  }

  .rc-main-header .main-header .navbar-nav {
    width: 40%;
    float: none;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0;
  }



  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form {
    padding: 0 15px 10px 15px;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form
    .form-group-seachbox {
    margin: 0;
  }

  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form
    .form-group-seachbox
    .form-control {
    /* opacity: 0.13; */
    background-color: var(--white);
    padding: 5px 10px 5px 39px;
  }

  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form
    .form-group-seachbox
    .form-control::-webkit-input-placeholder,
  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form
    .form-group-seachbox
    .form-control::-moz-placeholder,
  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form
    .form-group-seachbox
    .form-control::-ms-input-placeholder,
  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form
    .form-group-seachbox
    .form-control::-moz-placeholder {
    color: #b0bac9;
  }

  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .navbar-form
    .form-group-seachbox:after {
    color: #b0bac9;
  }

  .rc-main-header
    .main-header
    .navbar-nav
    > li.navbar-nav--global-search
    .advance-btn {
    display: none;
  }

  .left-quick-nav {
    top: 91%;
    left: 15px;
    width: 32px;
    height: 32px;
    -webkit-transform: translateY(-91%);
    -moz-transform: translateY(-91%);
    -ms-transform: translateY(-91%);
    -o-transform: translateY(-91%);
    transform: translateY(-91%);
  }

  .main-header .left-quick-nav:before {
    width: 32px;
    height: 32px;
    background-color: transparent;
  }

  .main-header .left-quick-nav:after {
    color: var(--white);
    font: normal normal normal 24px/1 FontAwesome;
  }

  .hr-left-nav {
    top: 12%;
  }

  .hr-left-nav.active {
    width: 100%;
    min-height: auto;
  }

  .hr-left-nav li {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .hr-left-nav__title {
    display: block;
  }

  .hr-left-nav li a {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
}

@media (max-width: 460px) {
  .main-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    max-height: 100%;
  }

  .main-header > .container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .main-header .container > .navbar-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

@media (max-width: 359px) {
  .left-quick-nav {
    top: 88%;
    -webkit-transform: translateY(-88%);
    -moz-transform: translateY(-88%);
    -ms-transform: translateY(-88%);
    -o-transform: translateY(-88%);
    transform: translateY(-88%);
  }

  .hr-left-nav {
    top: 8%;
  }
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

/* navigation right side nav design end */
/* header end */
/* role allocation page design */
/* other css - end */
#showempdata {
  padding: 15px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: var(--white);
}


/* your-team - Ends */
/* Modified by jitendra ends */
a.collapse_tab {
  position: relative;
}

a.collapse_tab.active {
  color: var(--white);
  background: var(--primary-200);
}


a.collapse_tab.active .rc-name-lists-items__title {
  color: var(--white);
}

/* Modified by jitendra */
ul.team_list {
  position: relative;
  margin: 0;
  padding: 0;
  /* max-height: 35vh; */
  /* overflow-x: auto; */
  -webkit-border-radius: 11px;
  border-radius: 11px;
  display: flex;
  /* overflow-y: visible; */
  height: 150px;
}
ul.team_list .team_profile-picture {
  background-color: var(--brown);
  color: var(--white);
  height: 35px;
  width: 35px;
  border-radius: 35px !important;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-bottom: 7px;
  font-family: "Lato-bold";
}

ul.team_list .team_profile-picture .teamstatus {
  position: absolute;
  right: -8px;
  top: -3px;
}
ul.team_list .team_profile-picture .teamstatus {
  width: 18px;
  height: 18px;
}

a.collapse_tab.active span.team_name {
  color: var(--white);
}

.collapse_tab.active .status--allocated {
  color: var(--white);
}

ul.team_list li a {
  padding: 12px;
  display: block;
  cursor: pointer;
}

ul.team_list li a span.team_name + .team_name {
  font-size: 14px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.rc-name-lists-items__text.rc-name-lists-items__text-role{
  height: 32px;
  display: inline-block;
  overflow: hidden;
  /* white-space: nowrap; */
  text-overflow: ellipsis;
  width: calc(100%);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-family: "Lato-regular";
}

ul.team_list li a {
  display: block;
  /* border-bottom: 1px solid #c8c8c8; */
  background: var(--white);
  text-decoration: none;
  height: 140px;
}

.showrole > .role_text {
  border: 1px solid #da2932;
  -webkit-border-top-right-radius: 10px;
  border-top-right-radius: 10px;
  -webkit-border-bottom-right-radius: 10px;
  border-bottom-right-radius: 10px;
  -webkit-border-bottom-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

a.roll-eye-wrapp {
  margin: 7px 1px 2px 1px;
  background: #f4f6fc;
  border: 1px solid #c5c5c5;
  width: 118px;
  padding: 10px 1px 10px 0px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background-color: #f4f6fc;
  text-align: center;
}

/* Modified by jitendra */
.myteamlist li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--white);
  background: #da2932;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border-bottom: 1px solid #c5c5c5;
  padding: 5px 10px;
  margin: 0;
}

.myteamlist li + li {
  margin-top: 5px;
}

/* Modified by jitendra ends */
.roll-eye {
  font-family: "Lato";
  font-size: 11px;
  line-height: 1.18;
  color: #da2932;
  text-decoration: none;
  cursor: pointer;
  border: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 6.3px 13.5px 7.2px 12.6px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  margin-right: 5px !important;
  background-color: #f4f6fc;
}

.view--kras {
  font-family: "lato";
  color: rgba(46, 56, 77, 0.76);
  font-size: 14px;
  line-height: 1.21;
  margin-top: 60px;
}

a.roll-eye-wrapp {
  margin-top: 0.8rem;
}

/* modified by jitendra */
.rc {
  font-family: "Lato-regular";
  color: var(--dark-100);
  font-size: 17px;
  line-height: 23px;
  /* font-weight: 400; */
  margin: 0 0 10px 0;
  padding-bottom: 8px;
  border-bottom: 1px dotted var(--dark-400);
}

.rc--name,
.rc--branch,
.rc--since {
  font-family: "Lato-bold";
  /* font-weight: 700; */
}

.add_role .green_color {
  color: var(--white);
  padding: 4px 5.6px 4px 5.5px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-color: var(--primary-200);
  margin-right: 8px;
}

/* modified by jitendra end */
/* modified by jitendra */
.role_container {
  
  white-space: nowrap;
  
  width: 40%;
  padding-right: 15px;
}
.header-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.header-title.add-role-title{
  margin-bottom: 15px;
}
.header-title h2 {
 font: normal normal 900 20px / 24px Lato;
  line-height: 18px;
  font-family: "Lato-bold";
  /* font-weight: 700; */
  margin: 0;
  color: #171717;
}
.role_container .header-title a {
  padding: 0;
}

@media (max-width: 991px) {
  .role_container {
    width: 100%;
  }
}


ul.role_holder .collapse_tab_role {
  width: calc(100% - 10px);
  background: #eff8ef66;
  /* box-shadow: 0px 3px 36px var(--box-shadow-1); */
  float: left;
  position: relative;
  cursor: pointer;
  font-family: "Lato";
  color: var(--dark-100);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.56;
  list-style-type: none;
  padding: 7px 0px 7px 0px;
  margin-left: 0;
  /* margin: 0px 5px; */
  -webkit-border-radius: 6px;
  border-radius: 5px !important;
  /* opacity:0.4; */
}
ul.role_holder .collapse_tab_role *{
  opacity: 0.8;
}
ul.role_holder .collapse_tab_role  .card-title{
  opacity:1;
}

.add_role,
.add_role:hover,
.add_role:active,
.add_role:visited,
.add_role:focus {
  color: var( --primary-200);
  /* font-weight: 700; */
  font-family: "Lato-bold";
  font-size: 16px;
  line-height: 23px;
  text-decoration: none;
 /*padding: 0 16px;*/
  display: inline-block;
      margin-top: 16px;
}

/* modified by jitendra ends */
.margin_label_top_10 {
  font-weight: normal;
}

.rc_team {
  background: var(--white);
  -webkit-border-radius: 11px;
  border-radius: 11px;
  margin-top: 15px;
}

.rc_team .rc_team--title {
  color: #2e384d;
}

.rc_team-errors {
  font-size: 14px;
  height: auto;
  margin-top: 20px;
  display: none;
}

@media (max-width: 767px) {
  .rc_team-errors {
    display: block;
  }
}

div#teamdata > strong {
  padding: 0;
}


.status_count_wrap .status_count {
  float: left;
  border: 1px solid #e6e6e6;
  margin: 0px 18px 6px 1px;
}

.status_count.green {
  border-right: 2px solid #1bc5bd;
  border-top: 0;
  border-left: 0;
  border-bottom: 0;
}

.completed--text,
.incompleted--text,
.not--alloted {
  color: #2e384d;
  padding-top: 5px;
  margin-right: 1rem;
}

.completed {
  background: #9fe1de;
  padding: 5px 10px;
  color: #1bc5bd;
  font-weight: bold;
}

.status_count.red {
  border-right: 2px solid #da2932;
  border-top: 0;
  border-left: 0;
  border-bottom: 0;
}

.incomplete {
  background: #db8f93;
  padding: 5px 10px;
  color: #da2932;
  font-weight: bold;
}

.status_count.grey {
  border-right: 2px solid #3699ff;
  border-top: 0;
  border-left: 0;
  border-bottom: 0;
}

.notalloted {
  background: #a3d0ff;
  padding: 5px 10px;
  color: #3699ff;
  font-weight: bold;
}

/* other css - end */
/* status--view */
.status--notallocated,
.status--allocated {
  font-family: "Lato";
  font-size: 16px;
  font-weight: 800;
  line-height: 1.79;
}

.status--notallocated {
  color: #de2e37;
}

.collapse_tab.active .status--notallocated {
  color: var(--white);
}

.status--allocated {
  color: #119f5a;
}

.status--view {
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    background-color: var(--white);
    border-bottom: 1px dashed #707070;
    padding: 10px 20px;
    margin-bottom: 10px
}
.status--view .team-alocation-summary{
  width:20%;
  padding-bottom:0;
  font-family: "Lato-regular";
  border-bottom: 0 none;
  /* border-right: 1px solid #70707033; */
}
.status--view .team-alocation-summary .total_members{
 text-align: left;
}
.status--view .team-alocation-details{

    border-left: 1px solid #70707033;
    padding-left: 0px;
    margin-bottom: 0;
}
.status--view img {
  height: 15px;
  width: 15px;
}

@media (max-width: 1199px) {
  .is-four .status--view-items {
    width: 47%;
    margin-bottom: 15px;
    margin-right: 15px;
  }
}

@media (max-width: 575px) {
  .is-four .status--view-items {
    width: 43%;
  }
}

.is-five .status--view-items {
  width: 32%;
}

.is-five .status--view-items:nth-last-child(1),
.is-five .status--view-items:nth-last-child(2) {
  width: 49%;
  margin-top: 15px;
}

.teamdetail_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 10px;
}
@media screen and (max-width: 1500px) {
  .teamdetail_wrap .teamlist_tab_wrap{
    width:calc(100% - 823px);
  }
}
.teamdetail_wrap .teamlist_tab_wrap {
  /* width: 60.5%; */
  width:calc((170px * 4) + (13px * 4));
  /* padding: 0 15px; */
  height: 150px;
}

.teamdetail_wrap .teamlist_tab_wrap-right {
  width: 30%;
  /* padding: 0 15px; */
  display: flex;
  justify-content: flex-end;
}
@media screen and (min-width: 1600px){
  .teamdetail_wrap .teamlist_tab_wrap-right{
    width: 27%;
     
  }
}


.status--view-items .status-count {
  font-family: "Lato-bold";
  font-size: 14px;
  /* font-weight: 800; */
  line-height: 17px;
  margin-bottom: 0;
  text-align: left;
  width: 8%;
}

.status--view-items .status-complete {
  color: var(--dark-100);
  font-family: "Lato-regular";
  font-size: 14px;
  /* font-weight: 600; */
  line-height: 16px;
  margin: 0 15px 0 10px;
  text-align: left;
  width: auto;
  width: 44%;
}
.team-alocation-summary .status--view-items .status-complete{
  font-size: 16px;
  line-height: 18px;
}
.status--view .status--view-items {
  width: 100%;
  display: flex;
  
  align-items: center;
  margin-bottom: 10px;
}
.status--view .status--view-items:last-of-type {
  margin-bottom: 0;
}


.adv_search {
  width: 414px;
  height: 41px;
  padding: 11px 130px 13px 12px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background-color: #f4f6fc;
}

/* status--view - end */
.rc-new-role-allocation {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  padding: 0;
  margin: 0;
  list-style: none;
}
.start-end_wrap,
.assignment-duration_wrap {
  width: 100%;
}

.rc-new-role-allocation li {
  width: 16%;
  
}

.rc-new-role-allocation li.assignment-duration:first-of-type {
  width: 125px;
  white-space: nowrap;
  margin-right: 35px;
}
.rc-new-role-allocation li.assignment-duration:last-of-type {
  width: 100px;
  margin-left:19px;
}

@media (max-width: 1199px) {
  .rc-new-role-allocation li.assignment-duration {
    width: 40%;
  }
}


.rc-new-role-allocation__field-item .rc-new-role-allocation__field-title {
  margin: 0;
}

.rc-new-role-allocation__field-item
  .form-control-select.form-control-select--style-1
  optgroup[label=""] {
  font-size: 15px;
}

.rc-new-role-allocation__field-title {
  font-family: "Lato";
  font-size: 16px;
  font-weight: 00;
  line-height: 1.19;
  color: #2e384d;
}

.rc-new-role-allocation__field-text {
  font-family: "Lato-bold";
  font-size: 16px;
  line-height: 1.21;
}
.role-duration .rc-new-role-allocation__field-text {
  font-family: "Lato-bold";
  font-size: 14px;
  line-height: 1.21;
  letter-spacing: 0;
  width: 75px;
}

.rc-select-role .custom-input {
  width: 114px;
  margin-top: 15px;
}

.rc-select-role-lists {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  /* justify-content: space-between; */
  list-style: none;
  padding: 0;
  margin: 0;
}

@media screen and (max-width: 768px) {
  .rc-select-role-lists {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

.rc-select-role-lists li {
  width: 30%;
  margin: 0 0 15px 0;
}


@media (max-width: 991px) {
  .rc-select-role-lists li {
    width: 45%;
  }
}

.rc-select-role-lists li + li {
  margin-left: 2%;
}

.rc-select-role-lists li:nth-child(3n + 1) {
  margin-left: 0;
}

/* footer code */
.rc-role-allocation-footer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0;
  margin: 8px 0 0 0;
  list-style: none;
}

.rc-role-allocation-footer li:nth-child(2) {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.rc-role-allocation-footer
  li:nth-child(2)
  .rc-new-role-allocation__field-title {
  margin-bottom: 0;
  margin-right: 5px;
}

.rc-role-allocation-footer a:not(.hide):first-child {
  margin-left: 0;
  margin-right: 0;
}

.rc-role-allocation-footer a + a,
.rc-role-allocation-footer button + button,
.rc-role-allocation-footer button + a,
.rc-role-allocation-footer a + button {
  margin: 0 0 0 15px;
}
.rc-role-allocation-footer a:last-of-type {
  margin-left: 0;
}


button + button {
  margin: 0 0 0 18px;
}

.rc-role-allocation-footer .hide + a {
  margin-left: 0;
}

.rc-role-allocation-footer li:first-child {
  width: 100%;
  display: flex;
  flex-wrap:wrap;
}

@media (max-width: 767px) {
  .rc-role-allocation-footer li:first-child {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;


    align-items: flex-end;
  }
}


.rc-role-allocation-footer li .status_btn {
  display: inline-block;
  background-color: #ffd31c26 !important;
  color: #ad690b !important;
}

.rc-role-allocation-footer li .status_btn.blue_status {
  background-color: #003456 !important;
  color: #fff !important;
}


.rc-role-allocation-footer li .response_btn:hover,
.rc-role-allocation-footer li .response_btn:focus {
  border: 1px solid var(--primary-200);
  color: var(--primary-200);
  background-color: transparent;
}

/* application status */
.status,
.status_btn {
  font-family: "Lato";
  color: #ffffff !important;
  font-size: 16px;
  line-height: 1.19;
  text-transform: capitalize;
  -webkit-border-radius: 5px !important;
  border-radius: 5px !important;
  padding: 5px 10px;
}

.role-acceptance__accepted .green_status {
  color: #119f5a !important;
}

.status {
  background: #ffd31c26;
  color: var(--dark-100) !important;
  font-size: 16px;
  font-weight: 600;
  opacity: 1;
}

.status_btn {
  margin-left: 0 !important;
}

/* application status ends */
/* left side role box  */
.rc-role-allocation-body {
  padding: 0;
}
.rc-name-lists-items__header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.rc-name-lists-items__title {
  font-family: "Lato-bold";
  font-size: 16px;
  /* font-weight: 700; */
  line-height: 15px;
  color: var(--dark-100);
  display: block;
  margin: 0;
}

.rc-name-lists-items__text {
  font-family: "Lato";
  font-size: 12px;
  /* font-weight: 500; */
  line-height: 15px;
  color: #54586e;
  display: block;
  font-family: "Lato-regular";
}

.collapse_tab.active .rc-name-lists-items__text {
  color: var(--white);
}

.rc-name-lists-items__text-role {
  margin: 0;
}

/* rc-allocated-team-lists__text */
.rc-allocated-team-lists {
  display: none;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
}

.rc-allocated-team-lists li {
  width: 100%;
}

ul.role_holder {
  padding: 0;
  margin: 0;
}

ul.role_holder .collapse_tab_role.active {
  color: var(--white);
  background-color: #da2932;
}

/* rc-allocated-team-lists__text ends */
/* left side role box */
@media (max-width: 991px) {
  .rc-role-allocation-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -moz-box-orient: vertical;
    -moz-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    background: var(--white);
    padding: 15.5px 14.5px;
    margin: 0 0 16px 0;
    -webkit-border-radius: 11px;
    border-radius: 11px;
  }

  .rc-role-allocation-header > div {
    padding: 0;
  }

  .rc-role-allocation-header .your-team {
    margin: 0;
  }

  .rc-role-allocation-header .your_team--blocktc1,
  .rc-role-allocation-header .your_team--blocktc2 {
    width: 48%;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .rc-role-allocation-header .status--view {
    padding: 0;
  }

  ul.team_list li a {
    padding: 10px;
    height:150px;
  }

  .rc-name-lists-items__title {
    font-size: 18px;
    margin: 0 0 5px 0;
  }

  .rc-name-lists-items__text-role {
    display: inline-block;
    margin: 0 7px 0 0;
  }

  .rc_team {
    /* display: none;*/
  }

  .rc-allocated-team-lists {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }

  .rc-allocated-team-lists li {
    width: 100%;
    margin-top: 7px;
    padding: 0 5px;
  }

  .rc-allocated-team-lists__items {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .rc-allocated-team-lists__title {
    font-family: "Lato";
    font-size: 14px;
    color: rgba(46, 56, 77, 0.76);
  }

  .rc-allocated-team-lists__text {
    font-family: "Lato";
    font-size: 16px;
    font-weight: bold;
    color: #2e384d;
  }

  .your_team--title {
    margin: 0 0 10px 0;
  }

  .rc-role-allocation-body {
    padding: 18px 19px 22px 15px;
    -webkit-border-radius: 11px;
    border-radius: 11px;
    /* background-color: var(--white); */
    margin: 0;
  }
  .user_details_modal .modal-body{
    max-height: 40vh;
    overflow-y: auto;
  }
  .rc-role-allocation-body #showempdata {
    padding: 18px 19px 22px 15px;
    -webkit-border-radius: 0;
    border-radius: 0;
    background-color: var(--white);
    height: auto;
  }
}

@media (max-width: 767px) {
  .rc-role-allocation-header {
    padding: 15.5px 14.5px;
    margin: 0 0 16px 0;
  }

  .rc-role-allocation-body {
    padding: 18px 0 22px 0;
  }

  .your-team {
    padding: 15px;
  }

  .your_team--title {
    font-size: 17px;
    line-height: 1;
    margin: 0 0 13px 0;
  }

  .status--view {
    padding: 16px 14px;
    margin: 0 0 18px 0;
  }

  .status--view-items img {
    width: 20px;
    height: 20px;
  }

  .status--view-items .status-count {
    font-size:16px;
  }

  .status--view-items .status-complete {
    font-size: 16px;
    /* margin: 0; */
  }

  .your_team--blocktc1,
  .your_team--blocktc2 {
    padding: 3px 13px 3px 9px;
  }

  .rc-new-role-allocation {
    margin: 0 0 15px 0;
  }

  .your_team--tc-title {
    font-size: 13px;
  }

  .your_team--tc-number {
    font-size: 18px;
  }

  .rc-role-allocation-footer {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -moz-box-orient: vertical;
    -moz-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    margin: 26px 0 0 0;
  }

  .rc-role-allocation-footer li:first-child {
    width: 100%;
    margin-top: 15px;
  }

  .rc-role-allocation-footer a {
    /* width: 48%; */
    text-align: center;
  }

  .rc-role-allocation-footer a {
    margin: 10px 0 0 0;
  }
}

@media (max-width: 575px) {
  .rc {
    font-size: 16px;
    line-height: 1.7rem;
    margin: 0 0 13px 0;
  }

  .status--view-items {
    width: 32%;
  }

  .status--view-items img {
    width: 20px;
    height: 20px;
  }

  .select-container {
    padding: 0 !important;
  }

  .rc-new-role-allocation li {
    width: 49%;
  }

  .rc-new-role-allocation__field-item .rc-new-role-allocation__field-title {
    font-size: 14px;
    margin: 0 0 10px 0;
  }

  /* .rc-new-role-allocation li + li {
            margin-top: 15px;
         } */
  .rc-new-role-allocation li {
    margin-top: 15px;
  }

  .rc-new-role-allocation li:first-child,
  .rc-new-role-allocation li:nth-child(2) {
    margin-top: 0;
  }

  .rc-select-role-lists {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .rc-select-role-lists li {
    width: 100% !important;
  }

  .rc-select-role-lists li + li {
    margin-left: 0;
  }

  .view--kras {
    margin-top: 30px;
  }

  .rc-role-allocation-footer a {
    /* width: 100%; */
    margin: 15px 0 0 0;
  }


  .rc-role-allocation-footer a:nth-child(2n + 1) {
    margin: 10px 0 0 0;
  }

  .collapse_tab_role {
    font-size: 15px !important;
  }
}

@media (max-width: 359px) {
  .status--view-items {
    width: 100%;
  }

  .status--view-items + .status--view-items {
    margin: 10px 0 0 0;
  }
}

.rc-allocated-view-kra .widget-header {
  background-color: transparent;
}

.rc-allocated-view-kra .widget-header > h3 {
  color: #2e384d;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.19;
  padding: 0;
  margin: 0 0 10px 0;
}

.rc-allocated-view-kra .scroll-table {
  border: none;
  width: 100%;
}

.scroll-table .container {
  padding-left: 0;
  padding-right: 0;
}

.recent-comment {
  margin: 19px 0 0 0;
}

.recent-comment_head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0;
}

.recent-comment__title,
.recent-comment__viewComment {
  color: #2e384d;
  font-weight: 500;
  line-height: 1.19;
  text-align: left;
  margin: 0;
}

.recent-comment__title {
  font-size: 16px;
  line-height: 19px;
  color: var(--primary-200);
  padding-left: 12px;
  font-family: "Lato-semibold";
}

.recent-comment__viewComment {
  font-size: 14px;
}

.recent-comment .textarea_wrap_role {
  border: none;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background-color: #f4f6fc26;
  padding: 6px 0 0 0;
}

.recent-comment .textarea_wrap_role.comment_holder {
  max-height: none;
  overflow-x: hidden;
  overflow-y: unset;
}

.recent-comment .textarea_wrap_role.comment_holder .comment_info {
  width: 50%;
}

.recent-comment .textarea_wrap_role.comment_holder .comment_info .comment_name,
.recent-comment .textarea_wrap_role.comment_holder .comment_info .date {
  font-size: 14px;
}

.recent-comment .textarea_wrap_role.comment_holder .reposting_comment {
  border-bottom: 0 none;
  margin-bottom: 15px;
}

.recent-comment__viewComment {
  margin: 0;
}

.recent-comment__viewComment a {
  text-decoration: underline;
  font-size: 16px;
}

.comment_holder_repo .comment-heading {
  font-weight: 700;
  margin-right: 5px;
}

.comment_holder_repo > div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 5px;
}

.comment_holder_repo > div:last-of-type {
  margin-bottom: 0;
}

.comment_holder_repo span {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}

.comment_holder_repo p {
  margin-bottom: 0;
  font-size: 16px;
  /*font-weight: 700;*/
}

.rc-comment-modal .comment_holder {
  overflow-y: auto !important;
}

.rc-comment-modal .comment_holder .reposting_comment {
  margin: 0;
  padding: 0;
  border: none;
}

.rc-comment-modal .comment_holder .comment_info {
  margin: 10px 15px 0 15px;
  width: 100%;
}

.rc-comment-modal .comment_holder .comment_info h4 {
  font-size: 14px;
  margin: 0;
}

.rc-comment-modal .textarea_wrap_role {
  border: none;
  padding: 0;
  margin: 15px 0 0 0;
}

.rc-comment-modal .textarea_wrap_role .new_comment {
  margin: 0;
}

.rc-comment-modal .btn-primary {
  margin: 0 15px 0 0;
}

/* role allocation page design ends */
/* Role acceptance page design */
.role-acceptance .white-bg-radius {
  padding: 20px;
}

.role-acceptance-accordion-2.accordion-style-2
  > .panel-default
  > .panel-heading
  > .panel-title
  a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  padding: 8px 0px;
  border: 0.3px solid #f5f5f5;
}

.role-acceptance-accordion-2.accordion-style-2
  > .panel-default
  > .panel-heading
  > .panel-title
  a:focus,
.role-acceptance-accordion-2.accordion-style-2
  > .panel-default
  > .panel-heading
  > .panel-title
  a:hover {
  -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
.panel-default span{
  font-family: "Lato-regular";
}
.role-acceptance__comment .tri:before {
  display: none;
}

.role-acceptance__inner-row .row > div:first-child {
  padding-right: 15px;
}

.role-main1,
.role-main2,
.role-main3,
.role-main4 {
  text-align: center;
}

@media (max-width: 767px) {
  .role-acceptance-accordion-2.accordion-style-2
    > .panel-default
    > .panel-heading
    > .panel-title
    a {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    color: var(--dark-100);
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
    background-color: #f5f5f5;
    text-align: left;
  }

  .role-acceptance-accordion-2.accordion-style-2
    > .panel-default
    > .panel-heading
    > .panel-title
    a
    div
    + div {
    margin-top: 0px;
  }

  .role-acceptance .white-bg-radius {
    padding: 0;
    background-color: transparent;
  }

  .role-acceptance .white-bg-radius > .block-title {
    display: none;
  }

  .role-acceptance .panel-group .panel,
  .role-acceptance .panel-group .panel .panel-heading,
  .role-acceptance .accordion-style .panel-body {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0;
  }

  .role-acceptance .accordion-style-1 .panel-title a {
    font-size: 14px;
    padding: 11px 13px 10.4px 28px;
  }

  .role-acceptance
    .accordion-style-2
    > .panel-default
    > .panel-collapse
    > .panel-body {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0;
    margin: 20px 0 0 0;
  }

  .role-acceptance__inner-row .row > div:first-child {
    padding-right: 0;
  }

  .role-acceptance-accordion-2.accordion-style-2
    a.accordion-style-2-btn
    .accordion-style-arrow {
    margin-top: 0;
    top: auto;
    bottom: 10px;
    -webkit-transform: translateY(0) rotate(0deg);
    -moz-transform: translateY(0) rotate(0deg);
    -ms-transform: translateY(0) rotate(0deg);
    -o-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    /*    background-color: var(--primary-200);*/
    margin-top: 0 !important;
  }

  .role-acceptance-accordion-2.accordion-style-2
    a.accordion-style-2-btn.collapsed
    .accordion-style-arrow {
    -webkit-transform: translateY(0) rotate(270deg);
    -moz-transform: translateY(0) rotate(270deg);
    -ms-transform: translateY(0) rotate(270deg);
    -o-transform: translateY(0) rotate(270deg);
    transform: translateY(0) rotate(270deg);
  }

  .role_kras {
    margin-top: 16px;
  }

  .role-acceptance .accordion-style-2 .panel-title a div {
    display: inline-block;
    text-align: left;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
  }

  .role-main1,
  .role-main2,
  .role-main3,
  .role-main4 {
    width: 18%;
    text-align: left;
    padding-right: 5px;
    border-right: 1px solid var(--dark-100);
    margin-right: 15px;
  }

  .role-acceptance .accordion-style-3 .panel-title a {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .accordion-style.accordion-style-3 .accordion-style-arrow {
    color: #da2932;
    background-color: transparent;
    padding: 0;
  }

  .role-acceptance .accordion-style-3 {
    background-color: var(--white);
  }

  .accordion-style-1 .panel-title a.accordion-style-1-btn {
    font-family: "Lato-bold";
    color: #2e384d;
    font-size: 13px;
    padding: 14px 12px;
    -webkit-border-radius: 4px;
    border-radius: 4px;

  }

  .accordion-style-1
    .panel-title
    a.accordion-style-1-btn
    .accordion-style-arrow {
    top: 0;
    right: 0;
    width: 45px;
    height: 45px;
    padding: 20px 17.2px 20px 17px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
}

.d-none {
  display: none;
}

.role-acceptance__arrowdown {
  float: right;
  text-align: center;
  width: 30px;
  background: #da2932;
  padding: 5px 15px 5px 8px;
  margin-top: -5px;
}

.role-acceptance__inneraccodion {
  margin: 0 0px;
  background: #da2932;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  color: var(--white);
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  padding: 10px 0;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.role-acceptance__inneraccrd {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: center;
  font-size: 15px;
}

.role-acceptance__inneraccrd.tab_head_accordian p {
  font-size: 18px;
  margin: 0;
}

.role-acceptance__roles {
  color: #5d5c5c;
  font-size: 14px;
  font-family: "Lato-bold";
  /* font-weight: 600; */
  margin-top: 5px;
}

.role-acceptance__accepted {
  color: #41dd0e;
}

.role-acceptance__pending .yellow_status {
  color: #f3cb31 !important;
}

.role-acceptance__subaccrd {
  width: 100%;
  margin: 0;
}

.role-acceptance__submainaccrd {
  padding: 15px 14px 23px 19px;
  background: var(--white);
}

.role-acceptance__innericon {
  text-align: center;
  background: var(--primary-200);
  width: 60px;
  padding: 3px 0px 3px 0px;
  margin-right: 1rem;
}

.role-acceptance__inner-row .row {
  margin: 0;
}

.role-acceptance__inner-row .row > div {
  padding: 0;
}

.role-acceptance__innerleftblock {
  padding: 13px 50.6px 14px 18.2px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background-color: transparent;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  color: var(--dark-100);
}

.role-acceptance__innerleftblock .additional_role b {
  margin-bottom: 6px;
}

.role-acceptance__innerleftblock .additional_role {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  border-bottom: 1px solid #eee;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.role-acceptance__innerleftblock .additional_role span {
  font-size: 12px;
  color: #d7def1;
  padding-bottom: 10px !important;
}

.additional_role:last-child {
  border-bottom: 0;
  margin-bottom: 0;
}

.additional_role span:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.role-agree {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.role-agree__question {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 1rem;
}

.role-agree__btns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 0.7rem;
}

@media (max-width: 767px) {
  .role-agree__btns {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

@media (max-width: 767px) {
  .role-agree__btns .btn {
    margin-bottom: 15px;
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  .role-agree__btns .btn:last-of-type {
    margin-bottom: 0;
  }
}

.role-agree__btnyes {
  padding: 6px 15px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background-color: var(--primary-200);
  color: var(--white);
  font-size: 14px;
  min-width: 115px !important;
  font-family: "Lato-bold";
}

.role-agree__btnyes:hover,
.role-agree__btnyes:focus {
  background-color: transparent;
  color: var(--primary-200);
  border: 1px solid var(--primary-200);
}

.role-agree__btndiscuss {
  padding: 6px 15px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background-color: #F7A029;
  color: var(--white);
  margin-left: 18px;
  border: 1px solid #F7A029;
  font-size: 14px;
  min-width: 115px !important;
  font-family: "Lato-bold";
}

.role-agree__btndiscuss:hover,
.role-agree__btndiscuss:focus {
  background-color: transparent;
  color: #F7A029;
  border: 1px solid #F7A029;
}

.kra-arrow {
  float: right;
  color: #da2932;
}

.kra-panelhead {
  padding: 5px 10px 5px 10px !important;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  background-color: #ffffff !important;
  border-bottom: 0;
}

.kra-table {
  border-collapse: separate;
  border-spacing: 0 1em !important;
  width: 100%;
}

.thead--dark th {
  background-color: var(--primary-200);
  color: var(--white);
  border: none !important;
}

.kra-tbodytr tr {
  padding: 9px 64.9px 9.6px 32.8px;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  background-color: var(--white);
}

.kra-tbodytr tr td {
  border-top: 0 !important;
  border: 0 !important;
  padding: 10px;
}

@media (max-width: 767px) {
  .role-acceptance__inneraccrd {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    font-size: 14px;
  }

  .role-acceptance__roles {
    color: var(--dark-100);
    font-size: 14px;
    font-weight: 600;
    text-align: left;
    padding-left: 5px;
    border-left: 0px solid var(--white);
    margin-left: 0px;
    word-break: break-word;
    text-transform: capitalize;
  }

  .role-acceptance__innerleftblock {
    color: #2e384d;
    background-color: var(--white);
    padding: 13px 18.6px 25.5px 18.2px;
  }

  .role-acceptance__innerleftblock .additional_role {
    border-bottom: 1px solid #999dab;
    font-size: 14px;
  }

  .role-agree__question {
    width: -webkit-calc(100% + 30px);
    width: -moz-calc(100% + 30px);
    width: calc(100% + 30px);
    margin: 0;
    padding: 15px;
    background-color: var(--white);
    -webkit-box-shadow: 0 -2px 9px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 -2px 9px 0 rgba(0, 0, 0, 0.1);
  }

  .role-acceptance__roles .status_btn {
    font-size: 14px;
    color: #f3cb31 !important;
    padding: 0 0px 0px 0px !important;
  }
}

/* Role acceptance page design ends */
.rc-admin-head__right {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.rc-admin-role-status {
  width: 68%;
  list-style: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: var(--white);
  padding: 15px 27.5px 16px 23px;
  margin: 0;
}

@media (max-width: 991px) {
  .rc-admin-role-status {
    width: 100%;
    padding: 15px 0;
  }
}

.rc-admin-role-status__items {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.rc-admin-role-status li + li {
  margin-left: 5%;
}

.rc-admin-role-status li {
  width: 30%;
}

@media (max-width: 575px) {
  .rc-admin-role-status li {
    width: 48%;
  }
  .collapse_tab_role .rc-role-allocation-footer a {
    margin-bottom: 5px;
  }
}

.rc-admin-role-status li:nth-child(3n + 1) {
  margin-left: 0;
}

@media (max-width: 575px) {
  .rc-admin-role-status li:nth-child(3n + 1) {
    margin: 15px 0 0 4%;
  }
}

@media (max-width: 575px) {
  .rc-admin-role-status li:nth-child(2) {
    margin: 0 0 0 4%;
  }
}

@media (max-width: 575px) {
  .rc-admin-role-status li:nth-child(2n + 1) {
    margin: 15px 0 0 0;
  }
}

@media (max-width: 575px) {
  .rc-admin-role-status li:first-child {
    margin: 0;
  }
}

.rc-admin-role-status__text {
  width: 70%;
  color: #2e384d;
  font-size: 18px;
  font-weight: normal;
  display: inline-block;
}

@media (max-width: 1199px) {
  .rc-admin-role-status__text {
    font-size: 15px;
  }
}

.rc-admin-role-status_number {
  font-size: 16px;
  font-weight: 600;
  padding: 3px 10px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  display: inline-block;
  position: relative;
}

.rc-admin-role-status_number:after {
  content: "";
  position: absolute;
  right: -9px;
  top: 0;
  width: 4px;
  height: 100%;
  border-right: 4px solid;
}

.rc-admin-role-status__text-green {
  color: #1bc5bd;
  background-color: rgba(27, 197, 189, 0.14);
}

.rc-admin-role-status__text-yellow {
  color: #ffdd00;
  background-color: rgba(255, 221, 0, 0.14);
}

.rc-admin-role-status__text-red {
  color: #da2932;
  background-color: rgba(218, 41, 50, 0.14);
}

.rc-admin-team-composition {
  width: 29%;
  padding: 17px 30px 19px 16px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: var(--white);
}

@media (max-width: 991px) {
  .rc-admin-team-composition {
    width: 100%;
    padding: 17px 0px 19px 0;
  }
}

.rc-admin-team-composition__title {
  color: #2e384d;
  font-size: 24px;
  font-weight: bold;
  margin: 0 0 6px 0;
}

@media (max-width: 1199px) {
  .rc-admin-team-composition__title {
    font-size: 18px;
  }
}

.rc-admin-team-composition-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.rc-admin-team-composition-box__title {
  color: var(--primary-200);
  font-size: 14px;
  font-weight: normal;
  display: inline-block;
}

.rc-admin-team-composition-box__number {
  color: var(--primary-200);
  font-size: 20px;
  font-weight: bold;
  display: inline-block;
}

@media (max-width: 1199px) {
  .rc-admin-team-composition-box__number {
    font-size: 16px;
  }
}

.rc-admin-team-composition-box + .rc-admin-team-composition-box {
  margin: 9px ​0 0 0;
}

.rc-admin-allocation__main-title {
  font-size: 24px;
  font-weight: bold;
  color: #2e384d;
  margin: 0 0 22px 0;
}

.rc-admin-allocation-head {
  margin: 0;
}

.rc-admin-alloted-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.rc-admin-alloted-btn .btn-secondary {
  -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

.rc-admin-role-edit {
  top: 13px;
  right: 13px;
}

.rc-admin-role-edit a {
  display: inline-block;
  font-size: 14px;
  margin-left: 15px;
}

.rc-admin-role-edit a [class^="icon-"]:before,
.rc-admin-role-edit a [class*=" icon-"]:before {
  font-family: "icomoon" !important;
}

@media (max-width: 575px) {
  .rc-admin-role-edit a {
    width: 100%;
    text-align: center;
  }
}

@media (max-width: 575px) {
  .rc-admin-role-edit {
    position: static;
    width: 100%;
    margin: 15px 0 0 0;
  }
}

.rc-admin-role-edit-delete .btn-secondary-radius,
.rc-admin-role-edit-delete .btn-primary-radius {
  padding: 10px 20px !important;
}

@media (max-width: 767px) {
  .rc-admin-role-edit-delete .btn-secondary-radius,
  .rc-admin-role-edit-delete .btn-primary-radius {
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  .rc-admin-role-edit-delete .delete_next {
    padding: 10px !important;
  }
}

@media (max-width: 767px) {
  .rc-admin-role-edit-delete .delete_next {
    margin: 10px 0 0 0;
  }
}

.rc-admin-role-form {
  position: relative;
}

.rc-admin-role-field {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.rc-admin-role-field .rc-select-role {
  width: 45%;
  padding: 0 0 15px 0;
}

@media (max-width: 575px) {
  .rc-admin-role-field .rc-select-role {
    width: 100%;
    padding: 0;
    margin: 9px 0 0 0;
  }
}

.rc-admin-role-field-lists {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  list-style: none;
  padding: 0;
  margin: 0;
}

.rc-admin-role-field-lists li {
  margin-right: 15px;
}

@media (max-width: 575px) {
  .rc-admin-role-field-lists {
    width: 100%;
    margin: 0;
  }
}

.rc-admin-role-field-lists li {
  width: 45%;
  margin-right: 20px !important;
}

@media (max-width: 575px) {
  .rc-admin-role-field-lists li {
    width: 100%;
  }
}

.rc-admin-role-field-lists li:nth-child(2n + 1),
.rc-admin-role-field-lists li:nth-child(2n + 2) {
  margin: 9px 0 0 0;
}

.rc-admin-role-field-lists li:first-child,
.rc-admin-role-field-lists li:nth-child(2) {
  margin: 0;
}

@media (max-width: 575px) {
  .rc-admin-role-field-lists li:nth-child(2n + 2) {
    margin: 9px 0 0 0 !important;
  }
}

.rc-admin-role-field-lists--three {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin: 0 0 21px 0;
}

.rc-admin-role-field-lists--three li {
  width: 30%;
}

@media (max-width: 767px) {
  .rc-admin-role-field-lists--three li {
    width: 49%;
  }
}

@media (max-width: 575px) {
  .rc-admin-role-field-lists--three li {
    width: 100%;
  }
}

.rc-admin-role-field-lists--three li .rc-new-role-allocation__field-text {
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: solid 0.5px #b0bac9;
  background-color: #f4f6fc;
  padding: 12px 11px 33px 11px;
  margin: 10px 0 0 0;
}

.rc-admin-department-select {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 15px 0;
}

.rc-admin-department-select .form-control--select-style-1 .select2-container {
  width: 239px !important;
}

@media (max-width: 767px) {
  .rc-admin-department-select .form-control--select-style-1 .select2-container {
    width: 100% !important;
  }
}

@media (max-width: 575px) {
  .rc-admin-department-select .form-control--select-style-1 {
    width: 100%;
  }
}

.rc-admin-department-select
  .form-control--select-style-1
  + .form-control--select-style-1 {
  margin: 0 0 0 23px;
}

@media (max-width: 575px) {
  .rc-admin-department-select
    .form-control--select-style-1
    + .form-control--select-style-1 {
    margin: 15px 0 0 0;
  }
}

.rc-admin-accordion.panel-group-style-2 {
  margin: 22px 0 0 0;
  padding: 10px 12px 14px 12px;
}

.rc-admin-accordion.panel-group-style-2 .table-primary-1 thead tr th,
.rc-admin-accordion.panel-group-style-2 .table-primary-1 tbody tr td {
  font-size: 14px;
  padding: 4px 10px;
  vertical-align: middle;
}

.rc-admin-accordion .panel-title a.collapsed {
  padding: 0;
}

.rc-admin-accordion .panel-title a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0 0 15px 0;
}

@media (max-width: 575px) {
  .rc-admin-accordion .panel-title a {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

@media (max-width: 575px) {
  .rc-admin-accordion .panel-title a .accordion-title {
    width: 100%;
  }
}

.rc-admin-accordion__number {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  list-style: none;
}

@media (max-width: 575px) {
  .rc-admin-accordion__number {
    width: 100%;
    margin: 10px 0 0 39px;
  }
}

.rc-admin-accordion__number-items-title {
  font-size: 14px;
  font-weight: bold;
  color: #999dab;
  display: block;
}

.rc-admin-accordion__number-items-number {
  font-size: 18px;
  font-weight: 600;
  color: #2e384d;
  display: block;
}

.rc-admin-accordion__number li + li {
  padding: 0 0 0 33px;
}

@media (max-width: 575px) {
  .rc-admin-accordion__number li + li {
    padding: 0 0 0 20px;
  }
}

.rc-admin-accordion .search_list {
  min-height: 254px;
  max-height: 254px;
  padding: 0 9px;
}

.rc-admin-search-list {
  overflow-x: auto !important;
  margin: 15px 0 0 0 !important;
}

.rc-admin-search-list li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: none !important;
  -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
  background-color: var(--white);
  padding: 10.3px 16.1px 12.5px 11.6px;
  margin: 0 !important;
}

.rc-admin-search-list li + li {
  margin: 10px 0 0 0 !important;
}

.rc-admin-search-list .search_text {
  width: 121px !important;
  float: none !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

@media (max-width: 1199px) {
  .rc-admin-search-list .search_text {
    font-size: 11px !important;
    width: 100px !important;
  }
}

.rc-admin-search-list .kratypeCircle {
  color: #999dab;
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  margin: 0;
  padding: 8px 5px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  background-color: #f4f6fc;
}

.rc-admin-search-list .green_border {
  position: static;
  float: none;
  font-size: 12px !important;
  font-weight: normal;
  color: #0a579d !important;
  margin: 0 0 0 10px;
  padding: 4px 0 4px 0 !important;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 0 none;
  border-bottom: solid 0.5px #0a579d !important;
  background-color: #ffffff !important;
}

@media (max-width: 1199px) {
  .rc-admin-search-list .green_border {
    margin: 0 0 0 10px !important;
  }
}

.rc-admin-search-list .green_border:hover,
.rc-admin-search-list .green_border:focus {
  color: var(--white);
  background-color: var(--primary-200);
}

.rc-admin-actual-marks {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.rc-admin-actual-marks .minus,
.rc-admin-actual-marks .plus {
  width: 20% !important;
  font-size: 18px !important;
  font-weight: bold;
  text-align: center !important;
  border: none !important;
  padding: 0;
}

.rc-admin-actual-marks .number {
  width: 33%;
  color: #2e384d;
  text-align: center;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border: solid 0.5px #b0bac9;
  background-color: #f4f6fc;
}

.rc-admin-non-measurable {
  position: relative;
}

.rc-admin-non-measurable .close_btn {
  position: absolute;
  top: 44%;
  right: 15px;
  -webkit-transform: translateY(-44%);
  -moz-transform: translateY(-44%);
  -ms-transform: translateY(-44%);
  -o-transform: translateY(-44%);
  transform: translateY(-44%);
}

.rc-role-allocation-footer--with-status {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

@media (max-width: 767px) {
  .rc-role-allocation-footer--with-status {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}
@media (min-width: 767px) {
  .header-sec-btn{
    width: 100%;
  }
}

.rc-role-allocation-footer--with-status li:first-child {
  width: 79%;
}

@media (max-width: 767px) {
  .rc-role-allocation-footer--with-status li:first-child {
    width: 100%;
  }
}

.rc-role-allocation-footer--with-status li:last-child {
  width: 17%;
  margin: 0;
}

@media (max-width: 767px) {
  .rc-role-allocation-footer--with-status li:last-child {
    width: 100%;
    margin: 15px 0 0 0;
  }
}

.rc-role-allocation-footer--with-status li .recent-comment {
  width: 100%;
  margin: 0;
}

.rc-role-allocation-footer--with-status li .recent-comment .textarea_wrap_role {
  padding: 10px 16px 29px 16px;
}

@media (max-width: 767px) {
  .rc-super-admin-btn-header li:first-child {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .rc-super-admin-btn-header li:nth-child(2),
  .rc-super-admin-btn-header li:nth-child(3) {
    width: 49%;
    margin-top: 10px;
  }
}

@media (max-width: 575px) {
  .rc-super-admin-btn-header li:nth-child(2),
  .rc-super-admin-btn-header li:nth-child(3) {
    width: 100%;
    margin-top: 10px;
  }
}

@media (max-width: 767px) {
  .rc-super-admin-btn-header li:nth-child(2) {
    margin-left: 0;
  }
}

.rc-super-admin-btn-header li .btn-primary-radius {
  font-size: 14px;
}

@media (max-width: 991px) {
  .rc-super-admin-btn-header li .btn-primary-radius {
    font-size: 12px;
    padding: 10px;
  }
}

@media (max-width: 767px) {
  .rc-super-admin-btn-header li .btn-primary-radius {
    width: 100%;
    text-align: center;
  }
}

.rc-super-admin-btn-header li + li {
  margin: 0 0 0 10px;
}

@media (max-width: 575px) {
  .rc-super-admin-btn-header li + li {
    margin: 10px 0 0 0;
  }
}

.rc-super-admin-btn-header .custom-file-upload {
  width: 324px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

@media (max-width: 767px) {
  .rc-super-admin-btn-header .custom-file-upload {
    width: 100%;
  }
}

.rc-super-admin-btn-header .custom-file-upload > form {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 5px 6px 4px 12px;
  background-color: #f4f6fc;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border: solid 0.5px #b0bac9;
}

.rc-super-admin-btn-header .custom-file-upload > form > .upload_file_btn {
  padding: 0;
  border: 0;
  background-color: transparent;
  height: auto;
  font-size: 15px;
  font-weight: normal;
  color: #2e384d;
}

.rc-super-admin-btn-header .custom-file-upload .file-upload-wrapper {
  float: none;
  margin: 0;
  width: auto;
}

.rc-super-admin-btn-header
  .custom-file-upload
  .file-upload-wrapper
  .file-upload-button {
  font-size: 11px;
  font-weight: normal;
  color: var(--white);
  text-transform: capitalize;
  padding: 9px 20px 10px 21px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background-color: #a0a1a3;
}

.rc-super-admin-btn-header .custom-file-upload .upload_error > div {
  font-size: 14px;
  margin: 0;
  padding: 0;
  border: none;
  -webkit-border-radius: 0;
  border-radius: 0;
}

@media (max-width: 767px) {
  .recent-comment .textarea_wrap_role {
    height: 86px;
    overflow-y: scroll;
  }

  .tri_recd {
    font-size: 14px;
  }
}

@media (max-width: 768px) {
  .status_comment {
    margin-bottom: 4px;
  }
}

#userstatusModal .modal-body {
  height: 500px;
  overflow-y: auto;
}

/*#commentModal .modal-body{
  height: 500px;
  overflow-y: auto;
}*/
@media (max-width: 767px) {
  .rc-role-allocation-footer li .btn-primary[disabled] {
    width: 100%;
  }

  .rc-role-allocation-footer li a {
    font-size: 14px;
    line-height: 18px;
  }

  #userstatusModal .modal-body {
    height: 400px;
    overflow-y: auto;
  }

  /*#commentModal .modal-body{
  height: 400px;
  overflow-y: auto;
}*/
  .rc-admin-alloted-btn button {
    display: block;
    margin-bottom: 10px;
    width: 100%;
    text-align: center;
  }

  .rc-admin-alloted-btn {
    display: block !important;
  }

  .rc-exception-modal li {
    margin-top: 10px;
  }
}

@media (max-width: 767px) {
  .rc-comment-modal .btn-primary[disabled] {
    width: auto !important;
  }

  .btn-gray {
    font-size: 14px;
  }

  .tri,
  .tri_recd {
    font-size: 14px;
  }

  .modal_dynamic .new_comment {
    font-size: 14px;
  }
}

@media (max-width: 768px) {
  .input[type="radio"] {
    display: inline-block;
  }

  label {
    display: inline;
  }
}

@media screen and (max-width: 343px) {
  .rc-role-allocation-footer li .response_btn {
    width: 110px;
  }
}

.tri,
.tri_recd {
  font-size: 14px;
  line-height: 16px;
}

@media (max-width: 345px) {
  .recent-comment__viewComment {
    position: relative;
    top: 100px;
    right: 4px;
    margin-bottom: -15px;
  }

  .score-total {
    margin-top: 20px;
  }

  .total-disc-score {
    margin-top: 30px !important;
  }

  .total-score {
    margin-top: 30px;
  }
}

/*rc exception modal changes */
.rc-exception-modal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  list-style: none;
  padding: 0px;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.raise_exception_department,
.raise_exception_category_role_1,
.raise_exception_category_role_2 {
  background: #f4f6fc;
  border: 1px solid #bbb;
  padding: 12px;
  width: 247px;
}

.raise_exception_department option,
.raise_exception_category_role_1 option,
.raise_exception_category_role_2 option {
  background: var(--white);
  color: #111;
}

#raise_exception_modal .modal-dialog {
  width: 600px;
}

@media screen and (max-width: 768px) {
  #raise_exception_modal .modal-dialog {
    width: auto;
  }

  .select2-container .select2-selection--single {
    height: 42px !important;
    width: 100% !important;
    /* padding: 7px !important; */
  }
}

@media screen and (max-width: 325px) {
  .select2-container .select2-selection--single {
    width: auto !important;
  }
}

@media screen and (max-width: 767px) {
  .rc-admin-accordion .panel-group-style-2 {
    padding: 10px 0px 14px 0px;
  }

  .rc-exception-main table {
    display: block;
    overflow-y: auto;
  }
  .rc-exception-main table.flagged-kras-table,
  .rc-exception-main table.deleted-kras-table  {
    display: block;
    overflow-y: auto;
    min-width: 500px;
  }
  .flagged-kras-table thead tr th:nth-child(3),
  .deleted-kras-table thead tr th:nth-child(3){
    width:20%;
  }


  .rc-admin-role-field-lists li {
    width: 49%;
  }

  .rc-admin-role-field-lists li:nth-child(1) {
    margin-top: 10px;
  }

  .role-acceptance__comment .textarea_wrap_role {
    height: 65px;
    overflow-y: scroll;
  }

  .role-acceptance__inneraccrd span {
    /*  width: 120px;
          border-left: 1px solid var(--white);*/
    display: contents;
  }

  .panel-group-style-1 .panel-title a span {
    padding: 0px 5px;
  }

  .role-acceptance__inneraccrd p {
    display: inline-block;
    margin-bottom: 5px;
    width: 87px;
    text-align: left;
    border-right: 1px solid var(--white);
  }

  .category-div {
    text-align: left;
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -moz-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .categort-span {
    padding-left: 5px;
  }

  .category-div .role-acceptance__inneraccrd {
    display: contents !important;
  }
}

#raise_exception {
  margin-right: 20px;
}

.rc-exception-modal li {
  font-size: 16px;
  width: 45%;
}

.role-kra {
  display: inline-block;
  word-break: break-word;
}

.role-kra tbody tr td:nth-child(2) {
  width: 60% !important;
}

.role-kra thead tr th:nth-child(1),
.table-primary-2 tbody tr td:nth-child(1) {
  /*    width: 6%;*/
}

@media screen and (max-width: 767px) {
  .role-kra tbody tr td:nth-child(2) {
    width: 50% !important;
  }
}

@media screen and (min-width: 375px) {
  .score-tr {
    width: 17%;
  }

}

@media screen and (max-width: 345px) {
  .score-tr {
    width: 29%;
  }
    .modal .btn+.btn{
    margin-left: 0;
  }
  .rc-exception-main table{
    overflow-x: hidden;
  }
  .rc-exception-main .add-new-kra-table .rc-details.kra_added-row-highlight{
    margin-right: 15px;
  }
}

.rc-admin-user-main__title {
  color: #2e384d;
  font-family: "Lato";
  font-size: 24px;
  font-weight: 500;
  margin: 0 0 28px 0;
}

.rc-upload-excel {
  padding: 35px;
}

.rc-admin-user__breadcrum {
  margin-bottom: 19px;
}

@media screen and (max-width: 767px) {
  .rc-upload-excel {
    padding: 10px;
  }

  .resetbtn button {
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: solid 1px #da2932;
    color: #da2932;
    padding: 10px 15.5px;
    background: none;
    width: 100%;
    margin-bottom: 10px;
  }

  .parameter_table {
    overflow-x: scroll;
    display: inline-block;
  }
}

.file-upload-input {
  -webkit-border-radius: 8px 0px 0px 6px;
  border-radius: 8px 0px 0px 6px;
  margin-right: -4px;
  margin-left: 10px;
}

.upload-file-btn {
  padding: 8px 15px;
  display: inline-block;
  background: #a0a1a3;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border-color: transparent;
  color: var(--white);
}

.file-upload-wrapper {
  width: auto;
  float: right;
  display: inline;
}
/* 
@media screen and (max-width: 767px) {
  .landingpage {
    display: block;
  }

  .landingpage-box {
    width: auto;
  }
} */

.select2-container .select2-selection--single {
  height: 38px !important;
  margin-left: 0;
  border-radius: 4px !important;
  /* box-shadow: 0 1px 4px 0 #deecff !important; */
  border: solid 1px #a5c9fc !important;
  background-color: #fff !important;
  padding: 5px 10px 5px 10px !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  margin-top: 3px;
  line-height: 22px !important;
}

@media (max-width: 767px) {
  .select2-container .select2-selection--single .select2-selection__rendered {
    margin-top: 0;
  }
}

.select2-selection__arrow b {
  /* border-color: var(--dark-100); */
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent #888 transparent !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #888 transparent transparent transparent !important;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  font-size: 13px;
  font-family: "Lato-regular";
  text-align: left;
  /* font-weight: 600; */
}

.select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

.role_kras {
  margin-top: 15px;
  -webkit-box-shadow: 0px 3px 16px var(--box-shadow-1);
  box-shadow: 0px 3px 16px var(--box-shadow-1);
  padding: 5px 25px;
  margin-left: 5px;
  /* height: calc(100vh - 355px); */
}

.role_kras .accordion-style .panel-collapse {
  padding: 10px 25px;
}

.role_kras .kra-table-wrap {
  padding: 10px 25px;
}

.kra-desc-table thead .recent-comment__viewComment a {
  color: var(--white);
}


.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
  border: 0 none;
  background-color: transparent;
  color: var( --primary-200);
  margin-right: 5px;
  padding: 0 10px;
}

.ui-widget.ui-widget-content {
  -webkit-box-shadow: 0px 3px 16px var(--box-shadow-1);
  box-shadow: 0px 3px 16px var(--box-shadow-1);
  -webkit-border-radius: 4px !important;
  border-radius: 4px !important;
  border: 0 none;
}

.ui-widget-header {
  border: 0 none;
  border-bottom: 1px dashed #cdcdcd;
  background: transparent;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
  border: 1px solid #fbf6f6;
  /* background: #f6f6f6; */
  font-weight: normal;
  color: #454545;
  /* border-radius: 2px !important; */
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  /* border: 1px solid #dad55e; */
  background: var( --primary-200);
  color: #fff !important;
}
.ui-state-active, .ui-widget-content .ui-state-active{
  background: var(--primary-200);
  color: var(--white);
}

.full-container {
  width: auto;
  max-width: 100%;
  margin: 0 calc(30px - 15px) 0px calc(85px + calc(33px - 15px));
}

* {
  -webkit-border-radius: 0px !important;
  border-radius: 0px !important;
}

.skin-blue .wrapper,
.skin-blue .main-sidebar,
.skin-blue .left-side {
  /* background-color: var(--white); */
  height: 100% !important;
  background: #F8F8F8 0% 0% no-repeat padding-box;
}

ul.role_holder .collapse_tab_role {
  margin-bottom: 10px;
  padding: 24px 10px 24px 24px;
}
ul.role_holder .collapse_tab_role.active {
  width:100%;
  background: transparent;
  box-shadow: 0px 3px 15px var(--box-shadow-1);
  position: relative;
  padding:21px 10px 15px 26px;
  color: var(--black);
  border-radius: 5px !important;
}
ul.role_holder .collapse_tab_role.active *{
  opacity:1;

}



.showrole > .role_text {
  border-color: transparent;
  border-width: 0;
  margin: 20px 0 0;
  display: flex;
}

h2.your_team--title {
  color: #0c52b1;
}

div#showempdata {
  -webkit-box-shadow: 0px 3px 66px #0c51b021;
  box-shadow: 0px 3px 66px #0c51b021;
  /* height: calc(100vh - 290px); */
  position: relative;

}

@media (max-width: 991px) {
  div#showempdata {
    height: auto;
  }
}


.your-team {
  background: var(--white);
  -webkit-border-radius: 3px !important;
  border-radius: 3px !important;
  -webkit-box-shadow: 0px 0px 7px 1px var(--box-shadow-1);
  box-shadow: 0px 0px 7px 1px var(--box-shadow-1);
}

.your_team--tc {
  background: #f8f8f8;
  -webkit-border-radius: 4px !important;
  border-radius: 4px !important;
  padding: 10px;
}

.your_team--tc span {
  display: block;
  width: 100%;
  color: var(--dark-100);
  font-size: 16px;
  font-weight: 600;
  text-align: center;
}

.your_team--tc .your_team--tc-number {
  color: #0c56bb;
  font-size: 20px;
}

.your_team--blocktc1,
.your_team--blocktc2 {
  background: transparent;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  width: 50%;
}

.your_team--blocktc2 {
  border-left: 1px solid #ddd;
}

ul.rc-role-allocation-footer .btn-primary {
  border: 1px solid var(--primary-200);
  background-color: var(--primary-200);
  position: relative;
}
 
.btn-primary-no-arrow{
  padding:9px 15px;
  font-size: 14px;
  line-height: 17px;
}
.btn-primary-no-arrow::after{
  display: none;
}
ul.rc-role-allocation-footer .btn-gray--md {
  background: transparent;
  border: 1px solid var(--grey-200);
  color: var(--grey-200);
  font-size: 14px;
  min-width: 115px;
  text-align: center;
  display: flex !important;
  align-items: center;
}

ul.rc-select-role-lists li.rc-new-role-allocation__field-item {
  background: #ffd31c26;
  padding: 10px;
  -webkit-border-radius: 5px !important;
  border-radius: 5px !important;
  margin-left: 0 !important;
  margin-right: 12px;
}

ul.rc-select-role-lists {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

ul.rc-select-role-lists
  li.rc-new-role-allocation__field-item
  p.rc-new-role-allocation__field-title {
  color: #ad690b;
  font-size: 16px;
  font-weight: 600;
}

ul.rc-select-role-lists select {
  color: var(--dark-100);
  font-size: 16px;
  font-weight: 600;
  opacity: 1;
}

p.rc-new-role-allocation__field-title {
  color: #0c56bb;
  font-size: 14px;
  font-weight: 600;
}

label.rc-new-role-allocation__field-title {
  color: var( --primary-200);
  font-size: 14px;
  font-weight: 600;
}

.rc-select-role label {
  color: var( --primary-200);
  font-size: 14px;
  /* font-weight: 700; */
  line-height: 16px;
  font-family: "Lato-bold";
}

a.collapse_tab.active {
  background: #008FEA;
  position: relative;
}
a.collapse_tab.active::before {
  content: "";
  position: absolute;
  background-color: transparent;
  border-bottom: 10px solid #008FEA;
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  transform: translateX(-50%) rotate(180deg);
  left: 50%;
  bottom: -10px;
}



*::-webkit-scrollbar {
  width: 3px;
  height: 3px;
  background-color: #70707040;
}


.dataTables_scrollBody::-webkit-scrollbar {
  width: 3px;
  height: 5px;
  background-color: #70707040;
}

.btnright {
  right: 31px !important;
}

.delete_next1 {
  display: none;
  margin-left: -4px;
}

.delete_nextbtn {
  margin-left: 10px;
  display: none;
}

ul.myteamlist {
  margin: 0;
  padding: 0;
  max-height: 100px;
  overflow-x: hidden;
  overflow-y: auto;
}


.green,
.red,
.gray,
.yellow,
.black,
.white {
  position: relative;
  border-left: none;
}

.gray:before {
  border-left: 5px solid #b8b8b8;
}

.yellow:before {
  border-left: 5px solid #ff9b21;
}

.black:before {
  border-left: 5px solid #111110;
}

.green:before,
.red:before,
.gray:before,
.black:before,
.yellow:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
}

.text-gray {
  color: #b8b8b8;
}

.select-container {
  padding: 0;
}

.form-horizontal.select-container {
  /*border-bottom: 1px solid #eeeeee;*/
  max-height: calc(100vh - 370px);
  overflow-y: auto;
}

.border-green {
  border: 1px solid #e6e6e6;
  padding: 15px;
}

.margin_top_10 {
  margin-top: 15px;
}

ul.role_holder {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-height: calc(100vh - 370px);
  overflow-y: auto;
  width: 100%;
}

ul.role_holder li span.remove {
  position: absolute;
  top: -10px;
  right: -10px;
  color: var(--white);
  background: #666;
  height: 20px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  width: 20px;
  text-align: center;
  cursor: pointer;
}

.containers {
  overflow-y: auto;
  height: 245px;
}

h2.your_team {
  background: #5d92b1;
  color: var(--white);
  text-align: left;
  padding: 15px;
  font-size: 20px;
  text-transform: uppercase;
  margin: 0px 0px 5px 0;
}

ul.team_list li {
  list-style-type: none;
  cursor: pointer;
  /* width: 170px !important; */
  border:1px solid #70707022;
  margin-right: 9px;
  /* overflow-y: clip; */
}
ul.team_list li:last-child {
  margin-right: 0;
}

ul.team_list li a span.team_name {
  display: block;
  color: var(--black);
  text-decoration: none;
  font-size: 16px;
}

.collapse_tab_role.active {
  font-family: Lato;
  color: var(--white);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.56;
  background: #da2932;
  padding: 7px 0;
}

.start_date_wrap {
  background: #f5f4f4;
  padding: 6px 8px;
  color: #767676;
  font-weight: bold;
  text-align: left;
  font-size: 14px;
}

.start_date_wrap span {
  font-weight: normal;
}


.strt_d_wrap a.roll-eye-wrapp {
  margin: 0;
}

a.edit_role,
a.sub_next,
a.delete_next {
  color: var(--white);
  display: inline-block;
  width: auto;
  text-decoration: none;
  text-align: center;
  text-transform: capitalize;
}

a.edit_role {
  background-color: #da2932;
}

a.delete_next {
  background-color: #706964;
}

a.sub_next {
  background: #da2932;
  color: var(--white);
  text-transform: uppercase;
}

a.delete_next {
  margin-top: 10px;
}

.border_new {
  border-top: transparent;
}

.tip_wrap {
  margin-top: 15px;
}

.tip_wrap span {
  font-weight: normal;
  color: #908e8e;
}

.margin_top_10 + .margin_top_10 {
  margin-left: 5px;
}

.form-control[readonly],
fieldset[disabled] .form-control {
  cursor: pointer;
}

.bootstrap-dialog .bootstrap-dialog-message {
  height: 60px;
  margin-top: 30px;
}

.role_holder > li:first-child {
  margin-left: 0px;
}

.nokradisplay {
  height: 309px;
  display: table-cell;
  vertical-align: middle;
}

.nokradisplay h1 {
  font-size: 16px;
  text-align: center;
  margin: 0;
}

.status_count_wrap {
  display: inline-block;
}

.status_text {
  color: #8f8f8f;
}

.strt_d_wrap a.roll-eye-wrapp {
  margin: 7px 1px 2px 1px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background: #f1f1f1;
  border: 1px solid #c5c5c5;
  width: 118px;
}

span.label_new_sm {
  color: var(--black);
  font-size: 13px;
}

.data_wrap {
  border: 1px solid #c8c8c8;
  padding: 12px 1px 5px 5px;
  font-size: 12px;
  color: #828282;
  height: 57px;
}

.startdate span {
  color: #888888;
}

.startdate {
  color: var(--black);
  margin-top: 20px;
  font-size: 14px;
}

.total_count_wrap {
  background: #f5f4f4;
  padding: 15px;
  margin-bottom: 5px;
  color: #767676;
}

.total_count span {
  width: 105px;
  display: inline-block;
  margin-bottom: 5px;
}

.status_btn {
  color: var(--dark-100);
  padding: 5px 20px;
  margin-left: 10px;
  display: block;
  position: relative;
  font-family: "Lato-bold";

}

.status_btn.red_status {
  color: #9f1d35 !important;
}



.comment_holder {
  max-height: 350px;
  overflow-x: hidden;
  overflow-y: scroll;
}

textarea.new_comment {
  resize: none;
  -webkit-border-radius: 0;
  border-radius: 0;
  margin: 10px 0;
  width: 100%;
}

.reposting_comment {
  margin-bottom: 15px !important;
}

.reposting_comment:last-child {
  margin-bottom: 0 !important;
}

.status_btn {
  text-align: center;
}

.view_all > a {
  color: #000000;
  font-size: 13px;
  text-decoration: underline;
  cursor: pointer;
}

.comment_header {
  font-size: 18px;
  color: #474747;
}

.view_all a {
  font-size: 16px;
  color: #337ab7;
}

span.from_error.role_error,
span.to_error.role_error {
  width: 100%;
  float: none;
  display: inline;
  margin-top: 5px;
  font-family: "Lato-regular";
}


.tri {
  position: relative;
  padding: 10px 15px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  border: 0 none;
  background: #ffd31c26;
}

.comment_holder_repo p {
  font-size: 14px;
  line-height: 16px;
  color: var(--dark-100);
  font-family: "Lato-semibold";
}

.comment_holder_repo .comment-heading {
  color: #ad690b;
  font-size: 16px;
  font-weight: 600;
}

.comment-heading.date {
  font-size: 16px;
}



.tri_recd {
  position: relative;
  border: 1px solid #f2f2f2;
  padding: 8px 15px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background: #f2f2f2;

}



@media (max-width: 345px) {
  .recent-comment__viewComment {
    position: relative;
    top: 100px;
    right: 4px;
    margin-bottom: -15px;
  }
}

.filter_result_wrap {
  margin: 15px 15px 0 15px;
  border: 1px solid #c1c1c1;
  padding: 15px 0;
}

select.recovery.form-control {
  margin-bottom: 10px;
  height: 50px;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 1px solid #c2c2c2;
}

option:checked {
  background: none;
  font-weight: 400;
  text-shadow: none;
  color: #666;
}

.display_result {
  border: 1px solid #dedede;
}

.search_box_wrap {
  border-bottom: 1px solid #d7d7d7;
  position: relative;
}

.search_list {
  margin: 0;
  padding: 0;
  max-height: 300px;
  min-height: 300px;
  overflow-x: hidden;
}

.search_box_wrap input.searchbox {
  width: 90%;
  padding: 10px 15px 10px 35px;
  border: none;
}

span.close_x {
  width: 10%;
}

.search_list li {
  list-style-type: none;
  font-size: 13px;
  color: #7f7f7f;
  position: relative;
  margin: 15px 10px;
  border-bottom: 1px solid #d6d5d6;
  padding-bottom: 15px;
}

p.search_text {
  width: 72%;
  float: left;
  margin: 0;
}

a.green_border {
  float: right;
  top: 50%;
  position: absolute;
  right: 8px;
  margin-top: -20px;
  font-size: 13px;
  background: transparent;
  color: #5b5b5b;
  border: 1px solid #0fdd1d;
  padding: 3px 10px;
  text-decoration: none;
}

a.green_border:hover {
  text-decoration: none;
}

.kra_markers_wrap {
  border: 1px solid #bfbfbf;
}

.kra_markers_wrap_header {
  background: #f5f4f4;
  padding: 15px;
  font-size: 16px;
  color: #767676;
  font-size: "Roboto-Bold";
}

.kra_markers_wrap_body {
  max-height: 347px;
  min-height: 347px;
  overflow-x: hidden;
  overflow-y: scroll;
}

.kra_markers_wrap_footer {
  background: #f5f4f4;
  padding: 10px;
}

.kra_wrap_record {
  padding: 15px 10px;
}

.kra_wrap_record .plus,
.kra_wrap_record .minus {
  background: transparent;
  color: #888888;
  text-align: center;
  font-size: 14px;
  width: 15px;
  height: 15px;
  display: inline-block;
  line-height: 1;
  cursor: pointer;
  margin: 0 3px 0 0;
  border: 1px solid #c5c5c5;
}

.kra_wrap_record input.number {
  width: 30px;
  border: 1px solid #b8b8b8;
  text-align: center;
  font-size: 13px;
  padding: 5px 0;
}

.green_border.greenselect {
  color: var(--white);
}

.col-xs-1.arrow_wrap {
  height: 436px;
}

img.arrow_img {
  display: table-cell;
  vertical-align: middle;
  position: absolute;
  top: 50%;
}

.kra_markers_wrap_body .text_kra {
  color: #7f7f7f;
  font-size: 13px;
  float: right;
  width: 84%;
}

.greenselect {
  background: #0fdd1d !important;
}

.start_date_wrap {
  background: #f5f4f4;
  padding: 6px 8px;
  color: #767676;
  font-weight: bold;
  text-align: left;
  font-size: 14px;
}

.start_date_wrap.start {
  margin-bottom: 10px;
}

.date_wrap.inline input {
  width: 140px;
  float: right;
}

.check_wrap.inline {
  margin-left: 10px;
  padding-top: 12px;
  position: relative;
  top: 6px;
}

.date_wrap.inline .calender {
  margin: 0 5px;
}

.date_wrap .date_holder label {
  font-weight: bold;
  font-size: 14px;
}

.date_holder.start {
  margin-top: 5px;
  margin-bottom: 5px;
}

.date_holder {
  margin-top: 15px;
}

.button_wrap.inline {
  position: absolute;
  right: 15px;
}

.button_wrap.inline .btn_orange {
  margin-top: 0;
  padding: 5px 15px;
  right: 0;
}

.depclass {
  margin-left: 0;
  margin-right: 0;
}

.search_list li:last-child {
  border-bottom: transparent;
}

span#kratotal-1,
span#totalmrk-1 {
  float: right;
}

.total_wrap,
.kra_pending {
  text-align: left;
}

.kra_markers_wrap_header {
  font-weight: bold;
  border-bottom: 1px solid #ccc;
}

.radio label {
  padding-left: 8px;
}

.search_box_wrap:before {
  content: "\f002";
  position: absolute;
  color: #757575;
  top: 11px;
  left: 15px;
  z-index: 99;
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.date_holder > label {
  width: 66px;
}

@media (max-width: 767px) {
  .rc-comment-modal .btn-primary[disabled] {
    width: auto !important;
  }
}

.rc-new-role-allocation__field-checkoboxt .checkbox1 {
  width: auto;
}

.checkbox-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}

.rc-role-allocation--style-2 {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.rc-role-allocation--style-2 .custom-input {
  margin-bottom: 0;
  margin-left: 40px;
}

.rc-role-allocation--style-2 .custom-input .action {
  margin-right: 5px;
}

.rc-exception-field .panel-group-style-1 {
  margin-bottom: 0;
  height: 100%;
  overflow-y: auto;
}

@media screen and (max-width: 991px) {
  .rc-exception-field .panel-group-style-1 {
    height: auto;
    overflow-y: visible;
  }
}

.rc-exception-main .emp_exception-list-table tbody {
  height: 100px;
  overflow-y: auto;
}

.add-kra-page .rc-exception-main {
  height: calc(100vh - 255px);
  /* overflow-y: auto; */
}

.rc-exception-main.rc-exception_kra--left {
  height: calc(100vh - 270px);
  overflow-y: hidden;
  padding: 0;
  margin: 0;
}
@media screen and (max-width:768px){
  .rc-exception_kra--left .rc-exception-field{
    min-width: 600px;
  }
}
.add-new-kra-table.scrollTable tbody {
  max-height: calc(100vh - 395px);
  padding-right: 20px;
  padding-left: 1px;
}
.add-new-kra-table thead {
  border-right: 25px solid transparent;
}

@media screen and (max-width: 991px) {
  .add-kra-page .rc-exception-main {
    height: auto;
    overflow-y: visible;
  }
}

.role-acceptance .panel-group.accordion-style-1 {
  height: calc(100vh - 200px);
  overflow-y: auto;
  padding-right: 10px;
  margin-bottom: 0;
}

@media screen and (max-width: 991px) {
  .role-acceptance .panel-group.accordion-style-1 {
    height: auto;
    overflow-y: visible;
  }
}

@media (max-width: 767px) {
  .role-acceptance .panel-group.accordion-style-1 {
    padding: 15px;
  }
}

.rc-admin-department-select
  .form-control--select-style-1
  .select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  background-color: transparent;
  border: 0 none !important;
}

.rc-admin-department-select
  .form-control--select-style-1
  .select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  background-color: transparent;
}

.rc-admin-department-select
  .form-control--select-style-1
  .select2-container--default
  .select2-selection--single
  .select2-selection__arrow:after {
  color: #100b0b;
}

ul:not(.rc-select-role-lists)
  li.rc-new-role-allocation__field-item:not(.assignment-duration)
  .rc-new-role-allocation__field-text {
  font-family: "Lato";
  font-size: 16px;
  font-weight: 600;
  line-height: 1.21;
  color: rgba(23, 23, 23, 0.6);
  width: 100%;
  padding: 12px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: solid 0 #b0bac9;
  background-color: rgba(239, 239, 239, 0.5);
}

.checkbox-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  margin-bottom: 0 !important;
}

.rc-admin-accordion .table tr td:last-of-type,
.rc-admin-accordion .table tr th:last-of-type {
  text-align: right;
}

.rc-admin-allocation__title-wrapper {
  border-bottom: 1px dashed #cdcdcd;
  padding-bottom: 5px;
  margin-bottom: 10px;
}

.rc-admin-allocation__main-title {
  color: #0c52b1;
  font-size: 19px;
}

.kra_wrap_record .table-bordered > thead > tr > th,
.kra_wrap_record .table-bordered > thead > tr > td {
  border-bottom-width: 0px;
}

.kra_wrap_record .table,
.kra_wrap_record th,
.kra_wrap_record td {
  border: 0 none;
}

.kra_wrap_record .table-bordered > thead > tr > th,
.kra_wrap_record .table-bordered > tbody > tr > th,
.kra_wrap_record .table-bordered > tfoot > tr > th,
.kra_wrap_record .table-bordered > thead > tr > td,
.kra_wrap_record .table-bordered > tbody > tr > td,
.kra_wrap_record .table-bordered > tfoot > tr > td {
  border: 0 none;
}

.kra_wrap_record table thead tr {
  border-bottom: 1px solid #0c52b1;
}

.kra_wrap_record table td,
.kra_wrap_record table th {
  font-size: 16px !important;
}

.role-kra thead th,
.role-kra tbody td {
  font-size: 16px;
}

.role-kra thead tr th,
.role-kra tbody tr td,
.role-kra tfoot tr {
  padding: 0;
}

.role-kra > thead > tr > th,
.role-kra > tbody > tr > th,
.role-kra > tfoot > tr > th,
.role-kra > thead > tr > td,
.role-kra > tbody > tr > td,
.role-kra > tfoot > tr > td {
  padding: 0;
}

.content-border-wraper {
  background-color: transparent;
  border: 0 none;
}

@media (max-width: 767px) {
  .table-responsive {
    border: 0 none;
  }
}

.role-acceptance__comment {
  margin: 16px 0 0 0;
}

#comment_form > div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

#comment_form .comment--radio {
  margin-left: 10px;
}

.select-vertical_wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
}

.select-vertical_wrapper .rc-new-role-allocation__field-item {
  width: 100%;
  /* margin-top: 0; */
}

.select-vertical_wrapper ul.rc-select-role-lists {
  width: 35%;
}

.select-vertical_wrapper .rc-new-role-allocation__field {
  background: #ffd31c26;
  padding: 10px;
  -webkit-border-radius: 5px !important;
  border-radius: 5px !important;
  margin-left: 0 !important;
  margin-right: 12px;
}

.select-vertical_wrapper .rc-new-role-allocation__field-title {
  color: #ad690b;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 5px;
}

.select-vertical_wrapper .rc-new-role-allocation__field-title + select {
  padding: 0;
  background-color: transparent;
  margin-left: -5px;
  border: 0 none;
  line-height: 1;
  font-weight: 600;
  width: auto;
}

.select-vertical_wrapper .rc-new-role-allocation__field-title + select.prime {
  width: inherit;
}

.select-vertical_wrapper .custom-input {
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -moz-box-flex: 0;
  -ms-flex: none;
  flex: none;
}

.select-vertical_wrapper .vertical,
.select-vertical_wrapper .co-vertical {
  width: auto;
}

.select-vertical_wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 15px;
}

.select-vertical_wrapper
  ul:not(.add-corole)
  .rc-new-role-allocation__field-item {
  width: 100%;
  margin-top: 0;
}

.select-vertical_wrapper ul:not(.add-corole) .prime {
  width: 100%;
}

.select-vertical_wrapper .add-corole .form-control-select {
  width: inherit;
}

.select-vertical_wrapper ul.rc-select-role-lists {
  width: 35%;
}

.select-vertical_wrapper ul.rc-select-role-lists.add-corole {
  width: 100%;
}

.select-vertical_wrapper .rc-new-role-allocation__field {
  background: #ffd31c26;
  padding: 10px;
  -webkit-border-radius: 5px !important;
  border-radius: 5px !important;
  margin-left: 0 !important;
  margin-right: 12px;
}

.select-vertical_wrapper .rc-new-role-allocation__field-title {
  color: #ad690b;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 5px;
}

.select-vertical_wrapper .rc-new-role-allocation__field-title + select {
  padding: 0;
  background-color: transparent;
  margin-left: -5px;
  border: 0 none;
  line-height: 1;
  font-weight: 600;
  width: auto;
}

.select-vertical_wrapper .rc-new-role-allocation__field-title + select .prime {
  width: 100%;
}

.select-vertical_wrapper .custom-input {
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -moz-box-flex: 0;
  -ms-flex: none;
  flex: none;
}

.select-vertical_wrapper .vertical,
.select-vertical_wrapper .co-vertical {
  width: auto;
}

.accordion_table tbody tr {
  border-bottom: 1px dashed #cdcdcd;
}

.table-primary-1.accordion_table thead tr th,
.accordion_table tbody tr td {
  text-align: left;
}

.table-primary-1.accordion_table thead tr th:last-of-type,
.table-primary-1.accordion_table tbody tr td:last-of-type {
  text-align: center;
}

.exp-raised_emp_details--wrapper {
  padding: 15px 15px 10px 15px;
  margin: 15px 0;
}

.exp-raised_emp_details {
  display: flex;
}

.exp-raised_emp_details div {
  width: calc(100% / 3 - 10px);
}

.exp-raised_emp_details p {
  font-size: 16px;
  font-family: "Lato-regular";
}

.exp-raised_emp_details p span {
  /* font-weight: bold; */
  font-family: "Lato-bold";
  margin-right: 5px;
  display: inline-block;
}

.delete-kra-reason {
  background-color: #f4f6fc;
  margin-bottom: 15px;
}

.flagged-kras-table-wrapper {
  padding-bottom: 25px;
  border-bottom: 1px dashed #cdcdcd;
}

.kra-wgt-edited {
  background-color: #abe4ab;
}

.deleted-kras-table tr {
  background: #f6b0b0;
}
.welcome-text {
  font-size: 22px;
  font-family: "Lato-bold";
  /* font-weight: 700; */
  line-height: 31px;
  color: var(--dark-100);
  margin-top: 0;
}
.welcome-text span {
  color: var( --primary-200);
}
/* new tab design css */
.two-col-tabs {
  display: flex;
  margin-left: -15px;
}
.two-col-tabs .role_text {
  width: 60%;
  padding-left: 15px;
  border-left: 1px solid rgba(112, 112, 112, 0.2);
  margin-left: 0;
}
.new_tab-container .new_tab-item {
  box-shadow: 0px 3px 36px var(--box-shadow-1);
  padding: 15px 15px;
}
.new_tab-container .new_tab-item .new_tab-container .new_tab-item--title {
  font-size: 18px;
  line-height: 22px;
}
.role-duration {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.collapse_tab_role.active .role-duration + .rc-role-allocation-footer li {
  /* margin: 14px 0; */
}
.role-duration > .total-duration {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 35%;
}
.total-duration span {
  display: inline-block;
  height: 1px;
  /* width: 35%; */
  position: relative;
}

.total-duration span {
  display: inline-block;
  height: 1px;
  width: calc(100% - 20px);
  position: relative;
}
/* yellow dots css */
.total-duration span::before {
  content: "";
  background-color: var( --primary-200);
  height: 0.5rem;
  width: 0.5rem;
  border-radius: 0.5rem;
  position: absolute;
  top: 50%;
  transform: translateY(-47%);
}
.total-duration span::after {
  content: "";
  background-color: var(--dark-400);
  height: 1px;
  width: calc(100% - 30px);
  position: absolute;
  top: 50%;
}
.total-duration span:first-of-type::before {
  left: 0;
}
.total-duration span:first-of-type::after {
  left: calc(8px + 10px);
}
.total-duration span:last-of-type::before {
  right:0;
}
.total-duration span:last-of-type::after {
  right: calc(8px + 10px);
}
ul.role_holder .collapse_tab_role.active .total-duration span::before {
  background-color: var( --primary-200);
}
/* uncomment later */
ul.role_holder .collapse_tab_role .rc-role-allocation-footer {
  display: none;
}
ul.role_holder .collapse_tab_role.active .rc-role-allocation-footer {
  display: block;
}
.total-duration {
  color: var(--dark-400);
  font-size: 12px;
  line-height: 15px;
  font-family: "Lato-regular";
}

.role_container .card-title {
  font-size: 17px;
  font-family: "Opensans-semibold";
  /* font-weight: 600; */
  line-height: 22px;
  margin-top: 3px;
  margin-bottom: 10px;
  white-space: normal;
  width: calc(100% - 2px);
  padding-left: 18px;
  position: relative;
}
.role_container .collapse_tab_role .card-title-wrapper{
  display: flex;
  justify-content: space-between;
}
.card-title-wrapper .card-title{
  width: 95%
}

.role_container .card-title::before {
  content: "";
  background-image: url(../../img/icon/star.png);
  background-size: contain;
  display: inline-block;
  position: absolute;
  left: 0;
  top: 3px;
  height: 15px;
  width: 15px;
}
.role_container .card-title .allocation-status {
  display: inline-block;
  height: 12px;
  width: 12px;
  border-radius: 12px !important;
  margin-left: 0px;
}
.role_container .card-title .allocation-status.pending {
  background-color: #5d5d5d;
}
.role_container .card-title .allocation-status.accepted {
  background-color: #1d8b43;
}
.role_container .card-title .allocation-status:not(.show-icon) img {
  display: none;
}
.role_container .card-title .allocation-status.role-flagged .icon-flag,
.role_container
  .card-title
  .allocation-status.yet-to-be-allocated
  .icon-yt-allocated {
  display: block;
  height: 16px;
}
.role_container .card-title .allocation-status.role-flagged .icon-yt-allocated,
.role_container .card-title .allocation-status.yet-to-be-allocated .icon-flag {
  display: none;
}
.role_container .card-title .allocation-status.role-flagged,
.role_container .card-title .allocation-status.yet-to-be-allocated {
  height: auto;
}
.role-start .timestamp {
  padding-left: 30px;
  position: relative;
  margin: 0;
}
.timestamp {
  font-size: 14px;
  font-family: "Lato-bold";
  /* font-weight: 700; */
  position: relative;
  margin: 0;
}
.role-start .timestamp::before {
  content: url(../../img/calendar.svg);
  position: absolute;
  left: 0;
  top: 0;
}

.role-end .timestamp::before {
  content: url(../../img/calendar.svg);
  position: absolute;
  left: 0;
  top: 0;
}


.collapse_tab_role .role-duration {
  width: 98%;
  align-items: flex-end;
  margin-bottom: 15px;
}
.collapse_tab_role .role-duration > div {
  width: auto;
}
.collapse_tab_role .role-duration > .total-duration{
  width: 45%;
}
.role-duration .role-duration--title {
  display: block;
  color: #54586e;
  font-size: 13px;
  font-family: "Lato-regular";
  /* font-weight: 500; */
  white-space: normal;
}
.role-duration .form-control--date-picker {
  padding: 0;
  background-color: transparent;
}
.role-duration .timestamp .form-control--date-picker {
  color: var(--dark-100);
  font-size: 14px;
  line-height: 16px;
  font-family: "Lato-bold";
  width: 75px;
  /* font-weight: 700; */
}
.collapse_tab_role.pending::before,
.collapse_tab_role.accepted::before,
.collapse_tab_role.flagged::before,
.collapse_tab_role.rejected::before,
.collapse_tab_role.exception-raised::before{
  top: 0;
  content: '';
  display: inline-block;
  height: 100%;
  width: 7px;
 
  left: 0;
  position: absolute;
  border-radius:5px !important;
}
.collapse_tab_role.rejected::before{
  background: var(--red-200);
}
.collapse_tab_role.flagged::before{
  background: #f7a028;
}
.collapse_tab_role.exception-raised::before,.collapse_tab_role.pending::before{
  background: #5d5d5d;
}
.collapse_tab_role.accepted::before{
  background: var(--primary-200);
}
.collapse_tab_role.active::before{
  opacity:1;
}
.collapse_tab_role::before{
  opacity:0.4;
}
.collapse_tab_role .rc-role-allocation-footer a {
  margin-bottom: 5px;
  margin-right: 15px;
  padding: 8px 15px;
  font-size: 14px;
  line-height:16px;
}
.collapse_tab_role .rc-role-allocation-footer a::after{
  right: 15px;
}
.collapse_tab_role .rc-role-allocation-footer .hide + a {
  margin-left: 0;
}
.collapse_tab_role .exception_assigned-roles {
  margin: 5px 0;
  width: 100%;
  align-items: center;
}
.collapse_tab_role .exception_assigned-roles .exp-heading {
  width: 9%;
  white-space: normal;
}

.collapse_tab_role .exp_chain_view {
  padding-left: 10px;
  width: 86%;
}
.collapse_tab_role .exception_assigned-roles .exp-heading p {
  margin-bottom: 6px;
}

.joining_date {
  margin-bottom: 18px;
}
.joining_date .rc-new-role-allocation__field-title {
  display: none;
}
.joining_date {
  width: 100%;
  border: 1px dashed #70707080;
  border-radius: 5px !important;
  padding: 7px 15px;
}
.joining_date-title {
  color: var( --primary-200);
  font-size: 14px;
  line-height: 16px;
  /* font-weight: 700; */
  margin: 0 0 8px 0;
  font-family: "Lato-bold";
}
.joining_date .rc-new-role-allocation__field-text {
  font-size: 15px;
  line-height: 18px;
  margin-bottom: 0;
  /* font-weight: 500; */
  color: var(--dark-100);
  font-family: "Lato-bold";
}
.joining_date .total-duration {
  width: 65%;
  justify-content: space-between;

}
.joining_date .total-duration span::after {
  width: calc(100% - 8px - 20px);
  left: calc(8px + 10px);
}
.joining_date .total-duration span:first-of-type::before {
  left: 0;
}
.joining_date .total-duration span:last-of-type::after {
  right:calc(8px + 10px);
  left: unset;
}
.joining_date .total-duration span:last-of-type::before {
  right: 0;
}
.joining_date .total-duration span:first-of-type {
  /* width: 18%; */
}
.joining_date .duration-value {
  margin-bottom: 0;
  text-align: center;
  width: auto;
  white-space: pre;
}

.role_date_picker {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-bottom: 0px;
}
.role_date_picker .rc-new-role-allocation__field-item {
  width: 46%;
  margin-right: 10px;

}
.role_date_picker .rc-new-role-allocation__field-item .role_date_picker-input {
  background-color: var(--grey);
  border-radius: 5px !important;
  padding: 8px 15px;
  position: relative;
}
.role_date_picker .form-control--date-picker {
    background-color: #ce252500;
    padding: 0 0px 0 0;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    font-family: "Lato-bold";
    z-index: 0;
    cursor: auto;
    position: relative;
}
.role_date_picker label.rc-new-role-allocation__field-title {
  font-size: 14px;
  line-height: 16px;
  position: relative;
  font-family: "Lato-bold";
}
.role_date_picker .role_date_picker-input::before {
  position: absolute;
  top: 35px;
  right: 15px;
}
.two-col-tabs.add-new-role-col {
  margin-left: 0;
}
.two-col-tabs.add-new-role-col .role_form {
  height: calc(100vh - 350px);
  overflow-y: auto;
}
/* transparent scroll design */
.two-col-tabs.add-new-role-col .role_form::-webkit-scrollbar,
.two-col-tabs.no-role-assigned .role_form::-webkit-scrollbar,
.two-col-tabs .role_container::-webkit-scrollbar {
  width: 0;
  background-color: transparent;
}
.two-col-tabs.add-new-role-col .role_form::-webkit-scrollbar-thumb,
.two-col-tabs.no-role-assigned::-webkit-scrollbar-thumb,
.two-col-tabs .role_container::-webkit-scrollbar-thumb {
  border-radius: 1px !important;
  background-color: transparent;
}
.two-col-tabs .edit-rc-select-role {
  display: none;
}
.two-col-tabs.add-new-role-col .edit-rc-select-role {
  display: block;
}
.no-role-assigned .display_kra-wrap.kra-hidden .kra-desc-table {
  display: none;
}
.no-role-assigned .display_kra-wrap:not(.kra-hidden) .kra-desc-table {
  display: table;
}

.rc-select-role-lists.new_select-role {
  display: flx;
  flex-wrap:wrap;
  margin-top: 15px;
  margin-bottom: 15px;
}
.rc-select-role-lists.new_select-role.new_role_co,.rc-select-role-lists.new_select-role.new_role_co li{
  margin-bottom: 0;
}
.rc-select-role-lists.new_select-role.new_role_co + .new_select-role{
  margin-top:0;
}
.new_select-role li {
  width: 46%;
  margin-right:10px;
}
ul.new_select-role li.rc-new-role-allocation__field-item {
  background-color: var(--grey);
  border-radius: 5px !important;
  padding: 11px 15px;
  position: relative;
}
ul.new_select-role li.rc-new-role-allocation__field-item.delete_next {
  display: flex !important;
  flex-direction:column;
}
ul.new_select-role
  li.rc-new-role-allocation__field-item
  p.rc-new-role-allocation__field-title {
  display: block;
  width: 100%;
  color: var( --primary-200);
  font-size: 14px;
  /* font-weight: 700; */
  font-family: "Lato-bold";
  line-height: 17px;
  margin-bottom: 0;
}
ul.new_select-role li.rc-new-role-allocation__field-item .form-control-select {
  background: transparent;
  border-radius: 5px !important;
  padding: 0;
  font-size: 14px;
  line-height: 17px;
  font-family: "Lato-bold";
  margin: 0;
  color: var(--dark-100)99;
  appearance: none;
}
.kra-desc-table {
  width: 100% !important;
}
.add-new-role-col .role_container {
  display: none;
}
.no-role-assigned .role_container {
  display: none;
}
.two-col-tabs.add-new-role-col .role_text {
  margin-left: 0;
  border-left: 0;
}
/* .two-col-tabs.add-new-role-col .role_text .display_kra-wrap{
  border-left: 1px solid rgba(112, 112, 112, 0.2);
} */
.no-role-assigned .role_text {
  width: 100% !important;
  padding-left: 0;
  display: flex;
  border-left: 0;
  margin-left: 0;
}

.add-new-role-col .role_text {
  width: 100%;
  display: flex;
  padding: 0;
}
.two-col-tabs.no-role-assigned .role_form,
.two-col-tabs .role_container {
  height: calc(100vh - 290px);
  overflow-y: auto;
  padding-left: 15px;
}
.add-new-role-col .role_form,
.no-role-assigned .role_form {
  width: 40%;
  border-right: 1px solid #70707033;
  padding-right: 10px;
}
.add-new-role-col .display_kra-wrap,
.no-role-assigned .display_kra-wrap {
  width: 60%;
  padding-left: 15px;
}

.add-next-role {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top:0;
}
.add-next-role .add_role {
  padding: 0;
}
.add-new-role-col .kra-hidden {
  display: block;
}


.two-col-tabs:not(.add-new-role-col) .kra-hidden .kra-hidden-block {
  display: none;
}
.two-col-tabs.no-role-assigned .kra-hidden .kra-hidden-block {
  display: flex;
}

.display_kra-wrap:not(.kra-hidden) .kra-hidden-block {
  display: none;
}
.kra-hidden-block p {
  font-size: 18px;
  line-height: 23px;
  color: var(--dark-100);
  font-family: "Lato-bold";
  margin: 23px 0 0 0;
  width: 40%;
}
.kra-hidden-block {
  height: calc(100vh - 385px);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

/* slider design */
.team_list .slick-slide {
  width: 170px !important;
  margin-right: 7px;
}
.team_list .slick-track {
  height: 130px;
  max-width: 100%;
  display: flex;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.3;
}
.slick-prev,
.slick-next {
  width: auto;
  height: auto;
}
.slick-prev {
  right: -30px;
  left: auto;
  transform: translateY(-61%) rotate(180deg);
}
.slick-next {
  right: -54px;
}
.slick-prev:before {
  content: url(../../img/slider-arrow-right.svg);
}
.slick-next:before {
  content: url(../../img/slider-arrow-right.svg);
}
.slick-slide > div{
  width: 170px;
}

.teamlist_tab_wrap .slick-dots li.slick-active {
  background: #707070;
}
.teamlist_tab_wrap .slick-dots{
  display: flex;
  bottom: -5px;
}
.teamlist_tab_wrap .slick-dots li{
  width: 100%;
  margin: 0 !important;
  height: 5px;
  background: #ccc;
}
.teamlist_tab_wrap .slick-dots li button{
  width: 100%;
  height: 5px;
  padding: 0;
}
.teamlist_tab_wrap .slick-dotted.slick-slider {
  margin-bottom: 7px;
}
.team_list .slick-list::-webkit-scrollbar-track{
  background: #efdcdc1c !important;
}

/* confirmation modal */

.modal-img {
  margin-bottom: 36px;
}

.modal-sub-title {
  font-size: 12px;
  line-height: 15px;
  font-family: "Lato-regular";
  /* font-weight: 400; */
  color: #2c2c2c;
  margin: 7px 0 0 0;
}

.modal-description {
  font-size: 18px;
  line-height: 20px;
  font-family: "Lato-bold" !important;
  /* font-weight: 500; */
  color: var(--primary-200);
  margin-bottom: 40px;
}

.modal .btn-no {
  background: var(--dark-100);
  color: var(--white);
  line-height: 18px;
  border: 1px solid var(--grey-200);
  padding: 8px 16px;
  font-weight: 700;
}

.modal .btn-no:hover {
  background: #fff 0% 0% no-repeat padding-box;
  color: var(--dark-100);
  border: 1px solid var(--dark-100);
}

.modal-btn-no-white-arrow,
.modal-btn-no-brown-arrow {
  transform: rotate(180deg);
  height: 10px;
  width: 13px;
  margin-right: 17px;
}

.modal-btn-no-icon:hover {
  color: var(--grey-200);
}

.modal .btn-yes {
  padding: 8px 16px;
  font-weight: 700;
  line-height: 18px;
  width: auto;
  background: var(--primary-200);
  border: 1px solid var(--primary-200);
  color: var(--white);
}
.modal .btn-yes:hover,
.modal .btn-yes:focus{
  background: transparent;
  border: 1px solid var(--primary-200);
  color:var(--primary-200);
}
.modal .btn::after{
  display:none;
}

.btn {
  position: relative;
}
.modal-btn-yes-white-arrow,
.modal-btn-yes-blue-arrow {
  height: 10px;
  width: 13px;
  margin-left: 17px;
  /* float: right; */
  right: 15px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.modal-btn-no-brown-arrow,
.modal-btn-yes-blue-arrow {
  display: none;
}

.modal .btn-no:hover .modal-btn-no-white-arrow {
  display: none;
}

.modal .btn-no:hover .modal-btn-no-brown-arrow {
  display: inline-block;
}

.modal .btn-yes:hover .modal-btn-yes-white-arrow {
  display: none;
}

.modal .btn-yes:hover .modal-btn-yes-blue-arrow {
  display: inline-block;
}

.modal-btn-yes-icon:hover {
  color: var(--primary-200);
}
.dataTables_scrollBody {
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.scrollTable {
  width: 100%;
}

.scrollTable thead {
  display: table; /* to take the same width as tr */
  width: 100%;
  border-radius: 3px !important;
}

.scrollTable tbody {
  display: block; /* to enable vertical scrolling */
  max-height: calc(100vh - 400px); /* e.g. */
  overflow-y: auto; /* keeps the scrollbar even if it doesn't need it; display purpose */
  margin-top: 5px;
}

.scrollTable th,
.scrollTable td {
  width: auto;
}
.scrollTable th:first-of-type,
.scrollTable td:first-of-type {
  text-align: left;
}
.scrollTable th:last-of-type,
.scrollTable td:last-of-type {
  text-align: center;
  width: 10%;
}
.scrollTable tr {
  display: table; /* display purpose; th's border */
  width: 100%;
  box-sizing: border-box; /* because of the border (Chrome needs this line, but not FF) */
}
.scrollTable thead th .recent-comment__viewComment {
  text-align: right;
}
/* btn theme update */
.btn{
  font-family: "Lato-bold";
}
.btn-danger{
  background: var(--red-200);
  border: 1px solid var(--red-200);
  color: var(--white);
}
.btn-danger:hover,
.btn-danger:focus {
  background: transparent;
  border: 1px solid var(--red-200);
  color: var(--red-200);
}
.btn-blue{
  background: #008FEA;
  border: 1px solid #008FEA;
  color: var(--white);
}
.btn-blue:hover,
.btn-blue:focus {
  background: transparent;
  border: 1px solid #008FEA;
  color: #008FEA;
}
.btn-dark {
  background: var(--dark-100);
  border: 1px solid var(--dark-100);
  color: var(--white);
}
.btn-dark:hover,
.btn-dark:focus {
  background: transparent;
  border: 1px solid var(--dark-100);
  color: var(--dark-100);
}
ul.rc-role-allocation-footer .btn-grey{
  background: var(--grey-200);
  border: 1px solid var(--grey-200);
}
.btn-grey:hover{
  background: transparent;
  border: 1px solid var(--grey-200);
  color:var(--grey-200);
}

/* role acceptance role summary new design starts here on 08-05-23 */
.role-acceptance {
  padding: 25px 0 0 0;
}
.role-acceptance .block-title--style-2 {
  margin: 0 0 10px 0;
}
.role-acceptance_rightblock_wrap {
  margin-top: 15px;
  box-shadow: 0px 3px 46px #0000140d;
  padding: 0;
}
.role-acceptance_border-top {
  border-top: 5px solid var( --primary-200);
}
.role-acceptance_rightblock_wrap .role-acceptance-role_summary {
  padding: 15px 0;
}
.role-acceptance_rightblock_wrap .role-acceptance-role_summary {
  border-bottom: 1px dashed #cdcdcd;
}
.botton_wrap_q {
  border-top: 1px dashed #cdcdcd;
}
.role-acceptance_rightblock_wrap .additional_role {
  border-bottom: 0;
  margin: 0;
  padding: 0;
}
.graph_wrapper {
  padding: 20px 0;
  position: relative;
}

.graph_wrapper::before,
.graph_wrapper::after,
.role-agree::before,
.role-agree::after{
  content: '';
  height: 15px;
  width: 15px;
  display: inline-block;
  position: absolute;
  z-index: 0;
}
.graph_wrapper::before,
.role-agree::before{
  background: #b8afb030;
  border-radius: 0px 10px 10px 0px !important;
  top: -7px;
  left: -24px;
}
.graph_wrapper::after,
.role-agree::after{
 
  border-radius:10px 0px 0px 10px !important;
  top: -7px;
  right: -24px;
      background: #00000014;
}
.chain-view .additional_role {
  font-size: 14px;
  line-height: 1;
  font-family: "Lato-bold";
  /* font-weight: 700; */
  color: var(--dark-100);
  margin-bottom: 16px;
  padding-left: 15px;
  position: relative;
}
.chain-view .additional_role::after {
  content: "";
  position: absolute;
  left: 1px;
  top: 0;
  transform: translateY(5px);
  background: #cacaca;
  height: 5px;
  width: 5px;
  border-radius: 10px !important;
}
.chain-view .additional_role::before {
  content: "";
  position: absolute;
  height: calc(100% + 16px);
  width: 1px;
  top: 7px;
  display: block;
  background-color: transparent;
  background-image: linear-gradient(#dee2e6 33%, rgba(255, 255, 255, 0) 0%);
  background-position: right;
  background-size: 1px 5px;
  background-repeat: repeat-y;
}
.chain-view .additional_role:first-of-type {
  font-size: 18px;
  line-height: 22px;
  font-family: "Opensans-semibold";
}
.chain-view .additional_role:first-of-type::after {
  background: var(--primary-200);
  height: 8px;
  width: 8px;
  left: 0;
}
.chain-view .additional_role:first-of-type::before {
  left: 3px;
  transform: translateX(0);
}
.chain-view .additional_role::before {
  left: 3px;
  transform: translateX(0);
}
.chain-view .additional_role:last-of-type::before {
  display: none;
}
.additional_details {
  display: flex;
}
.additional_details {
  color: var(--dark-100);
  font-size: 12px;
  line-height: 15px;
  margin-bottom: 11px;
  font-family: "Lato-regular";
}
.additional_details:last-of-type {
  margin-bottom: 0;
}
.additional_details p {
  color: var(--dark-100);
  font-size: 13px;
  line-height: 16px;
  /* font-family: "Lato-bold"; */
  font-weight: 600;
  margin: 0 5px 0 7.5px;
}

/* new table design */
.table-primary-3--style-3 thead {
  background: transparent;
}
.table-primary-3--style-3 thead tr th {
  color: var(--primary-200);
  border-bottom: 1px solid var(--primary-200);
}
.table-primary-3--style-3 thead tr th:nth-child(2),
.table-primary-3--style-3 tbody tr td:nth-child(2) {
  text-align: center;
}
.table-primary-3--style-3 tbody tr td:nth-child(2) {
  text-align: center;
  font-weight: 500;
}
.bg-wgt{
  background-color: rgba(221, 221, 221, 1);
  padding: 5px 7px;
  border: 1px solid #888888;
  border-radius: 3px !important;
  min-width: 40px;
  display: inline-block;
  font-size: 13px;
  font-weight: bold;
}
.apexcharts-canvas {
  margin: 0 auto;
}
.table-primary-3--style-3 tbody tr td {
  border-bottom: 1px solid #cdcdcd70;
  padding: 10px 10px;
}

.table-primary-3--style-3 tbody tr:last-of-type td {
  font-size: 16px;
  font-weight: 700;
  border-bottom: 0;
  color: var(--dark-200);
}
.table-primary-3--style-3 tbody {
  margin-top: 0;
}
.table-primary-3--style-3 thead th,
.table-primary-3--style-3 tbody td,
.table-primary-3--style-3 tfoot td {
  width: 40%;
  font-size: 16px;
  line-height: 31px;
}
.table-primary-3--style-3 th:last-of-type,
.table-primary-3--style-3 td:last-of-type {
  width: 12%;
  padding-right: 0 !important;
}
.table-primary-3--style-3 tbody {
  max-height: calc(100vh - 445px);
}
/* graph legend design */
.apexcharts-legend.apx-legend-position-bottom .apexcharts-legend-series,
.apexcharts-legend.apx-legend-position-top .apexcharts-legend-series {
  display: flex !important;
  align-items: center;
  width: 40%;
  margin-bottom: 8px !important;
}
.apexcharts-legend.apx-legend-position-bottom.apexcharts-align-left,
.apexcharts-legend.apx-legend-position-top.apexcharts-align-left,
.apexcharts-legend.apx-legend-position-right,
.apexcharts-legend.apx-legend-position-left {
  margin-top: 20px;
}
.apexcharts-legend-marker {
  border-radius: 4px !important;
  margin-right: 11px;
}
.apexcharts-legend-text {
  margin-left: 5px !important;
  padding-left: 0 !important;
}
/* acceptance page btn design */
.role-agree__btns {
  width: 85%;
  flex-direction: column;
  margin: 20px auto 15px auto;
}
.role-agree .role-agree__btns{
  width: auto;
}
.role-agree .role-agree__btns button{
  text-align: center;
}
.role-agree__btns button {
  display: block;
  margin: 0 0 20px 0;
  text-align: left;
}
.role-agree__btns button:last-of-type {
  margin-bottom: 0;
}
.role-agree__btns .btn {
  position: relative;
}
.role-agree__btns .btn .before-hover,
.role-agree__btns .btn .after-hover {
  position: absolute;
  right: 10px;
  top: 30%;
  transform: translateX(-50%);
}
.btn .before-hover {
  display: inline-block;
}
.btn .after-hover {
  display: none;
}
.btn:hover .before-hover {
  display: none;
}
.btn:hover .after-hover {
  display: inline-block;
}

/* raise flag modal design */
.discusion-modal .modal--header {
  padding-bottom: 30px;
  border-bottom: 1px solid #cdcdcd;
}
.modal-subtitle {
  font-size: 12px;
  line-height: 15px;
  margin: 7px 0 0 0;
  font-family: "Lato-regular";
  color: var(--dark-100)b3;
}
form#comment_form {
  margin-top: 20px !important;
}
.comment--radio {
  /* font-weight: normal; */
  color: #2e384d;
  font-size: 16px;
  font-family: "Lato-regular";
  line-height: 18px;
  margin-bottom: 0;
}
.discusion-modal .modal-content .modal-body--style-2 {
  align-items: flex-start !important;
  padding: 0;
}
.discusion-modal .response_btn {
  padding: 9px 15px;
}
.discusion-modal .modal-body--style-2 .modal-body {
  text-align: left;
}
.modal-body--style-2 .modal--comment {
  padding: 0;
}
.discusion-modal .modal-content {
  width: 513px;
  padding: 33px 27px;
}
#comment_form > div {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 15px;
  position: relative;
}
.comment_footer .btn {
  text-align: left;
  position: relative;
}
input[type="radio"],
input[type="checkbox"] {
  margin: 0;
}

/* arrow on btn type 2 */
/* .role-agree__btndiscuss::after {
  content: url(../../img/WhiteArrow.svg);
  position: absolute;
  right: 15px;
}
.botton_wrap_q .role-agree__btnyes::after {
  content: url(../../img/WhiteArrow.svg);
  display: inline-block !important;
  position: absolute;
  right: 15px;
}
.role-agree__btndiscuss:hover::after {
  content: url(../../img/icon/orangerightArrow.svg);
}
.role-agree__btnyes:hover::after {
  content: url(../../img/icon/greenrightArrow.svg);
} */
/* status summary for role acceptance page */
.status-summary {
  display: flex;
  align-items: center;
  padding: 10px 15px;
  margin-bottom: 5px;
}
.status-summary p {
  font-size: 16px;
  line-height: 19px;
  color: var(--dark-100);
  margin: 0 0 0 15px;
  font-family: "Lato-regular";
}
.flagged-discussion {
  background-color: #FFC43033;
}
.role-accpted {
  background-color: #18A26C33;
}
.status-summary img {
  height: 20px;
}
.modal_dynamic .new_comment {
  margin: 0;
}
.discusion-modal input[type="radio"] {
  opacity: 0;
}

.response_modal .custom-input .action {
  background: var(--primary-200b);
}
.discusion-modal .custom-input .action {
  width: 30%;
  background: transparent;
}
.discusion-modal .custom-input .action .cus-radio {
  background: var( --primary-200b);
}
.discusion-modal .comment_footer {
  margin-top: 25px;
}
.discusion-modal .modal-subtitle {
  font-size: 16px;
}
.discusion-modal #comment_form > div {
  align-items: flex-start;
}
.discusion-modal .custom-input .cus-radio,
.response_modal .custom-input .cus-radio {
  border: 0 none;
}
.discusion-modal .custom-input input[type="radio"],
.response_modal .custom-input input[type="radio"] {
  position: absolute;
  width: 100%;
  opacity: 0;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1;
  cursor: pointer;
  margin: 0;
}
.discusion-modal
  .custom-input
  input[type="radio"]:checked
  ~ span.action
  > .cus-radio,
.response_modal
  .custom-input
  input[type="radio"]:checked
  ~ span.action
  > .cus-radio {
  background: var( --primary-200);
  border: 2px solid var( --primary-200);
}

.discusion-modal
  .custom-input
  input[type="radio"]:checked
  ~ span.action
  > .cus-radio:before,
.response_modal
  .custom-input
  input[type="radio"]:checked
  ~ span.action
  > .cus-radio:before {
  top: 8px;
  left: 1px;
  width: 6px;
  -webkit-transform: rotate(44deg);
  -moz-transform: rotate(44deg);
  -ms-transform: rotate(44deg);
  -o-transform: rotate(44deg);
  transform: rotate(44deg);
}
.discusion-modal
  .custom-input
  input[type="radio"]:checked
  ~ span.action
  > .cus-radio:after,
.response_modal
  .custom-input
  input[type="radio"]:checked
  ~ span.action
  > .cus-radio:after {
  top: 6px;
  left: 3px;
  width: 12px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.discusion-modal
  .custom-input
  input[type="radio"]:checked
  ~ span.action
  > .cus-radio:before,
.custom-input input[type="radio"]:checked ~ span.action > .cus-radio:after,
.response_modal
  .custom-input
  input[type="radio"]:checked
  ~ span.action
  > .cus-radio:before,
.custom-input input[type="radio"]:checked ~ span.action > .cus-radio:after {
  content: "";
  position: absolute;
  height: 2px;
  background: var(--white);
}
.discusion-modal #comment_form .comment--radio {
  margin-left: 25px;
  width: 70%;
}
.discusion-modal .modal-content div[class^="modal_dynamic"] {
  height: auto;
}
.table-primary-3--style-3 tbody tr:last-of-type td {
  font-weight: 400;
}
.table-primary-3 tfoot tr td {
  font-size: 16px;
  font-weight: 700;
  border-bottom: 0;
  color: var(--primary-200);
  padding: 10px;
  border-top: 1px solid var(--primary-200a);
  font-family: "Lato-bold";
}
.collapse_tab:not(.active) img + img {
  display: none;
}
.collapse_tab.active img:last-of-type {
  display: block;
}
.collapse_tab.active img:first-of-type {
  display: none;
}
.collapse_tab.active img:only-child {
  display: block;
}
.kra-desc-table tfoot tr td {
  border-top: 0 none;
}
.role_list {
  list-style-type: none;
  padding: 0;
}
.role_list li {
  background-color: var(--grey-900);
  margin-bottom: 15px;
}
.role_list li:last-of-type {
  margin-bottom: 15px;
}
.role_list .role_list-item a {
  display: flex;
  padding: 15px;
}
.role_list .role_list-item .role-category-title {
  color: var(--dark-100);
  font-size: 16px;
  /* font-weight: 600; */
  font-family: "Lato-bold";
}
.role_list .status_btn {
  padding: 0;
}
.role_list .arrow-right {
  border: 0 none;
  background: transparent;
}
.role_list .fa {
  font: normal normal normal 20px/1 FontAwesome;
}
.role_list .arrow-right .fa-angle-right:before {
  color: var(--dark-100);
}
.card-header-tile {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
/* toaster design */
.toast:not(.showing):not(.show){
  z-index:0;
}
.toast {
  background-color: #cd455e;
  position: fixed;
  right: 30px;
  top: 16px;
  width: 320px;
  transform: translateY(-13px);
  padding: 10px;
  border-radius: 5px !important;
  z-index: 999;
  /* z-index: 0; */
}
.toast-body {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: flex-end;
  width: 100%;
  text-align: right;
  padding: 0;
}
.toast-body #validation_msg {
  text-align: left;
}
.toast-body .msg_content {
  width: 60%;
  font-size: 13px;
}
.toast-body img {
  margin-right: 10px;
  width: 35px;
  height: 35px;
}
.toast-error {
  color: #fff;
  font-size: 14px;
  display: flex;
  justify-content: flex-end;
}
.toast-success {
background-color: #51a351;
  position: fixed;
  right: 30px;
  top: 16px;
  width: 320px;
  transform: translateY(-13px);
  padding: 10px;
  border-radius: 5px !important;
  z-index: 999;
}
@media screen and (max-width: 1280px) {
  .toast {
    /* width: 39%; */
  }
  .teamdetail_wrap .teamlist_tab_wrap {
    /* width: 60.5%; */
    width: 50%;
    padding: 0 15px 0 0;
  }
  .teamdetail_wrap .teamlist_tab_wrap-right {
    width: 43%;
  }
  .role_accept-details-wrap .role_kras {
    width: 62%;
  }
  .role_accept-details-wrap .role-acceptance_rightblock_wrap {
    width: 35%;
  }
  .teamdetail_wrap{
    flex-direction: row;
    align-items: flex-end;
  }
  /* div#showempdata{
    height: calc(100vh - 380px);
  }
  .kra-desc-table.scrollTable tbody{
    height: calc(100vh - 557px);
  }
  .two-col-tabs .role_container {
    height: calc(100vh - 476px);
  }
  .two-col-tabs.add-new-role-col .role_form{
    height: calc(100vh - 480px);
  }
  .kra-hidden-block{
    height: calc(100vh - 485px);
  } */
  .total-duration span{
   width: calc(100% - 100px);
  }
  .collapse_tab_role .role-duration > .total-duration{
    width: 45%;
  }
  .two-col-tabs .role_text{
    padding-left: 10px;
  }
}
@media screen and (max-width: 1024px) {
  .role_date_picker .rc-new-role-allocation__field-item{
    width: 46%;
  }
  .toast {
    /* width: 60%; */
  }
  .card-header-tile span {
    width: 60%;
  }
  .rc-exception_kra_wgt-wrap .rc-exception-row-wrapper {
    max-height: calc(100vh - 400px);
  }
  .total-duration span::after{
  width: 10px;
  }
  .team-alocation-summary .total_members span{
    font-size: 30px;
  }
  .status--view .team-alocation-details{
    margin-left: 10px;
    padding-left: 10px;
  }
}
@media screen and (max-width: 991px) {
  .card-header-tile {
    flex-direction: column;
  }
  .toast {
    position: static;
    width: 100%;
    transform: translate(0);
  }
  .card-header-tile span {
    width: 100%;
  }
  .teamdetail_wrap{
    flex-wrap: wrap;
    flex-direction: column-reverse;
    align-items: flex-start;
  }
  .teamdetail_wrap .teamlist_tab_wrap-right {
    width: 100%;
  }
  .teamdetail_wrap .teamlist_tab_wrap{
    width:94%;
  }
  .role_accept-details-wrap .role_kras {
    width: 55%;
    padding: 10px 15px;
  }
  .role_accept-details-wrap .role-acceptance_rightblock_wrap {
    width: 40%;
  }
  .kra-desc-table.scrollTable tbody{
    height: auto;
  }
  .status--view .team-alocation-summary{
    width: auto;
  }
  .status--view .team-alocation-details{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-bottom:0;
  }
  .status--view .team-alocation-details{
    width: 100%;
  }
  .status--view .status--view-items{
    width: auto;
    margin-right: 10px;
    padding-right: 10px;
    margin-bottom: 5px;
    /* border-right: 1px solid #70707033; */
  }
  .status--view .status--view-items:last-child{
    border-right: 0 none;
  }
  .status--view-items .status-complete{
    margin: 0 5px;
  }
}

/* new page design for role accept details page*/
.role_accept-details-wrap {
  display: flex;
  justify-content: space-between;
}
.role_accept-details-wrap .role_kras {
  background: var(--white);
  width: 68%;
  height: calc(100vh - 160px);
}
.role_accept-details-wrap .role-acceptance_rightblock_wrap {
  /* background: var(--white); */
  width: 28%;
  height: calc(100vh - 160px);
  overflow-y: auto;
}
.role-acceptance_inner-block{
  padding: 10px 20px;
  background: var(--white);
  margin-right: 5px;
  overflow-x:hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* box-shadow: 0px 3px 46px #0000140d; */
}
.role_accept-details-wrap .table-primary-3--style-3 tbody {
  max-height: calc(100vh - 280px) !important;
  padding-right: 15px;
}
.role_accept-details-wrap .table-primary-3--style-3 tfoot tr td {
  border-top: 0;
}
.role_accept-details-wrap .table-primary-3--style-3 tfoot {
  border-top: 1px solid #00a56266;
}
.role_accept-details-wrap .table-primary-3--style-3 thead {
  border-right: 15px solid transparent;
}
.role_accept-details-wrap .table-primary-3--style-3 tfoot {
  border-right: 30px solid transparent;
}
.show_present {
  background: transparent;
  border: 0 none;
  padding: 0;
  font-size: 14px;
  line-height: 16px;
  font-family: "Lato-bold";
  /* font-weight: 600; */
  /* font-weight: 700; */
  color: rgba(23, 23, 23, 0.6);
  width: 100%;
}
.show_present::focus {
  box-shadow: 0 0 0 transparent;
}
@media screen and (max-width: 1280px) {
  .role_accept-details-wrap .role_kras {
    width: 62%;
  }
  .role_accept-details-wrap .role-acceptance_rightblock_wrap {
    width: 35%;
  }
}
/* css to hide calander icon on current role */
.show_present_text::before {
  display: none;
}
.dashboard_wrap {
  padding: 30px 21px 0 13px;
}
.show_confirmation .maintitle {
  font-size: 22px;
  line-height: 20px;
  font-family: "Lato-bold";
  margin-bottom: 15px;
}
.show_confirmation .subtitle {
  font-size: 14px;
  line-height: 20px;
  font-family: "Lato-medium";
  color: var(--dark-200);
}
.show_confirmation .modal-description {
  display: flex;
  flex-direction: column;
  margin-bottom: 27px;
}
/* .two-col-tabs.no-role-assigned .kra-hidden-block+#empkra .kra-desc-table{
  display: none !important;
}
.two-col-tabs:not(.no-role-assigned) .kra-hidden-block+#empkra .kra-desc-table{
  display: block !important;
} */

/* Exception page design starts here */
.section-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.kra-list-select-wrap {
  border-radius: 5px !important;
  background: #efefef80 !important;
  padding: 12px 20px;
}
.rc-exception-main.rc-exception-main_hr{
  height:calc(100vh - 120px);
}
.kra-list-select-wrap label {
  color: var( --primary-200);
  font-size: 14px;
  font-family: "Lato-bold";
  display: block;
  width: 100%;
  text-align: left;
  margin: 0;
}
.kra-list-select-wrap .select2-container .select2-selection--single {
  background: transparent !important;
}
.kra-list-select-wrap .select2-container .select2-selection--single {
  height: auto !important;
}
.kra-list-select-wrap
  .select2-container
  .select2-selection--single
  .select2-selection__rendered {
  line-height: 1.1 !important;
  padding: 0;
}
.kra-list-select-wrap
  .select2-container--default
  .select2-selection--single
  .select2-selection__placeholder {
  color: #2e384d;
}
.kra-list-select-wrap
  .select2-container--default
  .select2-selection--single
  .select2-selection__arrow
  b {
  border-width: 8px 8px 0 8px;
}
.kra-list-select-wrap #select2-search_kra_list-container {
  position: relative;
  padding-right: 55px;
  color: #2e384d;
}
.kra-list-select-wrap #select2-search_kra_list-container::before {
  content: url(../../img/icon/Search.svg);
  position: absolute;
  right: 28px;
  height: 20px;
  width: 20px;
}
.kra-list-select-wrap textarea {
  padding: 0;
  background: transparent;
  font-family: "Lato-regular";
  margin: 5px 0 0 0;
  border: none;
  overflow: auto;
  outline: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.kra-list-select-wrap textarea:hover,
.kra-list-select-wrap textarea:focus {
  border: 0 none;
  outline: 0;
}
.textarea-modal .kra-list-select-wrap textarea:focus-visible {
  outline: 0;
}
.kra-list-select-wrap
  .select2-container--focus
  #select2-search_kra_list-container::before,
.kra-list-select-wrap
  .select2-container--open
  #select2-search_kra_list-container::before {
  display: none;
}
.select2-container--default
  .select2-results__option--highlighted[aria-selected] {
  background-color: var(--white);
  color: var(--dark-100);
}
.select2-search--dropdown,
.select2-results {
  background-color: var(--white);
  color: var(--dark-100);
  font-family: "Lato-regular";
}
.dropdown-style-1 .dropdown-menu {
  width: 100%;
}
.dropdown-style-1 .dropdown-menu > li > a {
  font-family: "Lato-regular";
}
/* response modal new design */
.response_modal .modal-content div[class^="modal_dynamic"] {
  height: calc(100vh - 75px);
  padding: 0;
  align-items: flex-start;
  padding-right: 5px;
}
.response_modal .rc-comment-modal {
  margin-top: 50px;
  padding: 0 23px;
}
.response_modal .response-subtitle {
  text-align: left;
  font-size: 16px;
  font-family: "Lato-bold";
}
.response_modal .reposting_comment .tri {
  background: #ffd31c26;
  border: 0.3px dotted #987b02;
}
.response_modal .comment_holder_repo p {
  color: #ad690b;
  font-size: 15px;
  font-family: "Lato-semibold";
}
.response_modal .comment_holder_repo > div {
  flex-direction: column;
  text-align: left;
}
.response_modal .comment_holder_repo p.date {
  font-size: 11px;
  color: var(--dark-100);
  margin-top: 7px;
  font-family: "Lato-regular";
}
.response_modal .conclusion-title {
  text-align: left;
  font-size: 12px;
  font-family: "Lato-bold";
  color: var(--primary-200);
}
.response_modal .custom-input__label {
  font-family: "Lato-regular";
  font-size: 16px;
  line-height: 1;
  text-align: left;
  width: 90%;
}
.response_modal .kra-list-select-wrap {
  flex-direction: column;
}
textarea,
textarea:focus-visible {
  outline: 0;
}
.response_modal .kra-list-select-wrap textarea {
  background: transparent;
  padding: 0;
  border: 0 none;
  font-size: 16px;
  font-family: "Lato-regular";
  height: 100px;
}
.response_modal .btn-primary {
  width: auto;
  float: left;
}
.response_modal #comment_form > div.custom-input {
  align-items: flex-start;
}
.response_modal .btn-primary:hover .modal-btn-yes-white-arrow {
  display: none;
}
.response_modal .btn-primary:hover .modal-btn-yes-blue-arrow {
  display: inline-block;
}
#confirmation_role_popup .delete_status {
  display: inline-flex;
  align-items: center;
}
.delete_kra_confirm .modal-description {
  margin-bottom: 25px;
}
.delete_kra_confirm .delete_kra_actions {
  margin-top: 20px;
  display: flex;
  justify-content: center;
}
/* exceptions_kra_weightage page table new design */
.rc-exception_kra_wgt-wrap {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding: 30px 35px;
  height: calc(100vh - 215px);
}
.rc-exception_kra--left {
  width: 70%;
}
.rc-exception_kra--right {
  width: 27%;
}
.rc-exception_kra--right .form-control--text-area__title{
  color: var(--primary-200);
  padding-left:0;
}
.rc-exception_kra--right .submit-kra-btn {
  /* background:var(--red-200);
  border:1px solid var(--red-200); */
  width: auto;
  text-align: left;
  font-size: 14px;
  line-height: 17px;
}

.rc-exception_kra--right .submit-kra-btn[disabled]:hover{
  cursor: not-allowed;
}
.rc-exception_kra_wgt-wrap .rc-exception-row-wrapper {
  max-height: calc(100vh - 360px);
  overflow-y: auto;
  padding-right: 15px;
}
.rc-exception_kra_wgt-wrap .rc-exception-row-wrapper.rc-exception-div {
  max-height: calc(100vh - 390px);
  /* overflow-y: auto;
  padding-right: 15px; */
}
.rc-exception-row-wrapper .rc-exception-left {
  width: 75%;
}
.rc-exception-add-kra .rc-exception-row .mandatory-kra.form-control {
  background: transparent;
  border: 0 none;
  box-shadow: 0 0 0 transparent;
}
.rc-exception-add-kra .rc-exception-row .mandatory-kra.form-control:focus,
.rc-exception-add-kra .rc-exception-row .mandatory-kra.form-control:hover {
  box-shadow: 0 0 0 transparent;
}
#kra_weightage{
  padding: 10px 12px;
  border-radius: 5px !important;
  font-family: "Lato-bold";
}
#kra_weightage.kra-wgt{
  color: var(--primary-200);
  background: #18a26c1a;
}
#kra_weightage.err_kra_wgt {
  background-color: #c9353533;
  color: #9f1d35;
}

.rc-exception-add-kra .rc-exception-body .kra-wgt {
  font-family: "Lato-bold";
  display: inline;
}
.rc-exception_kra_wgt-wrap .error_wrap {
  width: 60%;
  display: flex;
  justify-content: flex-end;
}
.error_wrap .weightage-error-pop {
  width: 34%;
  margin-right: 20px;
}

.error_wrap .weightage-error-pop:last-of-type {
  border-left: 1px solid #c9353533;
  margin-right: 0;
  padding-left: 20px;
}
.error_wrap
  .weightage-error-pop[style="display: none;"]
  + .weightage-error-pop {
  width: 40%;
  margin-right: 0;
  border-left: 0 none !important;
}
.error_wrap .total_wgt-err {
  width: 30%;
}

.rc-exception_kra_wgt-wrap .error_wrap .com-error-popup__message {
  text-align: right;
  color: #9f1d35;
  font-family: "Lato-semibold";
  font-size: 14px;
}
.rc-exception_kra_wgt-wrap .rc-exception-row-footer {
  margin-right: 15px;
  align-items: flex-start;
  border-top:1px solid #15734E57;
}
.rc-exception-add-kra .rc-exception-row-footer .rc-exception-right{
  margin-top: 10px;
}
.rc-exception_kra_wgt-wrap .rc-exception-row-footer p{
  color: var(--primary-200);
}
.add-kra-confirm .subtitle {
  font-size: 18px;
  font-family: "Lato-bold";
  color: #54586e;
}
.add-kra-confirm .maintitle {
  letter-spacing: 0px;
  color: var(--dark-100);
  font-size: 16px;
  font-family: "Lato-medium";
}

.exception_comment_modal .modal-content {
  width: 512px;
}
.exception_comment_modal .modal-header {
  /* border-bottom: 1px dotted #cdcdcd; */
  margin-bottom: 20px;
}
.exception_comment_modal .modal-dynamic {
  height: calc(100vh - 265px);
  overflow-y: auto;
  padding: 0 20px;
}
.exception_detail-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "Lato-regular";
  margin-top: 32px;
  margin-bottom: 20px;
}
.exception_detail-header .exception-details_name {
  width: 40%;
}
.exception_detail-header > .exception-details_role {
  width: 42%;
}
.exception_detail-header > .exception-details_role .role_1{
  max-height: 42px;
  display: inline-block;
  overflow: hidden;
  /* white-space: nowrap; */
  text-overflow: ellipsis;
  width: calc(100%);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-family: "Lato-regular";
  text-align: left;
}
.exception_detail-header > .exception-details_date {
  width: 20%;
}
.exception-details p {
  margin-bottom: 0;
}
.exception-details_name {
  display: flex;
  align-items: center;
}
.exception-details_name .name {
  font-size: 14px;
  line-height: 17px;
  font-family: "Lato-bold";
}
.exception-details_name .name + span {
  display: block;
  font-size: 11px;
  line-height: 13px;
  font-family: "Lato-regular";
  color: #716f6f;
}
.exception-details_name .initial,
.commtent_list-item .initial {
  display: block;
  width: 33px;
  height: 33px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #f4f6fc;
  background-color: var(--brown);
  border-radius: 100% !important;
  margin-right: 10px;
  font-family: "Lato-semibold";
  line-height: 1;
  font-size: 17px;
}
.exception-details_role p {
  background: #f2efef;
  border: 1px solid #70707033;
  padding: 0px 8px;
  display: inline-block;
}
.exception-details_role img {
  width: 12px;
  height: 12px;
  margin-right: 7px;
}
.exception-details_role p {
  font-size: 14px;
  font-family: "Lato-bold";
  color: #333333;
  text-align: center;
  display: inline-flex;
  align-items: center;
}

.exception-details_date p {
  font-size: 14px;
  font-family: "Lato-bold";
  color: var(--dark-100);
  text-transform: capitalize;
  text-align: right;
}
.exception_assigned-roles {
  margin-bottom: 30px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.modal .exception_assigned-roles{
  margin-bottom: 0;
}
.exception_assigned-roles .exp-heading {
  width: 15%;
}
.exception_assigned-roles .exp-heading p {
  font-size: 12px;
  line-height: 15px;
  color: #343434;
  font-family: "Lato-semibold";
  margin-bottom: 0;
}
.exp_chain_view {
  width: 80%;
  display: flex;
}
.exp_chain_view .role_title {
  display: inline-block;
  position: relative;
  font-size: 13px;
  font-family: "Lato-regular";
  color: #343434;
  margin-right: 15px;
  margin-bottom: 0;
  width: 48%;
  white-space: break-spaces;
}
.exp_chain_view .role_title::before {
  content: "";
  display: inline-block;
  position: absolute;
  height: 5px;
  width: 5px;
  background-color: var(--dark-100);
  border-radius: 5px !important;
  top: -4px;
  left: 0;
}
/* .exp_chain_view .role_title:not(.hide):last-of-type::after{
  content:'';
  display:none;
}
.exp_chain_view .role_title.hide::after,.exp_chain_view .role_title.hide::before{
  display: none;
} */
.exp_chain_view .role_title::after {
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  width: calc(100% + 15px);
  height: 1px;
  background: repeating-linear-gradient(
    to right,
    rgba(0, 0, 0, 0.5) 0,
    rgba(0, 0, 0, 0.5) 1px,
    rgba(255, 255, 255, 0) 1px,
    rgba(255, 255, 255, 0) 2px
  );
}
.exp_chain_view .role_title:last-child::after {
  display: none;
}
.exp_log .tri {
  padding: 0;
  background: transparent;
}
.exp_log .acceptor_cmt,
.exp_log .acceptor_cmt_wrap {
  display: flex;
  flex-direction: column;
}
.exp_log .acceptor_cmt_wrap {
  width: 68%;
}
.exp_log .commtent_list-item {
  margin-bottom: 15px;
}
.acceptor_cmt {
  background: #fff9dd;
  border-radius: 7px !important;
  padding: 8px 15px;
  margin-top: 7px;
}
.acceptor_cmt_wrap .comment-heading {
  font-size: 14px;
  line-height: 15px;
  font-family: "Lato-bold";
  color: #383838;
  margin-bottom: 0;
}
.acceptor_cmt .kra_name {
  font-size: 14px;
  line-height: 16px;
  font-family: "Lato-bold";
  color: #ad690b;
  margin-bottom: 5px;
}
.acceptor_cmt .kra_wgt {
  font-size: 13px;
  font-family: "Lato-regular";
  color: #ad690b;
  margin-bottom: 0;
}
.acceptor_cmt .kra_wgt span.value {
  font-family: "Lato-bold";
  display: inline-block;
}
.allocator_reply_wrap {
  flex-direction: column;
  align-items: flex-end;
}
.reply_details {
  width: 66%;
}
.allocator_reply {
  background: var(--grey-900);
  font-style: italic;
  font-size: 15px;
  font-family: "Lato-regular";
  padding: 13px 18px;
  border-radius: 7px !important;
}
.comment_name.comment-heading.allocator_name {
  font-size: 14px;
  font-family: "Lato-bold";
  color: var(--dark-100);
}
.allocator_reply_details-wrap {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}
.allocator_reply_details-wrap .initial {
  margin-right: 0;
}
.allocator_reply_detail {
  flex-direction: column;
  align-items: flex-end;
  margin-right: 9px;
}
.allocator_reply_detail .date.comment-heading {
  font-size: 10px;
  line-height: 12px;
  font-family: "Lato-medium";
  color: var(--dark-100);
  margin-top: 5px;
}
.wgt_edited {
  margin-bottom: 15px;
}
.wgt_edited:last-child {
  margin-bottom: 0;
}
.acceptor_cmt,
.allocator_reply {
  position: relative;
}
.acceptor_cmt:after,
.allocator_reply::after {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-radius: 2px !important;
  border-style: solid;
  border-width: 15px;
}
.acceptor_cmt:after {
  border-color: transparent transparent transparent #fff9dd;
  bottom: -10px;
  left: 0;
}
.allocator_reply::after {
  border-color: transparent transparent transparent var(--grey-900);
  bottom: -10px;
  right: 0;
  transform: rotate(180deg);
}
.notification-icon {
  display: flex;
  justify-content: flex-end;
  background-color: #5d5d5d;
  color: var(--white);
  position: absolute;
  right:0;
  top: 2px;
  font-size: 12px;
  line-height:14px;
  font-family: "Lato-bold";
  text-transform: capitalize;
  padding:3px 5px 3px 8px;
  text-align:right;
}
.notification-icon img{
  display: none;
  height: 16px;
  width:18px;
  margin-right:5px;
}
.notification-icon::after,
.notification-icon::before {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-radius: 2px !important;
  border-style: solid;
  border-width: 15px;
  left: -16px;
}
.notification-icon.excp_badge {
  background-color: #5d5d5d;
}
.notification-icon.rej_badge {
  background-color: #9f1d35;
}
.notification-icon.flg_badge{
  background-color:#f7a028;
}
.notification-icon.accepted_badge{
  background-color: var(--primary-200);
}
.notification-icon.rej_badge::before {
  border-color: #9f1d35 transparent transparent transparent;
  top: 0px;
}
.notification-icon.rej_badge::after {
  border-color: transparent transparent #9f1d35 transparent;
  bottom: 0;
}
.notification-icon.excp_badge::before {
  border-color: #5d5d5d transparent transparent transparent;
  top: 0px;
}
.notification-icon.excp_badge::after {
  border-color: transparent transparent #5d5d5d transparent;
  bottom: 0;
}
.notification-icon.flg_badge::before {
  border-color: #f7a028 transparent transparent transparent;
  top: 0px;
}
.notification-icon.flg_badge::after {
  border-color: transparent transparent #f7a028 transparent;
  bottom: 0;
}
.notification-icon.accepted_badge::before {
  border-color: var(--primary-200) transparent transparent transparent;
  top: 0px;
}
.notification-icon.accepted_badge::after {
  border-color: transparent transparent var(--primary-200) transparent;
  bottom: 0;
}

.disclaimer_modal .modal-description {
  font-size: 16px;
  font-family: "Lato-regular" !important;
}
@media screen and (max-width:1200px){
  .rc-exception_kra--left {
    width: 60%;
  }
  .rc-exception_kra--right {
    width: 38%;
}
.role_accept-details-wrap {
    flex-wrap: wrap;
  }

  .rc-exception_kra_wgt-wrap {
    flex-wrap: wrap;
  }
  /* .rc-exception_kra--left,
  .rc-exception_kra--right {
    width: 100%;
  } */
  .rc-exception-add-kra .rc-exception-add-kra__error-popup {
    width: 100%;
  }
  /* .rc-exception_kra_wgt-wrap {
    height: auto;
  } */
  .rc-exception-main.rc-exception_kra--left{
    height: auto;
  }
  .add-new-role-col .role_form, .no-role-assigned .role_form{
    width: 45%;
  }
  .role_container{
    width: 45%;
  }
  .add-new-role-col .display_kra-wrap, .no-role-assigned .display_kra-wrap{
    width: 55%;
  }
  .two-col-tabs .role_text{
    width: 55%;
  }
  .two-col-tabs.add-new-role-col .role_text{
    width: 100%;
  }
  .joining_date{
    width: 100%;
  }
  .joining_date .rc-new-role-allocation__field-text{
    font-size:14px;
    line-height: 15px; 
  }
  .rc-new-role-allocation li.assignment-duration:last-of-type,
  .rc-new-role-allocation li.assignment-duration:first-of-type{
    width: auto;
  }
  .collapse_tab_role .role-duration > .total-duration{
    width: 42%;
  }
  .total-duration span::after{
    width:12px;
  }
}

@media screen and (max-width: 1024px) {
  .teamdetail_wrap .teamlist_tab_wrap-right {
    width: 39%;
  }
  .teamdetail_wrap .teamlist_tab_wrap{
    width: 44%;
  }
  .notification-icon{
    margin-bottom:5px;
    padding:2px 4px 4px 10px;
  }
  .role_container .collapse_tab_role .card-title-wrapper{
    flex-direction:row;
  }
 
  .joining_date .total-duration{
    width:47%;
  }
  .joining_date .total-duration span::after{
    width:15px;
  }
  .full-container {
    width: auto;
    margin: 0 calc(55px - 15px) 0px calc(100px + calc(33px - 15px));
  }
 
}
@media screen and (max-width: 920px) {
  .teamdetail_wrap {
    flex-wrap: wrap;
  }
  .teamdetail_wrap .teamlist_tab_wrap {
    width: 95%;
  }
  .teamdetail_wrap .teamlist_tab_wrap-right {
    width: 100%;
    margin-bottom: 10px;
  }
}

@media screen and (max-width: 1024px) and (min-width: 992px) {
  .full-container {
    width: auto;
    margin:  0 calc(15px - 5px) 0px calc(70px + calc(30px - 5px));
  }
  #showempdata {
    padding: 10px;
  }
  .two-col-tabs .role_text {
    width: 100%;
  }
  .two-col-tabs.no-role-assigned .role_form,
  .two-col-tabs .role_container {
    width: 100%;
  }
  .two-col-tabs .role_text {
    /* padding-left: 0; */
  }
}
@media screen and (max-width: 991px) {
  .rc-exception-main.rc-exception-main_hr{
    height: auto;
  }
  .full-container {
    width: auto;
    margin: 0 0 0 100px;
  }
  .two-col-tabs {
    margin-left: 0;
  }
  .two-col-tabs .role_text {
    width: 100%;
    border-left: 0 none;
    margin: 0;
    padding: 0;
  }
  .two-col-tabs.add-new-role-col .role_text {
    flex-wrap: wrap;
  }
  .two-col-tabs.add-new-role-col .role_form {
    width: 100%;
    height: auto;
    border-right: 0 none;
  }
  .add-new-role-col .display_kra-wrap {
    width: 100%;
    padding-left: 0;
    margin-top: 10px;
  }
  .two-col-tabs.no-role-assigned .role_form,
  .two-col-tabs .role_container {
    padding-left: 10px;
    padding-right: 10px;
    height: auto;
    width: 100%;
    border: 0 none;
  }
  .add-new-role-col .display_kra-wrap, .no-role-assigned .display_kra-wrap{
    padding-left: 0;
  }
  .no-role-assigned .display_kra-wrap {
    width: 100%;
  }
  .two-col-tabs.no-role-assigned .role_text {
    flex-wrap: wrap;
  }
  /* .teamdetail_wrap .teamlist_tab_wrap-right {
    width: 35%;
  }
  .teamdetail_wrap .teamlist_tab_wrap {
    width: 50%;
  } */

  .scrollTable tbody {
    max-height: initial;
  }
  .teamdetail_wrap .teamlist_tab_wrap-right {
    width: 100%;
    justify-content: flex-start;
  }
  .role_accept-details-wrap .role_kras {
    width: 55%;
    padding: 10px 15px;
  }
  .role_accept-details-wrap .role-acceptance_rightblock_wrap {
    width: 40%;
  }
 
    .rc-exception_kra--left,
  .rc-exception_kra--right {
    width: 100%;
  }
    .role_accept-details-wrap .role_kras,
  .role_accept-details-wrap .role-acceptance_rightblock_wrap {
    width: 100%;
    height:auto;
  }
  .total-duration span::after{
    width: calc(100% - 30px);
  }
  .joining_date .total-duration span::after{
    width: calc(100% - 8px - 20px);
  }
  .role_container .collapse_tab_role .card-title-wrapper {
    flex-direction: row;
  }
  .teamdetail_wrap .teamlist_tab_wrap {
    width: 94%;
}
}

@media screen and (max-width: 920px) {
  .teamdetail_wrap .teamlist_tab_wrap-right {
    width: 100%;
  }
}
@media screen and (max-width: 991px) {
  .full-container {
    width: auto;
    margin: -1px calc(20px - 15px) 0px calc(80px + calc(25px - 15px));
    padding: 5px 10px 0px 5px;
  }
 
}
@media screen and (max-width: 768px) {
  .full-container {
    width: 95%;
    margin: 0 auto;
    padding: 0;
  }
  .teamdetail_wrap .teamlist_tab_wrap {
    width: 85%;
  }
  .teamdetail_wrap .teamlist_tab_wrap-right {
    width: 100%;
    padding:0;
  }
  .teamdetail_wrap .teamlist_tab_wrap{
    padding:0;
  }
  .teamdetail_wrap+div{
    padding:0;
  }
  ul.role_holder .collapse_tab_role.active{
    padding: 15px;
  }
  .rc-role-allocation-body #showempdata{
    padding:10px;
  }
  .role_date_picker .rc-new-role-allocation__field-item{
    width:50%;
  }

  .rc-main-header .main-header .navbar-header {
    width: 80%;
  }
  .rc-banner__innercontent {
    right: 10px;
  }
  .rc-banner {
    background-position: bottom;
    height: 100px;
  }
  .rc-banner__innercontent {
    bottom: 10px;
  }
  .rc-banner__quote {
    font-size: 18px;
    line-height: 20px;
  }
  .rc-banner__quote-name {
    font-size: 14px;
    line-height: 16px;
  }
  .rc-main-header .main-header .navbar-nav {
    width: 100%;
    flex-wrap: nowrap;
    justify-content: space-between;
  }
  .header-with-right-nav .navbar-nav .user-manual-steps {
    width: 100%;
    margin-top: 5px;
  }

  .user-steps:not(.hide) + .latest-news {
    display: none;
}
  .rc-main-header .main-header .navbar-header .navbar-brand {
    width: auto;
  }
  
  .hero-banner__image {
    object-position: left;
  }

  .dashboard_wrap {
    padding: 10px 20px;
  }
  .welcome-text {
    font-size: 20px;
  }
  .role_list .role_list-item a {
    flex-wrap: wrap;
    position: relative;
    padding: 5px 8px;
  }

  .role_list .arrow-right {
    position: absolute;
    right: 21px;
    top: 50%;
    transform: translate(-50%);
  }
  .discusion-modal .modal-content{
    width: 100%;
  }

  
}
@media screen and (max-width: 767px) {
  .role_list .role_list-item a > div {
    display: flex;
    padding: 0;
  }
}
/* veerababu css */

.navbar-nav > li a:last-child {
  padding: 0;
  margin-right: 0;
}

.rc-main-header .main-header .navbar-header .navbar-brand img {
  /* width: 100%; */
  height: 100%;
}

.rc-main-header .main-header .navbar-header .navbar-brand {
  height: 40px;
}

.rc-exception-ExList,
.rc-exception-add-kra {
  height: calc(100vh - 50px);
}

.flagged-kras-table th,
.deleted-kras-table th {
  font-size: 16px;
  line-height: 19px;
  font-family: "Lato-semibold";
}

.flagged-kras-table td,
.deleted-kras-table td {
  font-size: 14px;
  line-height: 16px;
  font-family: "Lato-semibold";
}
@media screen and (max-width: 575px) {
  .collapse_tab_role .role-duration {
    flex-direction: column;
    align-items: flex-start;
  }
  .role-duration > div {
    width: 100%;
  }
  .role-duration > .total-duration {
    flex-direction: column;
    height: 50px;
    align-items: flex-start;
  }
  .total-duration span {
    height: 100%;
    width: 1px;
  }
  .total-duration span::after {
    height: 100%;
    width: 1px;
  }
  .total-duration span:first-of-type::before,
  .total-duration span:last-of-type::before {
    left: 0;
    display: none;
  }
  .total-duration span:first-of-type::after,
  .total-duration span:last-of-type::after {
    left: 4px;
  }
  .total-duration span:last-of-type::before {
    top: 100%;
  }
  .total-duration span::after {
    top: auto;
  }
  .exception_comment_modal .modal-content,
  .modal-content {
    width: 90% !important;
    left: 0;
    right: 0;
    margin: auto;
    height: auto;
    top:5%;
  }
  .modal-content div[class^="modal_dynamic"] {
      height: auto;
  }
  .exp-raised_emp_details {
    flex-wrap: wrap;
  }
  .exp-raised_emp_details div {
    width: 100%;
  }
  .collapse_tab_role .exception_assigned-roles .exp-heading {
    width: 100%;
    white-space: normal;
}
  .collapse_tab_role .exception_assigned-roles{
    flex-direction: column;
      align-items: flex-start;
  }
  .status--view .team-alocation-details{
    margin-left: 10px;
    padding-left: 10px;
  }
  .teamdetail_wrap .teamlist_tab_wrap-right{
    padding:0;
  }
  /* .status--view{
    flex-direction: column;
    align-items: flex-start;
    
  } */
}
@media screen and (max-width: 425px){
   .role_container .card-title.card-title--style-2 {
    width: 100%;
    margin-top: 20px;
}
  .role_container .role_rej_zh .card-title--style-2{
    width: 100%;
  }
.add-new-kra-table thead{
  border-right: 0 none;
}
.add-new-kra-table.scrollTable tbody{
  max-height: unset;
  padding-right: 0;
}
.add-new-kra-table thead th:nth-child(3), .add-new-kra-table tbody td:nth-child(3) {
    width: 12%;
}

/* .team_list .slick-slide {
    width: unset !important;
    margin-right: 7px;
} */
/* .teamdetail_wrap .teamlist_tab_wrap{
  width:185px;
} */
}
@media screen and (max-width: 420px) {
  .role_date_picker {
    flex-wrap: wrap;
  }
  .role_date_picker .rc-new-role-allocation__field-item {
    width: 100%;
  }
  ul.new_select-role li.rc-new-role-allocation__field-item.delete_next {
    flex-wrap: wrap;
    width: 100%;
  }
  ul.new_select-role li.rc-new-role-allocation__field-item .form-control-select,
  ul.new_select-role
    li.rc-new-role-allocation__field-item
    p.rc-new-role-allocation__field-title {
    width: 100%;
  }
  .role-main1,
  .role-main2,
  .role-main3,
  .role-main4 {
    width: 18%;
  }
 
}


@media screen and (min-width: 1367px) {
  .teamdetail_wrap .teamlist_tab_wrap {
    width: calc((170px * 4) + (10px * 4));
  }
}
@media screen and (min-width: 1400px){
  .teamdetail_wrap .teamlist_tab_wrap {
    width: calc((170px * 5) + (10px * 5) + 15px);

  }
}
@media screen and (min-width: 1600px){
  .teamdetail_wrap .teamlist_tab_wrap {
    width: calc((170px * 5) + (12px * 5));
  }
}
@media screen and (min-width: 1800px) {
  .teamdetail_wrap .teamlist_tab_wrap {
    width: calc(100% - 720px);
  }
}


@media screen and (max-width: 768px){
  .rc-main-header .main-header .navbar-header .navbar-brand {
      width: auto;
      height: 30px;
  }
  .myrole-dashboard .myrole_rightblock{
    height:auto;
    overflow-y: auto;
  }
  .rc-mis-table.table-primary-1.dataTable.no-footer{
    min-width: 700px;
  }
  .exp_list-table {
    min-width: 900px;
  }
  .role_list{
    overflow-y: auto;
  }
  .role_list .role_list-item{
    min-width: 900px;
  }

}
.icon_mandatory-kra {
  height: 12px;
  width: 12px;
  margin-left: 10px;
}
#comment_error{
  font-family: "Lato-regular";
}
.kra-heading {
  font-family: "Lato-semibold";
  font-size: 12px;
  /*position: absolute;*/
  top: 0;
}
.kra-heading img {
  margin-left: 5px;
}
.exp_view_wrap .kra-heading {
  margin-bottom: 0;
}
#existing_kra_comment_error {
  font-family: "Lato-regular";
}
.zo_add-kra-page .rc-exception-main {
  height: calc(100vh - 140px);
  overflow-y: visible;
}
.zo_add-kra-page .add-new-kra-table.scrollTable tbody {
  max-height: calc(100vh - 285px);
}
.zo_exception_kra_wgt-wrap {
  margin-top: 15px;
  height: calc(100vh - 120px);
}
.zo_exception_kra_wgt-wrap .rc-exception-main.rc-exception_kra--left {
  height: calc(100vh - 130px);
}
.zo_exception_kra_wgt-wrap .rc-exception-row-wrapper {
  max-height: calc(100vh - 250px);
}
@media screen and (max-width:991px){
   .zo_exception_kra_wgt-wrap,.rc-exception_kra_wgt-wrap {
    height: auto;
  }
  .zo_exception_kra_wgt-wrap .rc-exception-main.rc-exception_kra--left{
    height:auto;
  }
}
#comment_error {
  font-family: "Lato-regular";
}
/* .edit-role,
.delete_role_data {
  width: 60px;
  padding: 9px;
} */
.collapse_tab_role .rc-role-allocation-footer .edit-role{
  padding: 8px 23.5px;
}
.rc-admin-user-main{
  margin-top: 15px;
}
.show_role_data_modal .modal-content{
  width: 600px;
  min-height: 100vh;
  height: auto;
}
@media screen and (max-width:575px){
  .show_role_data_modal .modal-content{
    width:100%;
  }
}
.show_role_data_modal .roledata--table,
.show_transferModal .modal-body,
.show_repaModal .modal-body {
  padding: 25px 23px 15px 23px;
}

.show_role_data_modal .modal-content h4,
.show_repaModal .modal-content h4,
.show_transferModal  .modal-content h4,
.show_role_data_modal .form-group,
.show_repaModal .form-group,
.show_transferModal  .form-group{
  text-align: left;
}
.show_role_data_modal .modal-content #role-div  thead th:first-child{
  width: 30%;
}
.show_role_data_modal .modal-content #role-div .role_data_table  thead th:last-child,
.show_role_data_modal .modal-content #role-div .role_data_table tbody td:last-child{
  width: 28%;
  text-align: center;
}
.show_role_data_modal .modal-content #role-div .kra_data_table  thead th:last-child{
  width: 6%;
  text-align: center;
}

.show_role_data_modal .modal-content #role-div .kra_data_table tbody td:last-child{
  width: 12%;
  text-align: center;
}

.scrollTable.kra_data_table tbody{
  max-height: calc(100vh - 253px);
}
.scrollTable.kra_data_table thead th:last-of-type,
.scrollTable.kra_data_table tbody td:last-of-type{
  border-right: 10px solid transparent;
}
.roledata--table table tbody tr td:first-child {
  width: 43%;
}
.show_repaModal .modal-content,
.show_transferModal .modal-content{
  width: 600px;
}
.show_transferModal .select2-container .select2-selection--single{
  height: 35px !important;
  border-radius: 0 !important;
}
.show_transferModal .select2-selection__rendered {
    line-height: 28px !important;
    margin-top: 0 !important;
}
.show_transferModal .select2-container .select2-selection--single{
  background-color: #EFEFEF !important;
}
/* .exp-raised_emp_details {
    text-transform: capitalize;
} */
#reason_for_del_kra_error {
    text-align: left;
}
#comment_error,#kra_code_error ,#existing_kra_comment_error{
  text-align:left;
  font-family: "Lato-regular";
}
.rc-select-role-lists .rc-new-role-allocation__field-item {
    position: relative;
}
.rc-select-role-lists .role_error {
    /* position: absolute; */
    /* bottom: -15px; */
    /* right: 0; */
}
.role_error {
    color: red;
    font-size: 12px;
    font-family: "Lato-regular";
}
.text-red{
  text-align: left;
}
.rc-exception-main .add-new-kra-table .rc-details.kra_added-row-highlight td:last-child{
  display: table-cell;
  position: relative;
}
li:not(.rc_roleacceptor:first-child) .icon-role-accept--pink{
  display:none;
}
.rc_roleacceptor:first-child .icon-role-accept{
  display:none;
}
.rc_roleacceptor:first-child .icon-role-accept--pink{
  display:block;
}
.admin_role_accept{
  height: calc(100vh - 150px);
  overflow-y: auto;
}
.role_assignment {
    height: 100%;
    width: 100%;
    border: 1px solid #c6c6c6;
    text-align: center;
    display: flex;
    color: var(--black);
    font-family: 'Lato-regular';
    font-size: 20px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
} 

.lp-wrapper {
  font-family: "Lato-regular";
  /* padding-top: 20px; */
}
.lp-wrapper .welcome-text {
  margin-bottom: 5px;
}
.lp-wrapper .small {
  font-size: 10px;
  line-height: 12px;
}
.lp-two-col {
  display: flex;
  justify-content: space-between;
  height: calc(100vh - 170px);
  overflow-y: auto;
  padding-right: 5px;
}
.lp-two-col > div > .lp-section {
  box-shadow: 0px 3px 16px #3467ac26;
  border: 1px solid #7070703c;
  background:var(--white);
  padding: 22px;
  border-radius: 5px !important;
}
.lp-two-col .lp-left__wrapper {
  width: 26%;
}
.lp-two-col .lp-right__wrapper {
  width: calc(100% - (26% + 24px));
}
.performance_summary {
  display: flex;
}
.performance_summary > div:nth-child(2) {
  /* width: calc((100% / 3) - 30px); */
  border-right: 1px solid #70707033;
  border-left: 1px solid #70707033;
  padding: 0 35px;
  display: flex;
    flex-direction: column;
    justify-content: space-between;
    width:33%;
}
.performance_summary > div:nth-child(1) {
  padding-right: 10px;
  margin-right: 10px;
  width: 18%;
  display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.performance_summary > div:nth-child(3) {
  padding-left: 15px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.lp-section-title {
  color: var(--dark-100);
  font-size: 20px;
  line-height: 24px;
  font-weight: bold;
  margin: 0;
}
.lp-section-title.username {
  color: var( --primary-200);
  font-size: 20px;
  line-height: 24px;
  padding-bottom: 6px;
}
.text-blue {
  color: #0c51b0 !important;
}
.lp-section-subtitle {
  font-size: 14px;
  line-height: 17px;
  color: var(--dark-100)99;
}
.lp-section-subtitle b{
   color: var(--dark-100);
   font-family: "Lato-bold";
}
.lp-section-subtitle.emp_num,
.role-summary .lp-section-subtitle {
  font-size: 13px;
  line-height: 16px;
  color: var(--dark-200);
  opacity: 0.81;
}
.role-summary .lp-section-title {
  margin-bottom: 4px;
}
.lp-section-subtitle.location {
  opacity: 1;
}
.location span {
  font-weight: bold;
}

.user_summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.lp-two-col .lp-section.user_summary_wrapper {
  padding: 0;
  margin-bottom: 22px;
}
.user_summary_wrapper > div {
  padding: 22px;
}
.user_summary_wrapper > div:first-child {
  border-bottom: 1px dashed #70707033;
  position: relative;
}
.user_summary_wrapper > div:first-child::before ,
.user_summary_wrapper > div:first-child::after{
  content: "";
  display: inline-block;
  height: 19px;
  width: 13px;
  position: absolute;
  background: #eeee;
  border: 1px solid #70707033;
  
}
.user_summary_wrapper > div:first-child::before {
  bottom: -9px;
  left: -2px;
  border-left: 0;
  border-radius: 0 10px 10px 0px !important;
}
.user_summary_wrapper > div:first-child::after {
  border-radius: 10px 0px 0px 10px !important;
  bottom: -9px;
  right: -2px;
  border-right: 0 none;
}
.scale span {
  display: inline-block;
  background: var( --primary-200);
  color: var(--white);
  border-radius: 10px !important;
  font-size: 12px;
  line-height: 15px;
  padding: 3px 11px;
}
.assigned-roles {
  display: flex;
  justify-content: space-between;
}
.assigned-roles .role_heading {
  font-size: 13px;
  line-height: 16px;
  color: var(--dark-100);
  font-weight: bold;
  margin-right: 20px;
}
.assigned-roles .chain_view {
  width: 100%;
  display: flex;
  margin-top: 13px;
}
.additional-role-summary {
  display: flex;
  justify-content: space-between;
}
.additional-role-summary span {
  font-size: 13px;
  line-height: 16px;
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 5px;
}
.additional-role-summary span + p {
  font-size: 12px;
  line-height: 15px;
  text-transform: capitalize;
  margin-bottom: 0;
}
.additional-role-summary > div {
  width: 41%;
}
.additional-role-summary > div:first-child {
  position: relative;
  width: 48%;
  padding-right: 25px;
}
.additional-role-summary > div:first-child::before {
  position: absolute;
  content: "";
  right: 0;
  width: 1px;
  height: 100%;
  background: #70707033;
}
.lp-two-col > div > .lp-section.quote {
  position: relative;
  padding: 0;
}
.lp-two-col > div > .lp-section.quote img {
  width: 100%;
  height: 200px;
}
.quote-text {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 26px;
  line-height: 30px;
  color: var(--white);
  font-family: "Lato-semibold";
  text-align: right;
  left: 40px;
  right: 40px;
  /* width: 100%; */
  /* padding-left: 12px; */
}
.quote-text span {
  font-size: 22px;
  line-height: 30px;
  display: block;
}

.performance_info {
  width: calc(100% - 33.33%);
  float:left;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.performance_graph {
  width: 33.333%;
  height:auto;
  float:right;
  padding: 0 15px;
  position: relative;
}

.performance_info h2,
.performance_info p {
  margin: 0;
}
.performance_summary {
  margin-top: 20px;
}
.performance_info .performance-details {
  display: flex;
  align-items: center;
}
.performance_info section img {
  height: 30px;
  width: 30px;
  margin-right: 5px;
}
.performance_info .value {
  font-size: 38px;
  line-height: 46px;
  font-weight: bold;
}
.performance_info .value sup {
  font-size: 18px;
  /* font-family: "Lato-BoldItalic"; */
  top: -20px;
}
.performance-details {
  margin-top: 5px;
}
.performance-details p {
  font-size: 13px;
  line-height: 15px;
  font-weight: bold;
  color: var(--dark-100);
}
.top-performance {
  display: flex;
}
 .perf_score{
  font-size:18px;
  line-height: 33px;
  font-weight: bold;
}
.perf_score .value{
  font-size:38px;
  line-height: 46px;
}
.top-performer {
  height: 38px;
  width: 38px;
  border-radius: 38px !important;
  background: var(--brown);
  margin-right: 7px;
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
}
.performance_info-wrapper {
  /* display: flex; */
  margin-bottom: 20px;
}
/* .performance_graph {
  height: 135px;
  width: 180px;
  position: relative;
} */
/* #performance_chart {
  position: absolute;
  top: 50%;
  transform: translateY(-54%);
} */
.lp-two-col > div > .lp-section.performace_detail {
  padding: 0;
}
.pd_header {
  background: var(--primary-200);
  background-image: url(../../img/green-bg.png);
  color: var(--white);
  padding: 29px 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.pd_header .lp-section-title,
.pd_header .lp-section-subtitle {
  color: var(--white);
}
.pd_header .lp-section-subtitle {
  margin-top:6px;
  margin-bottom: 0;
}
.performance_duration {
  width: auto;
  padding: 5px 9px;
  background: #f4f4f4;
  border: 1px solid #7070705f;
  border-radius: 3px !important;
  color: var(--dark-100);
  font-size: 11px;
  line-height: 13px;
  margin-left: 25px;
}
.performance_duration:focus-visible {
  outline: 0 none;
}
.pd_body {
  display: flex;
  flex-wrap: wrap;
  padding: 19px 30px;
  justify-content: space-between;
}
.pd_body > .kra-list {
  width: calc((100% / 4) - 4px);
  display: flex;
}
.kra-score {
  font-size: 22px;
  line-height: 27px;
  font-weight: bold;
  margin: 0;
}
.kra-score-detail {
  font-size: 13px;
  line-height: 16px;
  font-weight: bold;
  margin-bottom: 2px;
}
.kra-name {
  font-size: 12px;
  line-height: 13px;
  font-weight: normal;
}
.progress.vertical {
  position: relative;
  width: 7px;
  height: 100%;
  box-shadow: 0 0 0 transparent;
}
.pd_body .kra-bar + section {
  width: 100%;
}
.pd_body > .kra-list:nth-child(n + 5) {
  margin-top: 30px;
}
.progress.vertical > .progress-bar {
  border-radius: 5px 5px 0 0 !important;
}
.per-title {
  /* bottom: -18px;
  right: 0;
  position: absolute; */
  margin: 0;
  text-align:center;
}
.score {
  position: absolute;
  top: 50%;
  transform: translate(52%, 38%);
  right: 50%;
  font-size: 16px;
  line-height: 17px;
  margin: 4px 0 0 0;
}
.score span {
  font-weight: bold;
}
.text-green sup{
  position: relative;
}
.text-green sup::after{
  content: "";
    position: absolute;
    /* border-style: solid; */
    /* border-width: 10px 0 10px 11px; */
    /* border-color: transparent transparent transparent #0c56bb; */
    bottom: -18px;
    right: -55px;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #146f4c;
}
.text-red sup{
  position: relative;
}
.text-red sup::after{
  content: "";
    position: absolute;
    /* border-style: solid; */
    /* border-width: 10px 0 10px 11px; */
    /* border-color: transparent transparent transparent #0c56bb; */
    bottom: -25px;
    right: -55px;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #9e1e36 ;
}
.performace_detail label {
  font-size: 14px;
  line-height: 14px;
}
.performance_duration {
  font-size: 14px;
  line-height: 13px;
}
.performance_summary .text-red{
  color: #9e1e36 !important;
}
.lp-two-col > div > .lp-section.performance-container{
  /* padding-left: 15px;
  padding-right: 15px; */
  padding:0;
}
.performance-container .row{
  display: flex;
  margin:0;

}
/* #performance_chart{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
} */
@media screen and (min-width: 1025px) and (max-width:1280px){
  .lp-two-col .lp-right__wrapper {
    width: calc(100% - (29% + 24px));
}
.lp-two-col .lp-left__wrapper {
  width: 29%;
}
#performance_chart{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.performance_summary > div:nth-child(1){
  width: 25%;
}
}
@media screen and (min-width: 1360px) {
  .lp-two-col .lp-left__wrapper {
    /* background-color: red; */
    width:27%;
  }
  .lp-two-col .lp-right__wrapper {
    width: calc(100% - (27% + 24px));
  }

  .lp-section-title.username {
    font-size: 22px;
    line-height: 26px;
  }
  .performance_info .value {
    font-size: 48px;
    line-height: 58px;
    font-weight: bold;
  }
  .performance-details p {
    font-size: 18px;
    line-height: 22px;
    font-weight: bold;
    color: var(--dark-100);
  }
  #performance_chart{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
  .lp-section-title {
    color: var(--dark-100);
    font-size: 22px;
    line-height: 26px;
    font-weight: bold;
    margin: 0;
  }
  .lp-section-subtitle {
    font-size: 20px;
    line-height: 24px;
  }
  .lp-section-subtitle.emp_num,
  .role-summary .lp-section-subtitle {
    font-size: 16px;
    line-height: 20px;
    color: var(--dark-200);
    opacity: 0.81;
  }
  .lp-section-subtitle.emp_num{
    margin-bottom: 0;
  }
  .assigned-roles .role_heading {
    font-size: 20px;
    line-height: 24px;
    color: var(--dark-100);
    font-weight: bold;
    margin-right: 20px;
}
.additional-role-summary span {
    font-size: 16px;
    line-height: 20px;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 5px;
}
.scale span {
    display: inline-block;
    background: var( --primary-200);
    color: var(--white);
    border-radius: 10px !important;
    font-size: 20px;
    line-height: 33px;
    padding: 3px 11px;
}
.quote-text {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 28px;
    line-height: 39px;
    color: var(--white);
    font-family: "Lato-semibold";
    text-align: right;
    left: 40px;
    right: 40px;


}
.performance_info section img {
    height: 45px;
    width: 45px;
    margin-right: 5px;
}
.user_summary{
  margin-bottom:10px;
}
.lp-section-title.primary-role{
  margin-top: 6px;
}
.additional-role-summary span + p {
    font-size:16px;
    line-height: 24px;
    text-transform: capitalize;
    margin-bottom: 0;
}
/* .performance_graph {
    height: 200px;
    width: 200px;
    position: relative;
} */
.performance_info .lp-section-title{
  margin-bottom: 10px;
}
.performance_summary {
    margin-top: 29px;
}
.pd_header .lp-section-subtitle {
    margin-bottom: 9px;
}
.assigned-roles{
  margin:21px 0 23px 0;
}
.perf_score{
  font-size:28px;
  line-height: 33px;
}
.perf_score .value{
  font-size:57px;
  line-height: 68px;
}
.per-title {
    /* bottom: -11px;
    right: 0;
    position: absolute; */
    margin: 0;
    font-size: 21px;
    line-height: 25px;
}
.pd_header .lp-section-title{
  margin-bottom: 9px;
}
.performance_duration {
  font-size: 17px;
  line-height: 20px;
  
}
.performace_detail label{
  font-size: 20px;
  line-height:22px;
}
.performance_info {
    /* width: calc(100% - 220px); */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 22px;
}
.kra-score {
    font-size: 30px;
    line-height: 36px;
    font-weight: bold;
    margin: 0;
}
.kra-score-detail {
    font-size: 18px;
    line-height: 22px;
    font-weight: bold;
    margin-bottom: 2px;
}
.kra-name {
    font-size: 16px;
    line-height: 22px;
    font-weight: normal;
}
.performance_summary > div:nth-child(1) {
  padding-right: 10px;
  margin-right: 10px;
  width: 28%;
}
.performance_summary > div:nth-child(2) {
  width:38%;
}
.performance_summary > div:nth-child(2) br,
.performance_summary > div:nth-child(3) br{
  display:none;
}
.performance_summary > div:nth-child(3){
  width:23%;
}       
.performance_info .value sup {
  font-size: 32px;
  line-height: 40px;
  /* font-family: "Lato-BoldItalic"; */
  top: -16px;
  left: 6px;
}
.lp-wrapper .welcome-text{
  font-size: 25px;
  line-height: 31px;
}
.score {
  position: absolute;
  top: 50%;
  transform:translate(60%, 30%);
  right: 50%;
  font-size: 24px;
  line-height: 29px;
  margin: 4px 0 0 0;
}
.performance_summary > div:nth-child(2) {
 
  padding: 0 22px;
}

/* .sidebar-mini.sidebar-collapse .main-sidebar{
  top: 55px;
} */
}
@media screen and (min-width: 1400px){
  #sidebar-wrapper .sidebar-nav .menu-icon img{
    height: 21px;
  }
  .sidebar-wrapper .sidebar-nav .menu-icon {
    width: 39px;
    height: 39px;
  }
  .rc-iobmicrosite p{
    font-size: 12px !important;
  }
  .rc-main-header .main-header .navbar-header .navbar-brand {
    height: 45px;
  }
  .performance_info {
    width: calc(100% - 33.33%);
    float:left;
    padding: 22px;
  }
  .performance_graph {
    width: 33.33%;
    float:right;
    padding: 0 15px;
    position: relative;
  }
}
@media screen and (min-width: 1600px) {
  .lp-two-col .lp-left__wrapper {
    /* background-color: red; */
    width:30%;
  }
  .lp-two-col .lp-right__wrapper {
    width: calc(100% - (30% + 24px));
  }

  .lp-section-title.username {
    font-size: 30px;
    line-height: 36px;
  }
  .performance_info .value {
    font-size: 57px;
    line-height: 68px;
    font-weight: bold;
  }
  .performance-details p {
    font-size: 18px;
    line-height: 22px;
    font-weight: bold;
    color: var(--dark-100);
  }
  .lp-section-title {
    color: var(--dark-100);
    font-size: 30px;
    line-height: 36px;
    font-weight: bold;
    margin: 0;
  }
  .lp-section-subtitle {
    font-size: 20px;
    line-height: 24px;
  }
  .lp-section-subtitle.emp_num,
  .role-summary .lp-section-subtitle {
    font-size: 20px;
    line-height: 24px;
    color: var(--dark-200);
    opacity: 0.81;
  }
  .lp-section-subtitle.emp_num{
    margin-bottom: 0;
  }
  .assigned-roles .role_heading {
    font-size: 20px;
    line-height: 24px;
    color: var(--dark-100);
    font-weight: bold;
    margin-right: 20px;
}
.additional-role-summary span {
    font-size: 20px;
    line-height: 24px;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 5px;
}
.scale span {
    display: inline-block;
    background: var( --primary-200);
    color: var(--white);
    border-radius: 10px !important;
    font-size: 20px;
    line-height: 33px;
    padding: 3px 11px;
}
.quote-text {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 35px;
    line-height: 49px;
    color: var(--white);
    font-family: "Lato-semibold";
    text-align: right;
    left: 40px;
    right: 40px;
    /* width: 100%; */
    /* padding-left: 157px; */

}
.performance_info section img {
    height: 45px;
    width: 45px;
    margin-right: 5px;
}
/* .user_summary{
  margin-bottom:30px;
} */
.lp-section-title.primary-role{
  margin-top: 6px;
}
.additional-role-summary span + p {
    font-size: 20px;
    line-height: 24px;
    text-transform: capitalize;
    margin-bottom: 0;
}
/* .performance_graph {
    height: 200px;
    width: 200px;
    position: relative;
} */
.performance_info .lp-section-title{
  margin-bottom: 10px;
}
.performance_summary {
    margin-top: 29px;
}
.pd_header .lp-section-subtitle {
    margin-bottom: 9px;
}
.assigned-roles{
  margin:21px 0 23px 0;
}
.perf_score{
  font-size:28px;
  line-height: 33px;
}
.perf_score .value{
  font-size:57px;
  line-height: 68px;
}
.per-title {
    /* bottom: -11px;
    right: 0;
    position: absolute; */
    margin: 0;
    font-size: 21px;
    line-height: 25px;
}
.pd_header .lp-section-title{
  margin-bottom: 9px;
}
.performance_duration {
  font-size: 19px;
  line-height: 23px;
  
}
.performace_detail label{
  font-size: 22px;
  line-height:24px;
}
.performance_info {
    /* width: calc(100% - 220px); */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding:22px;

}
.kra-score {
    font-size: 33px;
    line-height: 40px;
    font-weight: bold;
    margin: 0;
}
.kra-score-detail {
    font-size: 20px;
    line-height: 24px;
    font-weight: bold;
    margin-bottom: 2px;
}
.kra-name {
    font-size: 18px;
    line-height: 26px;
    font-weight: normal;
}
.performance_summary > div:nth-child(1) {
  padding-right: 10px;
  margin-right: 10px;
  width: 28%;
}
.performance_summary > div:nth-child(2) {
  width:33%;
}
.performance_summary > div:nth-child(2) br,
.performance_summary > div:nth-child(3) br{
  display:none;
}
.performance_summary > div:nth-child(3){
  width:23%;
}       
.performance_info .value sup {
  font-size: 32px;
  line-height: 40px;
  /* font-family: "Lato-BoldItalic"; */
  top: -16px;
  left: 6px;
}
.lp-wrapper .welcome-text{
  font-size: 25px;
  line-height: 31px;
}
.score {
  position: absolute;
  top: 50%;
  transform: translate(0%, 30%);
  right: 50%;
  font-size: 24px;
  line-height: 29px;
  margin: 4px 0 0 0;
}
.performance_summary > div:nth-child(2) {
 
  padding: 0 22px;
}
.performance_info .performance-details{
  margin-top: 10px;
}
}
@media screen and (max-width:1366px){
  #performance_chart{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
  .performance_summary > div:nth-child(n){
    width: 33%;
    padding: 0 10px;
  }
  .performance_summary > div:nth-child(2){
    width: 45%;
  }
}
@media screen and (max-width: 1024px){
  /* .lp-two-col .lp-left__wrapper {
    width: 38%;
}
  .lp-two-col .lp-right__wrapper {
    
    width: calc(100% - (38% + 24px));
} */
  /* .performance-container .row {
    flex-direction: column;
    align-items: center;
  } */
  /* .performance_info{
    width: 100%;
  } */
  /* .performance_graph{
    width: 50%;
  } */
  .performance_summary > div:nth-child(n){
    width: 54%;
    padding: 0 10px;
  }
  .pd_header{
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
  }
  .pd_header>div:nth-child(2){
    margin-top:10px;
  }
}
@media screen and (max-width: 1024px){
  
  .lp-two-col{
    flex-direction: column;
    /* height: auto;
    overflow-y: visible; */
  }
  .lp-left__wrapper{
    display: flex;
    align-items: stretch;
  }
  .lp-two-col .lp-left__wrapper,
  .lp-two-col .lp-right__wrapper {
    width: 100%;
  }
  .lp-two-col > div > .lp-section.quote{
    margin-left: 15px;
    margin-bottom: 22px;
  }
  .lp-two-col > div > .lp-section.quote,
  .lp-two-col .lp-section.user_summary_wrapper{
    width: calc(50% - 5px);
  }
  .lp-two-col > div > .lp-section.quote img {
    width: 100%;
    height: 100%;
  }
  .performance_info {
    width: calc(100% - 33.33%);
  }
  .performance_graph {
    width: 33.333%;
  }
  .performance-container .row {
    flex-direction: row;
    /* align-items: center; */
  }
}
@media screen and (max-width:991px){
  .lp-two-col {
    
    height: auto;
    overflow-y: visible;
}
}
@media screen and (max-width:768px) {
  .performance_summary{
    flex-direction: column;
  }
  
  .performance_summary > div:nth-child(2),.performance_summary > div:nth-child(3){
    padding:0;
    border-left: 0 none;
    border-right: 0 none;
  }
  .performance_summary > div:nth-child(n) {
    width: 100%;
    flex-direction: row;
    justify-content: flex-start;
    padding:0;
  }
  .performance_summary > div h2{
    width: 40%;
  }
  .performance-container .row{
    flex-direction : column;
    align-items: center;
  }
  .performance_info{
    width: 100%;
  }
  .performance_graph{
    width: 70%;
  }
  #performance_chart{
    position: static;
    transform: translateY(0);
  }
}
@media screen and (max-width: 565px){
  .lp-two-col > div > .lp-section.quote, .lp-two-col .lp-section.user_summary_wrapper {
    width:100%;
}
.lp-left__wrapper {
  
  flex-direction: column;
}
.lp-two-col > div > .lp-section.quote {
  margin-left:0;
  margin-bottom: 22px;
}
.performance-container .row {
  flex-direction: column;
  align-items: center;
}
.performance_summary{
  flex-direction: column;
}
.performance_info{
  width: 100%;
}
.performance_graph{
  width: 70%;
}
#performance_chart{
  position: static;
  transform: translateY(0);
}
.performance_summary > div:nth-child(2),.performance_summary > div:nth-child(3){
  padding:0;
  border-left: 0 none;
  border-right: 0 none;
}
.performance_summary > div:nth-child(n) {
  width: 100%;
  flex-direction: row;
  justify-content: flex-start;
  padding:0;
}
.performance_summary > div h2{
  width: 40%;
}
.pd_body > .kra-list {
  width: 100%;
  margin-bottom: 5px;
}
.pd_body > .kra-list:nth-child(n + 5) {
  margin-top: 0;
}
}

/* design for notification modal */
.notif-list {
  padding: 10px 25px 10px 23px;
  height: calc(100vh - 150px);
  overflow-y: auto;
}
.notif-list li{
  border-bottom: 1px solid #70707033;
  display: flex;
  padding: 13px 0;
}
.notif-list .notif-item-icon{
  display:inline-block;
  width: 46px;
  height:46px;
  margin-right:13px;
}
.show_modal_notification .modal-body{
  text-align:left;
  padding:0;
}
.show_modal_notification .modal-content div[class^="modal_dynamic"]{
  padding:0;
  display: block;
}
.notif-item section {
  width: calc(100% - 43px);
}
.notif-item .notif-heading{
  font-size:16px;
  line-height: 19px;
  font-family:"Lato-bold";
  margin: 0 0 5px 0;
}
.notif-item .notif-detail{
  font-size:14px;
  line-height: 17px;
  font-family:"Lato-regular";
  margin: 0;
}
.noti-wrapper{
  display: flex;
  flex-direction: column;
  align-content: space-between;
  height: calc(100vh - 100px);
  flex-wrap: wrap;
  justify-content: space-between;
}
.view-all{
  text-align:center;
  padding:0;
}
.view-all .btn{
  color: var( --primary-200);
  padding:0;
}
.team_list .slick-track {
  height: 150px;
  max-width: 100%;
  display: flex;
}
.page-header{
  font-family: "Lato-regular";
  border-bottom: 0 none;
  padding-bottom: 0;
  margin: 15px 0 15px;
  display: inline-block;
  width:100%;
}
.page-header.rc-page-header{
  margin: 10px 0 0 0;
}
.page-header .emp-search{
  width:25%;
}
.page-header .emp-search .form-control{
  font-size: 15px;
  background: white;
  border-radius: 4px !important;
  padding: 7px 15px
}
.rc-page-header .page{
  margin-bottom:0;
}
.page-header ul{
  padding:0;
  list-style:none;
  display: flex;
  align-items: center;
  margin-bottom:11px;
}
.page-header .back_btn{
  background: var(--white);
  color:var(--dark-100);
  font-size: 11px;
  line-height: 13px;
  font-weight:900;
  padding: 9px 18px 9px 29px;
  border-radius:40px !important;
  align-items:flex-start;
  text-transform:uppercase;
  margin-right:18px;
  position: relative;
}
.page-header .back_btn::before{
  content: url(../../img/icon/leftArrow.svg);
  display: inline-block;
  width: 10px;
  left: 15px;
  top: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
}
.page-header h1{
  color: var( --primary-200);
  font-size: 25px;
  line-height:31px;
  font-weight: bold;
  margin-top:0;
  margin-bottom:0;
  display: flex;
  align-items: center;
}
.page-header p{
  color: var(--dark-100);
  font-size: 16px;
  line-height:19px;
  font-weight: regular;
  margin-top:8px;
  margin-bottom:8px;
}
.section-wrapper{
  border-radius: 7px !important;
  padding: 20px;
}
.error-message, .error {
  color: red;
  font-size: 13px;
  /* width: 100%; */
  /* display: inline-block; */
}
.section-wrapper .section-title{
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 10px;
}
.add_emp_form .form-group .form-label{
  font-size: 13px;
  color: var(--dark-100);
  /* font-family: "Lato-Medium"; */
}
.add_emp_form .form-group .form-control{
  border-radius: 4px !important;
  box-shadow: 0 1px 4px 0 #deecff;
  border: solid 1px #a5c9fc;
  background-color: #fff;
  padding: 7px 10px 7px 10px;
  box-shadow: none;
}
.add_emp_form .form-group .form-control.hasDatepicker{
  /* border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-right: 0; */
}
.form-control:disabled, .form-control[readonly]{
  background-color: rgba(175, 176, 176, 0.3) !important;
}
.add_emp_form .form-control{
  padding-right:40px;
  /* position: relative; */
}
.add_emp_form .date{
  position:relative;
  padding: 0;
}

.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
  overflow: auto !important;
}
.add_emp_form .date{
  position: relative;
}
.add_emp_form .date .input-group-text{
  background-color: #fff !important;
  border-top-right-radius: 4px !important;
  border-bottom-right-radius: 4px !important;
  border-color: #a5c9fc;
  border-left: 0;
}
.add_emp_form .date .input-group-text.disabled{
  background-color: rgba(175, 176, 176, 0.3) !important;
}
.add_emp_form .date .input-group-text.disabled i{
  opacity: 0.5;
}
.add_emp_form .input-group.datepicker .form-control {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.add_emp_form .date .fa-calendar:before {
  content: "\f133";
  color:var(--primary-200);
}
.add_emp_form{
  /* height: calc(100% - 20vh); */
}
.btn-primary{
  background-color: var(--primary-200);
  border-color: var(--primary-200);
}
input[type="date"] {
  position: relative;
}
.form-control,.btn{
  border-radius: 0 !important;
}
.radio label {
  padding-left: 18px;
  font-size: 14px;
}
.form-group .radio{
  margin-right: 20px;
}
.radio {
  position: relative;
}

input[type="radio"] {
  /* position: absolute; */
  /* opacity: 0; */
}

.conclusion{
  font: normal normal bold 12px/15px Lato;
letter-spacing: 0px;
color: #495BA0;
opacity: 0.7;
}

.checkmark {
  position: absolute;
  top: 4px;
  left: 0;
  height: 15px;
  width: 15px;
  border: 2px solid var(--primary-200);
  border-radius: 50% !important;
}

.radio:hover input~.checkmark {
  /* background-color: #ccc; */
}
/* .choose-position .select2-container {
  width: 100% !important;
}

.choose-position .select2-container--default .select2-selection--single {
  width: 100% !important;
  display: flex;
  align-items: center;
  padding: 0 30px;
  height: 50px;
  line-height: 50px;
  font-weight: 500;
  font-size: 16px;
  background-color: #fafafa;
  border: 1px solid #eeeeee;
  border-radius: 25px;
  transition: 0.1s;
}

.choose-position .select2-search {
  display: none;
}

.choose-position .select2-results__option {
  display: flex;
  align-items: center;
}

.choose-position .select2-results__option .img-flag {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  margin-right: 10px;
}

.choose-position .select2-container--default.select2-container--focus .select2-selection--single {
  border: 1px solid #c9c9c9 !important;
  outline: 0;
}

.choose-position span.select2-selection.select2-selection--single {
  outline: none;
}

.choose-position .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 35px;
  top: 50%;
  transform: translateY(-50%);
  right: 10px;
  width: 35px;
  background-color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 20px rgba(35, 49, 45, 0.14);
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  background-image: url(https://cdn4.iconfinder.com/data/icons/user-interface-174/32/UIF-76-512.png);
  background-color: transparent;
  background-size: contain;
  border: none !important;
  height: 20px !important;
  width: 20px !important;
  margin: auto !important;
  top: auto !important;
  left: auto !important;
}
.select2-container--default.select2-container--above .select2-selection--single .select2-selection__arrow b {
  background-image: url(https://cdn4.iconfinder.com/data/icons/user-interface-174/32/UIF-76-512.png);
  background-color: transparent;
  background-size: contain;
  border: none !important;
  height: 20px !important;
  width: 20px !important;
  margin: auto !important;
  top: auto !important;
  left: auto !important;
} */
.dropdown-toggle::after {
  font-family: FontAwesome;
  content: "\f107";
  color: var(--primary-200);
  display: inline-block;
  padding-right: 3px;
  vertical-align: middle;
  font-weight: 900;
  position: absolute;
  right:10px;
  top:8px;
  font-size: 16px;
  border:none;
}
.dropup .dropdown-toggle::after {
  font-family: FontAwesome;
  content: "\f106";
  color: var(--primary-200);
  display: inline-block;
  padding-right: 3px;
  vertical-align: middle;
  font-weight: 900;
  position: absolute;
  right:10px;
  top:6px;
  font-size: 16px;
  border:none;
}
.radio input:checked~.checkmark {
  border: 2px solid var(--primary-200);
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.radio input:checked~.checkmark:after {
  display: block;
}

.radio .checkmark:after {
  top: 1px;
  left: 1px;
  width: 9px;
  height: 9px;
  border-radius: 50% !important;
  background: var(--primary-200);
}
.dropdown-toggle::after {
  /* display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.4em solid var(--primary-200);
  border-right: 0.4em solid transparent;
  border-bottom: 0;
  border-left: 0.4em solid transparent; */
}
.bootstrap-select .dropdown-toggle:focus, .bootstrap-select>select.mobile-device:focus+.dropdown-toggle {
  /* outline: thin dotted #333!important; */
  outline: none!important;
  outline-offset: 0;
}
.bootstrap-select .dropdown-menu {
  min-width: 100%;
  background: #fff;
  box-shadow: 0px 3px 6px #D91A1A29;
  border: 1px solid #70707031;
  border-radius: 5px !important;
  padding: 10px;
} 
.bootstrap-select .dropdown-menu > li:first-of-type {
  margin-top: 10px;
}
.bootstrap-select .dropdown-menu > li {
  margin-top: 10px;
  font-family: "Lato", sans-serif;
  /* font-family: "Lato", sans-serif; */
  font-size: 14px;
}
.bootstrap-select .dropdown-menu.show {
  transition: unset;
} 
.add_emp_form .bootstrap-select>.dropdown-toggle {
  border-radius: 4px !important;
  box-shadow: 0 1px 4px 0 #deecff;
  border: solid 1px #a5c9fc;
  background-color: #fff;
  padding: 7px 10px 7px 10px;
  font-family: "Lato", sans-serif;
  font-size: 14px;
}
.rc-lp-two-col .lp-section{
  background: var(--white);
  box-shadow: 0px 3px 10px #1C724F21;
  border-radius: 3px !important;
  padding:15px 20px;
  font-family:"Lato-regular";
  margin-bottom: 25px;
  width: 100%;
}
/* .rc-lp-two-col .lp-section .zo-user-listing{
  box-shadow: 0 none;
  padding: 0;
} */
.rc-lp-two-col{
  display: flex;
  justify-content: space-between;
  height: calc(100vh - 200px);
  overflow-y: auto;
  padding:5px;

}
.rc-lp-two-col .lp-left__wrapper{
  width:68%;
}
.rc-lp-two-col .lp-right__wrapper{
  width:30%;
}
.rc-lp-two-col .section-title{
  color:var( --primary-200);
  font-size:20px;
  line-height:24px;
  font-family:"Lato-bold";
  margin-top:0;
  margin-bottom:10px;
}
.rc-lp-two-col .kra-sumary-wrap .section-title{
  margin-bottom:10px;
}
.card-left{
  width: 40%;
}
.card-right{
  width: 55%;
}
.lp-card{
  position: relative;
}
.lp-card .new-role{
  position:absolute;
  background: var(--red-200);
  padding: 1px 12px;
  color: var(--white);
  top:3px;
  right:0;
  font-size: 12px;
  line-height: 15px;
}

.lp-card .new-role-green{
  background: green !important;
  
}

.lp-card .new-role-green::after {
    border-color: transparent transparent green transparent !important;
    
}
.lp-card .new-role-green::before{
      border-color: green transparent transparent transparent !important;
}

.lp-card .new-role-blue{
     background: #495BA0 !important;
     
  
}

.lp-card .new-role-blue::after {
     border-color: transparent transparent #495BA0 transparent !important;
      border-width: 20px !important;
      left: -24px !important;
}
.lp-card .new-role-blue::before{
      border-color: #495BA0 transparent transparent transparent !important;
      border-width: 20px !important;
      left: -24px !important;
    }






.lp-card .new-role-yellow{
  background:#FFA51C !important;
  color: #333 !important;
  
}

.lp-card .new-role-yellow::after {
    border-color: transparent transparent #FFA51C transparent !important;
    
}
.lp-card .new-role-yellow::before{
      border-color:#FFA51C transparent transparent transparent !important;
}

.lp-card .new-role-black{
  background: #333 !important;
  color: #ffffff !important;
  
}

.lp-card .new-role-black::after {
    border-color: transparent transparent #333 transparent !important;
    
}
.lp-card .new-role-black::before{
      border-color: #333 transparent transparent transparent !important;
}




.lp-card .new-role::after,
.lp-card .new-role::before {
  content: "";
  display: block;
  position: absolute;
  width: 0;
  height: 0;
  border-radius: 2px !important;
  border-style: solid;
  border-width: 9px;
  left: -9px;
}
.lp-card .new-role::before {
  border-color: #C93535 transparent transparent transparent;
  top: 0px;
}
.lp-card .new-role::after {
  border-color: transparent transparent #C93535 transparent;
  bottom: 0;
}
.lp-card .main-role{
  color: var(--dark-100);
  font-size:17px;
  line-height:22px;
  font-family:"Lato-bold";
  margin-top:0;
  margin-bottom:0;
}
.lp-card .scale{
  color: var(--dark-100);
  font-size:14px;
  line-height:22px;
  font-family:"Lato-bold";
  margin-top:0;
  margin-bottom:0;
}
.lp-card .organization{
  color: var(--dark-100);
  font-size:13px;
  line-height: 22px;
  font-family:"Lato-regular";
  margin-top:0;
  margin-bottom:0;
}
.lp-card .timestamp{
  display: flex;
  align-items: center;
  font-size:16px;
  line-height:19px;
  padding-left:20px;
  white-space: nowrap;
}
.lp-card .timestamp span{
  position:relative;
  display: inline-block;
  width:7px;
  height:7px;
}
.role-duration > div{
  width: 35%;
}
.lp-card .role-duration{
  align-items: flex-end;
  width: 100%;
}
.lp-card .additional_roles{
  margin: 10px 0;
}

.lp-card .additional_roles .exp-heading p,.lp-card .additional_roles .role_title{
  font-size: 14px;
}
.lp-card .role-heading{
  font-size:13px;
  line-height:22px;
  font-family: "Lato-regular";
}
.lp-card:hover{
  text-decoration: none;
  color: var(--dark-100);
  cursor: pointer;
}
.role-history-wrapper .lp-card:hover{
  cursor: default;
}
.role-history-wrapper {
  margin-top: 5px;
}
.role-history-wrapper .lp-card:not(.active){
  margin-bottom:5px;
  box-shadow: 0 0 0 transparent;
  background: #eff8ef66;
  width: 97%;
  margin: 0 auto;
  /* opacity:0.4; */
}

.styling{
  text-align: left;
font: normal normal normal 15px/16px Lato;
letter-spacing: 0px;
color: #1F1F1F;
}

.role-history-wrapper .lp-card.card.active{
  background:var(--white);
  opacity:1;
}
.role-history-wrapper .lp-card:not(.active) > * >  * {
  opacity: 0.8;
}
.role-history-wrapper .role-status{
  color:var(--primary-200);
  /* text-transform: uppercase; */
}
.kra-list-wrap {
  display: flex;
}

.margin-adjustment div{
   margin-bottom: 12px;

}
.kra-list-summary {
  width: 40%;
  border-right: 1px solid #70707033;
  padding: 0px 15px 0 0;
  position: relative;
}
.lp-card , .lp-card.active{
  display: flex;
  /* justify-content: space-between; */
  flex-direction: column;
  align-items:center;
  background:var(--white);
  box-shadow: 0px 3px 26px var(--box-shadow-1);
  padding: 13px 23px;
  border-left:6px solid var( --primary-200);
  margin-left:5px;
  color: var(--dark-100);
  opacity:1;
}
.custom-w-20{
  min-width: 20% !important;
   max-width: 20% !important;
}

.custom-w-40{
   min-width: 40% !important;
   max-width: 40% !important;
}

.custom-w-45{
   min-width: 45% !important;
   max-width: 45% !important;
}

.custom-w-15{
   min-width: 15% !important;
   max-width: 15% !important;
}

.custom-w-20{
   min-width: 20% !important;
   max-width: 20% !important;
}


.custom-w-50{
   min-width: 50% !important;
   max-width: 50% !important;

}

.custom-w-30{
  min-width: 30% !important;
   max-width: 30% !important;
  
}

.custom-w-35{
  min-width: 35% !important;
   max-width: 35% !important;
  
}

.custom-w-40{
  min-width: 40% !important;
   max-width: 40% !important;
  
}
.custom-w-20{
  min-width: 20% !important;
   max-width: 20% !important;
  
}

.custom-w-10{
  min-width: 10% !important;
   max-width: 10% !important;
  
}
.border-dash-top{
  border-top: 1px dashed #707070;
}
.border-dash-bottom{
  border-bottom: 1px dashed #707070;
}
.lp-card > section {
  width: 100%;
}
.role-history__main-info{
  display: flex;
  justify-content: space-between;
}
.lp-card .card-right{
  display: flex;
  align-items: center;
}
.role-history-wrapper .lp-card:not(.active){
  border-left:6px solid var(--primary-200);
}
/* .kra-list-summary .kra-list-table.scrollTable tbody{
  height:190px;
} */
.kra-details {
  width: 60%;
  padding-left: 15px;
}
.kra-details .kra-list-table td{
  font-size: 16px;
  line-height: 18px;
}
.kra-list-table {
  width: 100%;
}
.kra-details .kra-list-table.scrollTable .view-all-wrap{
  margin-bottom: 20px;
}
.kra-type-graph{
  /* position:absolute; */
  width:100%;
  margin-bottom: 10px;
  margin-top: 5px;
}
.kra-list-summary .kra-list-table{
  width:100%;
}
.kra-list-summary .kra-list-table.scrollTable thead tr{
  margin-bottom: 8px;
}
.kra-details .kra-list-table.scrollTable thead tr{
  margin-bottom: 0;
}
.kra-list-summary .kra-list-table p{
  margin-bottom: 0
}

.kra-list-table thead tr th {
  text-align: left;
  font-size: 15px;
  font-weight: bold;
  line-height: 31px;
  font-style: normal;
  font-family: "Lato-bold";
  letter-spacing: 0px;
  color: var(--dark-100);
}
.kra-list-table thead tr th:first-of-type,.kra-list-table tbody tr td:first-of-type,.kra-list-table tfoot tr td:first-of-type{
  width: 70%;
  display: inline-flex;
}
.kra-list-table thead tr th {
  border-bottom: 0;
  padding: 0;
  font-size: 17px;
}
.kra-list-table tbody tr td p{
  width:90%;
  text-align: left;
  font-size: 16px;
  font-weight: normal;
  line-height: 1;
  font-style: normal;
  font-family: "Lato-regular";
  letter-spacing: 0px;
  color: var(--dark-100);
  display:inline-block;
  margin-bottom:0;
}
.kra-list-table.scrollTable tr{
  margin-bottom:10px;
}
.kra-list-table tbody tr td span {
  display: inline-block;
  height: 9px;
  width: 9px;
  margin-right: 11px;
  margin-top: 3px;
}
.kra-list-table .business{
  background:#15734E;
}
.kra-list-table .income{
  background: #802B05;
}
.kra-list-table .ac{
  background: #B41432;
}
.kra-list-table .npa{
  background: #452525;
}
.kra-list-table .digital-banking{
  background: #ED970C;
}
.kra-list-table thead tr th:last-child,.kra-list-table tbody tr td:last-child, .kra-list-table tfoot tr td:last-child  {
  text-align: end;
} 
.kra-list-table tfoot tr td:last-child {
  /* padding-right: 5px; */
  width: 30%;
  text-align: center;
}
.kra-list-table thead tr th:last-child{
  /* padding-right: 8px; */
  width: 30%;
  text-align: center;
}
.kra-list-table tfoot tr td {
  text-align: left;
  font-size: 16px;
  font-weight: normal;
  line-height: 19px;
  font-style: normal;
  font-family: "Lato-bold";
  letter-spacing: 0px;
  color: var(--primary-200);
}

.kra-list-table .view-all {
  text-decoration: underline;
  text-align: left;
  font-size: 14px;
  font-weight: normal;
  line-height: 17px;
  font-style: normal;
  font-family: "Lato-bold";
  letter-spacing: 0px;
  color: var( --primary-200);
  text-transform: uppercase;
  opacity: 1;
}
.lp-card .role-status p{
  margin: 0 0 8px 0;
}
.lp-card .role-status img{
  height:13px;
  width: 13px;
}
.lp-card .role-status.acc-pend{
  color:var(--red);
}
.lp-card .role-status{
  width:27%;
}
.lp-card .role-status.role-rejected{
  color:var(--red-200);
}
.lp-card .role-status.discussion{
  color: #f7a028;
}
.lp-card .role-status span{
  display: inline-block;
  width: 100%;
  height: 1px;
}
.lp-card .role-status span:first-of-type::before,
.lp-card .role-status span:last-of-type::before{
  content:'';
  position:absolute;
  display:inline-block;
  height:7px;
  width:7px;
  border-radius: 7px !important;
  background:var( --primary-200) !important;
  bottom:4px !important;
}
.lp-card .role-status span:first-of-type::before{
       left: 2px;

}
.lp-card .role-status span:last-of-type::before{
  /* content:'';
  position:absolute;
  display:inline-block;
  height:7px;
  width:7px;
  border-radius: 7px !important;
  background:var( --primary-200); */
  right:10px;
}
.role-status{
  position: relative;
  font-size:12px;
  line-height:15px;
  color:var(--red);
  font-weight:900;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;

  /* padding-bottom:15px; */
  margin:0;
}
.lp-card .role-status span:first-of-type:after,
.lp-card .role-status  span:last-of-type:after{
 content: '';
    width: calc(35%);
    height: 1px;
    display: inline-block;
    background: black;
    bottom: 7px !important;
    position: absolute;
}


.lp-card .role-status span:first-of-type:after {
    left: 9px;
  bottom: 7px;
}
.lp-card .role-status  span:last-of-type:after {
  /* content: '';
  width: 52px;
  height: 1px;
  display: inline-block;
  background: black;
  bottom: -1px;
  position: absolute; */
  bottom: 7px;
     right: 16px;

}
.role-accepted .role-status::after{
  /* content: url(../../img/icon/accepted-check.svg); */
  background: var(--primary-300)0a;
}
.role-status::after {
  /* content: url(../../img/icon/check.svg); */
  width: 22px;
  height: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 50%;
  bottom: -8px;
  background: var(--white);
  transform: translate(-50%,2px) ;
}
.role-accepted.role-selected .role-status::after{
   background: var(--white);
}
.role-end .timestamp span::before{
  left:-5px;
}
.view-history-wrap{
  margin-top: 10px;
  text-align: center;
}
.view-history-wrap .btn{
  font-size: 15px;
  line-height: 1;
  font-weight: bold;
  color: var( --primary-200);
  position: relative;
  padding: 0 0  10px 0;
}
/* .view-history-wrap .btn{

} */
.view-history-wrap #hide-history-btn{
  padding: 10px 0 0 0;
}
.view-history-wrap .btn:hover,
.view-history-wrap .btn:focus{
  text-decoration: none;
  box-shadow: 0 0 0 transparent;
}
.view-history-wrap #view-history-btn::before{
  content:url(../../img/icon/view-more.svg);
  position: absolute;
  top: unset;
  bottom:-10px;
  left:50%;
  transform:translate(-50%,0);
}
.view-history-wrap .show-history-btn::before{
  content:url(../../img/icon/view-more.svg);
  position: absolute;
  top: 0px;
  bottom: unset;
  left: 50%;
  transform: translate(-50%,-50%) rotate(180deg);
}
.repa-reva-wrap > div{
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
   /* font-family: "Lato-regular"; */
}
.repa-reva-wrap p,.repa-reva-wrap label{
  font-size: 16px;
  line-height: 19px;
  font-family: "Lato-bold";
  margin: 0;
}
.repa-reva-wrap p{
 text-align: right;
}
.repa-reva-wrap p span{
  display: block;
  font-size: 13px;
  font-family: "Lato-regular";

}
.team-alocation-summary{
  padding-bottom: 15px;
  border-bottom: 1px solid #70707033;
}
.team-alocation-summary .status--view{
  flex-direction:column;
  align-items: flex-start;
  border:0 none;
  padding:0;
  margin: 0;
}
.team-alocation-summary .status--view-items{
  justify-content: flex-start;
  align-items: center;
}
.team-alocation-summary .status--view-items .status-complete{
  width: auto;
  margin-right:12px;
}
.team-alocation-summary .status-count{
  font-size: 18px;
  line-height: 22px;
  font-weight: bold;
  margin-right:10px;
}
.team-alocation-summary .status--view img{
  height:16px;
  width:16px;
}
.team-alocation-summary .status--view-items-flagged img{
  height: 20px;
  width: 17px;
}
.team-alocation-summary .team-count{
  display:flex;
  justify-content: space-between;
  margin-bottom: 5px;
}
.team-alocation-summary .team-count h5 span{
  font-size: 20px;
  line-height: 22px;
  font-weight: bold;
  color: var( --primary-200);
  display: block;
}
.team-alocation-summary .team-count h5{
  font-size:18px;
  line-height: 22px;
  font-weight: normal;
  color: var(--dark-100);
  margin: 0;
}
.team-alocation-summary .total_members{
  text-align:right;
  text-transform:capitalize;
}
.team-alocation-summary .total_members span{
  font-size:38px;
  line-height: 46px;
  font-weight: bold;
  color: var( --primary-200);
}
.team-alocation-summary .total_members p{
  font-size:14px;
  line-height: 17px;
  font-weight: bold;
  color: var(--dark-100);

}
.roles_allocated{
  margin-top:15px;
}
.section-subtitile{
  font-size:20px;
  line-height:22px;
  font-weight:bold;
  margin-bottom: 13px;
  margin-top: 0;
}
.sidebar-team-list .section-subtitile{
  margin-bottom: 15px;
}
.roles-list {
  padding:0;
  list-style: none;
  font-size:16px;
  line-height:29px;
}
.roles-list-item{
  display: flex;
  justify-content: space-between;
}
.roles-list-item p{
    margin-bottom:0;
}
.sidebar-team-list{
  margin-top: 15px;
  padding-bottom:15px;
  border-bottom: 1px solid #70707033;
}
.sidebar-team-list .team-list{
  padding: 10px 5px 0 0;
  list-style: none;
  /* padding-top: 12px; */
  margin-bottom: 0;
     height: 240px;
  overflow-y: auto;
}
.sidebar-team-list .team-list.non-bo .member_detail::after{
  transform: translate(-10px,-100%) rotate(90deg);
}
.sidebar-team-list .team-list.non-bo .member_detail.active::after{
  transform: translate(-10px,-100%) rotate(-90deg);
}
.sidebar-team-list .team-list.non-bo .team-list-item::after
.sidebar-team-list .team-list.non-bo .teamstatus{
  display: none;
}
.non-bo .teamstatus img{
  display: none !important;
}
.sidebar-team-list .team-list li:first-of-type{
  margin-top: 5px;
}
.sidebar-team-list .team-list-item{
  display:flex;
  align-items:flex-start;
  margin-bottom: 12px;
  padding: 0;
  position: relative;
}
.sidebar-team-list .additional-info {
  margin-top: 10px;
}
.sidebar-team-list li:last-child .team-list-item{
  margin-bottom: 0;
  padding-bottom: 0;
}
.sidebar-team-list .member_detail::after{
  content: url(../../img/icon/arrow.svg);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-100%);
}
.sidebar-team-list .team-list li:last-of-type .member_detail{
 border-bottom: 0 none;
 padding-bottom: 0;
}
.team-list-item:hover{
  text-decoration: none;
  cursor: pointer;
}
.h-auto{
  height: auto !important;
}
.sidebar-team-list .user-profile{
  height:54px;
  width: 54px;
  border-radius: 54px !important;
  /* background:var( --primary-200); */
  background: #FFFFFF 0% 0% no-repeat padding-box;
  box-shadow: 0px 3px 6px #00000029;
 color: #262626;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 20px;
  font-size:20px;
  font-weight:bold;
  position: relative;
}
.sidebar-team-list  .user-profile .teamstatus{
  position: absolute;
  top: -3px;
  right: -3px;
  height: 20px;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.member_detail{
  position: relative;
  /* padding-bottom: 5px; */
  width: calc(100% - 70px);
  border-bottom: 1px solid #70707033;
  padding-bottom: 10px;
}
.member_detail::before{
  /* content:''; */
  height:1px;
  background: #70707033;
  width:100%;
  position: absolute;
  left:0;
  right:0;
  bottom: -10px;
}
.member_detail .name{
  font-size:16px;
  line-height:16px;
  font-weight: bold;
  margin-top: 0;
  margin-bottom: 0;
  color:#453333;
}
.member_detail .designation{
  font-size:13px;
  line-height:16px;
  color: var(--dark-400);
  font-family: "Lato-regular";
  margin-top: 3px;
  margin-bottom: 0;
}
.team-list .additional-info .main-role{
  font-size: 14px;
  font-family: "Lato-bold";
  color: #333333;
  text-align: center;
  display: inline-flex;
  align-items: center;
  background: #f2efef;
  border: 1px solid #70707033;
  padding: 0 8px;
  display: inline-block;
}
.team-list .additional-info .additional_role:last-child{
  margin-bottom: 0;
}
.team-list .additional-info .main-role img{
  width: 12px;
  height: 12px;
  margin-right: 7px;
}
.additional-info .additional_role{
  font-family: "Lato-regular";

}
.additional-info .additional_role:first-of-type {
  font-size: 14px;
  line-height: 1;
  font-family: "Lato-regular";
}
.additional-info .additional_role:first-of-type::after{
  background: #cacaca;
  height: 5px;
  width: 5px;
  left: 1px;
}
.kra-list-table.scrollTable tbody{
  height: 200px;
  max-height:none;
  /* padding-right:10px; */
}
.kra-details .kra-list-table.scrollTable tbody{
  height: 232px;
}
.kra-list-table.scrollTable tbody td:last-of-type{
  width: 30%;
  text-align: center;
}

@keyframes expand {
	from {width: 0%;}
	to {width: 100%;}
}
@media screen and (max-width:1280px){
  .kra-type-graph{
    top:-10px;
  }
}
@media screen and (max-width: 991px){
  .kra-list-table.scrollTable tbody{
    height:auto;
  }
}
@media screen and (min-width: 768px) {
	@keyframes expand {
		from {width: 0%;}
		to {width: calc(100% - 75px);}
	}
}
.chart {
	overflow: hidden;
	width: 100%;
	/* animation: expand 1.5s ease forwards; */
}
.row + .row .chart {
	animation-delay: .2s;
}
.row + .row + .row .chart {
	animation-delay: .4s;
}
.block {
	display: block;
	height: 9px;
	color: var(--white);
	font-size: .75em;
	float: left;
	position: relative;
	overflow: hidden;
	opacity: 1;
	transition: opacity, .3s ease;
	cursor: pointer;
}
.block.business{
	background-color: #15734E;

}
.block.business,
.legend li:nth-of-type(2):before {
	background-color: #15734E;
}
.block.ac,
.legend li:nth-of-type(3):before {
	background-color: #B41432;
}
.block.income{
  background-color:#802B05;
}
.block.npa,
.legend li:nth-of-type(4):before {
	background-color: #452525;
}
.block.digital-banking,
.legend li:nth-of-type(5):before {
	background-color: #ED970C;
}
/* .block:nth-of-type(6),
.legend li:nth-of-type(6):before {
	background-color: #B41432;
} */
.block:hover {
	opacity: .65;
}
/* .value {
	display: block;
	line-height: 1em;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%);
} */
.rc-allocated-view-kra{
  /* padding-left: 42px; */
}
@media screen and (max-width: 1280px){
  .kra-list-summary{
    padding: 0px 10px 0 0;
  }
  .kra-list-summary .kra-list-table{
    width: 100%;
  }
}
@media screen and (max-width:1220px){
  .lp-card .role-status span:first-of-type:after, .lp-card .role-status span:last-of-type:after{
    width: 30%;
  }
    .lp-card, .lp-card.active{
      padding: 10px;
    }
    .card-right{
      width: 60%;
    }
}
@media screen and (max-width: 1024px){
  .rc-lp-two-col .lp-left__wrapper{
   width:56%;
   flex-wrap:wrap;
  }
  .rc-lp-two-col .lp-right__wrapper{
    width:40%;
  }
  .kra-list-wrap{
    flex-wrap:wrap;
  }
  .kra-list-summary,
  .kra-details,
  .kra-list-summary .kra-list-table{
    width:100%;
    padding:0;
    border:0 none;
  }
  .kra-list-summary .kra-list-table{
    border-bottom: 1px solid #cdcdcd;
    margin-bottom:20px;
  }
  .lp-card, .lp-card.active{
    flex-wrap:wrap;
    /* flex-direction: */
  }
  .role-history__main-info{
    flex-direction: column;
    margin-bottom: 10px;
  }
  .card-left,
  .card-right{
    width:100%;
  }
  .card-right{
    margin-top: 10px;
  }
  .kra-list-table.scrollTable tbody{
    height: auto;
  }
}

@media screen and (max-width:991px){
  .rc-lp-two-col{
    height:auto;
    overflow-y:visible;
  }
}
@media screen and (max-width:890px){
  .rc-lp-two-col{
    flex-direction: column-reverse;
  }
  .rc-lp-two-col .lp-right__wrapper,
  .rc-lp-two-col .lp-left__wrapper,
  .rc-lp-two-col .lp-section{
    width:100%;
  }
  .card-left{
    width: 30%;
  }
  .card-right{
    width: 60%;
    margin-left: 10px;
  }
  .role-history__main-info{
    flex-direction: row;
  }
}
@media screen and (max-width: 668px){
  .card-left,
  .card-right{
    width:100%;
    margin:0 0 10px 0;
  }
  .lp-card .role-duration > div{
    width: 25%;
  }
  .lp-card .role-duration .role-status{
    width: 35%;
  }
  .lp-card .role-status span:first-of-type:after, .lp-card .role-status span:last-of-type:after{
    width: 25%;
  }
  .lp-card .role-duration{
    flex-direction:row;
  }
  .lp-card .role-start .timestamp span::after,
  .lp-card .role-end .timestamp span::after{
    width:35px;
  }
  .role-end .timestamp{
    padding:0;
  }
  .role-status{
    text-align:center;
  }
  .role-history__main-info{
    flex-direction: column;
  }
}
@media screen and (max-width:460px){
  .lp-card, .lp-card.active{
    padding: 13px 7px;
  }
  .rc-lp-two-col .lp-section{
    padding: 8px 10px;
  }
  .lp-card .timestamp{
    font-size: 12px;
  }
  .exception_assigned-roles .exp-heading{
    width: 40%;
  }
  /* .lp-card .role-duration{
    flex-direction: column;
    align-items: flex-start;
  }
  .lp-card .timestamp{
    flex-direction:column;
    align-items: flex-start;
  }
  .lp-card .role-start .timestamp span::after,
  .lp-card .role-end .timestamp span::after{
    width: 1px;
    height: 35px;
  }
  .role-status::after{
    top:56%;
  }
  .lp-card .role-end .timestamp span::after{
    top: -35px;
  }
 .role-status{
  height: calc(35px + (2 * 35px));
  display: flex;
  align-items: center;
  } */
}
.user-steps:not(.hide) + .latest-news {
  display: none;
}
.emp_exp_action{
  display: flex;
}
@media screen and (max-width: 767px){
 .rc-exception-add-kra .rc-exception-footer  .emp_exp_action  button+button{
    margin-top: 0;
  }
  .page-header .emp-search{
    width:70%;
  }
  .user-table .dataTables_filter {
      width: 70%;
  }
  .modal-img {
    width: 100%;
  }

}

/* New design for allocator page listing on dashboard page starts here */
.allocatorpg-listing .accordion-header{
  padding:0;
}
.allocatorpg-listing .accordion-header + .accordion-collapse .accordion-body{
  box-shadow: 0px 3px 10px #1C724F21;
  padding: 10px;
  border-radius: 5px !important;
  margin-top: 5px;
}
.allocatorpg-listing .accordion-header .accordion-button,
.exceptionpg-listing a{
  display: flex;
  align-items: center;
  padding: 20px 30px 20px 10px;
  background: var(--white);
  color:var(--black);
  box-shadow: 0px 3px 10px #1C724F21;
  border-radius: 5px !important;
  position: relative;
  font-size: 16px;
  /* font-family: "Lato-semibold"; */
}
.allocatorpg-listing .accordion-header .accordion-button p{
  margin-bottom: 0;
}
.allocatorpg-listing .role_alloc-zo .accordion-header .accordion-button{
  border-left: 5px solid #A1A314;
}
.allocatorpg-listing .role_alloc-bh .accordion-header .accordion-button{
  border-left: 5px solid #1e4462;
}
.allocatorpg-listing .accordion-header .accordion-button:not(.collapsed),
.allocatorpg-listing .accordion-header .accordion-button:not(.collapsed){
  color: #fff;
}

.allocatorpg-listing .accordion-header  img + img,
.exceptionpg-listing img+img{
 display: none;
}

.allocatorpg-listing  .accordion-header .accordion-button:not(.collapsed) img,
.exceptionpg-listing a:hover img{
 display: none;
}
.allocatorpg-listing .accordion-header .accordion-button:not(.collapsed) img + img,
.exceptionpg-listing a:hover img+img{
 display: inline-block;
}
.allocatorpg-listing .role_alloc-zo .accordion-header .accordion-button:not(.collapsed){
  background: #A1A314;
}
.allocatorpg-listing .role_alloc-bh .accordion-header .accordion-button:not(.collapsed),
.exceptionpg-listing a:hover{
  background: #1e4462;
}

.allocatorpg-listing .accordion-header .accordion-button::after{
    content: url(../../img/icon/down-arrow.svg);
    position: absolute;
    background-image: none;
    right: 15px;
    /* height: auto; */
    top: calc(50% - 5px);
    transform: translateY(-50%);
}
.allocatorpg-listing .accordion-header .accordion-button:not(.collapsed)::after{
  content: url(../../img/icon/down-arrow--white.svg);
  transform:  translateY(-15%) rotate(180deg);
}
.allocatorpg-listing .accordion-header .accordion-button:hover,.allocatorpg-listing .accordion-header .accordion-button:focus{
  /* color: inherit; */
  background: #fff;
  transition: background 1s ease-in-out;
  cursor: pointer;
}
.exceptionpg-listing a:hover,.exceptionpg-listing a:focus{
  color:#fff;
}
.allocatorpg-listing .accordion-icon{
  height:30px;
  width: 30px;
  margin-right: 15px;
}
.allocatorpg-listing .accordion-item{
  border: 0 none;
}
.select2-dropdown{
z-index: 9999;
}

.exceptionpg-listing a img{
  height: 30px;
  width: 30px;
  margin-right: 15px;
}

.exceptionpg-listing a{
  border-left: 5px solid #1e4462;
  margin-top: 10px;
}

.exceptionpg-listing a::after,.exceptionpg-listing a:hover::after{
  content: url(../../img/icon/arrow.svg);
  position: absolute;
  right: 15px;
  /* height: auto; */
  top: calc(50% - 5px);
  transform: translateY(-50%);
}
.exceptionpg-listing a:hover::after{
  content: url(../../img/icon/Rightarrow.svg);
}
.exceptionpg-listing .exp-branch-officer{
  border-left: 5px solid #A1A314;
}
.exceptionpg-listing .exp-branch-officer:hover{
  background: #A1A314;
}


/* 1. Hide the arrow container only for the .no-arrow instance */

.no-arrow .select2-container--default .select2-selection--single .select2-selection__arrow {

    display: none !important;
}

/* 2. Fix the right padding only for the .no-arrow instance */
/* .select2-hidden-accessible.no-arrow .select2-selection--single {
    padding-right: 8px !important; 
} */


.match-field-height{
  height:84px;
}

.disabled-click {
  pointer-events: none;
  cursor: not-allowed;
  opacity: 0.5;
}

.reduce-opacity {
  opacity: 0.8;
}