body {
  font-family: 'Jost', sans-serif;
  background-color: #3CB2AB;
  color: #6F6F6F;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

figure {
  margin: 0;
}

img {
  max-width: 100%;
  height: auto;
}

a {
  display: inline-block;
  -moz-transition: all 0.5s ease 0s;
  -ms-transition: all 0.5s ease 0s;
  -o-transition: 0.8;
  -webkit-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  text-decoration: none;
}

body {
  position: relative;
}

.btn {
  color: #3CB2AB;
  text-align: center;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  position: relative;
  /*height: 61px;
  width: 309px;*/
  max-width: 100%;
}

.fill-btn {
  border-radius: 31px;
  border: 2px solid #3CB2AB;
  background: #3CB2AB;
  color: #fff;
}

.fill-btn:hover {
  border: 2px solid #3CB2AB;
  background: #fff;
  color: #3CB2AB;
}

.border-btn {
  border-radius: 31px;
  border: 2px solid #3CB2AB;
  background: #FFF;
}

.border-btn:hover {
  background: #3CB2AB;
  color: #fff;
}

.whitebox {
  background-color: #fff;
  padding: 45px 60px;
  margin: 30px 0;
}

.heading h2 {
  color: #6F6F6F;
  font-size: 40px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  margin: 0 0 10px;
}

.heading p {
  color: #6F6F6F;
  font-size: 22px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  margin: 0 0 30px;
}

.logo {
  text-align: center;
  margin: 0 0 15px;
  height: 69px;
}

.loginform .input-group {
  margin: 0 0 15px;
}

.loginform .form-control {
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #787878;
  padding: 0 12px;
  color: #6E6E6E;
  font-size: 19px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  height: 40px;
  width: 100%;
}

.loginform .form-control::placeholder {
  color: #ACACAC;
  opacity: 1;
}

.loginform .form-control::-moz-placeholder {
  color: #ACACAC;
  opacity: 1;
}

.loginform .form-control:-ms-input-placeholder {
  color: #ACACAC;
  opacity: 1;
}

.loginform .form-control::-ms-input-placeholder {
  color: #ACACAC;
  opacity: 1;
}

.loginform .form-control:focus {
  border-bottom: 1px solid #787878;
  box-shadow: none;
}

.passwordicon {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 3;
}

.bottombtn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 50px 0 35px;
}

.forgetpass {
  text-align: right;
  margin: 0;
}

.forgetpass a {
  color: #3CB2AB;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.account-text {
  color: #ACACAC;
  text-align: center;
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.account-text a {
  color: #3CB2AB;
}

.top-header {
  background-color: #3CB2AB;
  padding: 10px;
}

.top-header h2 {
  color: #fff;
  font-size: 19px;
  font-weight: 500;
  margin: 0;
  padding: 0;
}

.cardbox-process {
  max-width: 920px;
  margin: auto;
}

.steps-process {
  background: #E6E6E6;
  padding: 10px;
}

.steps-list li {
  position: relative;
  z-index: 1;
}

.steps-list {
  margin: 0px auto;
  width: 100%;
  padding: 0;
  justify-content: space-between;
  max-width: 200px;
  position: relative;
  z-index: 1;
}

.steps-list:after {
  position: absolute;
  top: 0px;
  bottom: 0px;
  margin: auto;
  left: 0px;
  width: 100%;
  z-index: -1;
  height: 2px;
  background-color: #929292;
  content: '';
}

.steps-list li span {
  height: 26px;
  width: 26px;
  border: 2px solid #3CB2AB;
  background-color: #fff;
  position: relative;
  z-index: 2;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3CB2AB;
  font-size: 16px;
  font-weight: 500;
}

.steps-list li.active span {
  height: 34px;
  width: 34px;
  background-color: #3CB2AB;
  color: #fff;
}

.steps-list li.active:after {
  position: absolute;
  top: 0px;
  bottom: 0px;
  margin: auto;
  right: -58px;
  width: 58px;
  z-index: -1;
  height: 2px;
  background-color: #3CB2AB;
  content: '';
}

.user-profile-upload {
  margin-bottom: 12px;
}

.user-profile-upload figure {
  height: 140px;
  width: 140px;
  overflow: hidden;
  border-radius: 50%;
  margin: auto;
  border: 5px solid #E6E6E6;
}

.browse-file {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}

.browse-file input {
  opacity: 0;
  width: 73px;
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
  top: 0px;
  margin: auto;
  cursor: pointer;
}

.browse-file a {
  color: #6E6E6E;
  font-size: 16px;
  font-weight: 400;
}

.form-group {
  margin-bottom: 40px;
}

.form-group label {
  display: block;
  font-weight: 400;
  color: #6F6F6F;
  font-size: 20px;
}

.form-group label b {
  font-weight: 400;
  color: #DE2138;
}

.cardbox-process form {
  margin: 30px 0px 0px;
}

.form-group input {
  background-color: #F5F5F5;
  font-size: 19px;
  height: 56px;
  padding-left: 22px;
  padding-right: 22px;
  border-radius: 5px;
  border: none;
  border-top: 1px solid #00000040;
}

.verify-link {
  color: #3CB2AB;
  font-size: 20px;
}

.verified-text {
  font-size: 20px;
  color: #6E6E6E;
}

.add-more a {
  color: #3CB2AB;
  font-weight: 400;
  font-size: 18px;
  cursor: pointer;
}

.add-more a img {
  margin-right: 10px;
}

.bottom-action .border-btn:hover img {
  filter: brightness(0) invert(1);
}

.add-more-listing {
  margin: 0px auto;
  max-width: 300px;
  padding: 0;
}

.add-more-listing li {
  list-style: none;
  margin-bottom: 20px;
}

.add-more-listing li:last-child {
  margin: 0;
}

.add-more-listing li a {
  color: #6C6C6C;
  font-size: 18px;
  display: inline-flex;
  align-items: center;
}

.add-more-listing li a img {
  margin-right: 12px;
}

.offcanvas-bottom.offcanvas-addmore {
  height: 235px;
  padding: 22px;
}


.offcanvas .offcanvas-header {
  background-color: #3CB2AB;
  padding: 10px;
  justify-content: center;
  position: relative;
}

.offcanvas .offcanvas-header h5 {
  color: #fff;
  margin: 0;
  padding: 0;
  font-size: 19px;
  font-weight: 500;
}

.offcanvas .offcanvas-header .btn-close {
  position: absolute;
  left: 20px;
  top: 0px;
  font-size: 0;
  opacity: 1;
  padding: 0px;
  margin: 0px;
  width: 26px;
  height: 21px;
  bottom: 0px;
  margin: auto;
  outline: none;
  box-shadow: none;
}

.search-city {
  position: relative;
}

.search-city input {
  padding-left: 50px;
  padding-right: 26px;
}

.search-city .search {
  position: absolute;
  left: 16px;
  top: 16px;
  margin: auto;
}

.search-city .remove-name {
  position: absolute;
  right: 16px;
  top: 16px;
}

.listing-card {
  margin: 40px 0px 30px;
  padding: 0;
}

.listing-card li {
  margin-bottom: 20px;
}

.listing-card li:last-child {
  margin-bottom: 0;
}

.listing-card li a {
  color: #929292;
  font-size: 19px;
  display: inline-flex;
  align-items: center;
}

.heartBar {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  border-radius: 56px;
  box-shadow: 0px 0px 10px 0px #0000001A;
}

.selected-manager {
  border-bottom: 1px solid #E1E1E1;
}

.user-manager {
  padding-right: 10px;
}

.user-manager figure {
  height: 40px;
  width: 40px;
  overflow: hidden;
  border-radius: 50%;
  margin-right: 12px;
}

.user-manager span {
  font-size: 14px;
  display: block;
  font-weight: 300;
  color: #454545;
  max-width: 200px;
  display: block;
  line-height: 20px;
}

.user-manager strong {
  display: block;
  font-size: 19px;
  font-weight: 400;
  line-height: 28px;
  max-width: 200px;
}

.city-name {
  font-size: 14px;
  color: #929292;
}

.managercard {
  color: #929292;
  font-size: 19px;
}

.add-search-people {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999999;
}

.add-search-people a {
  display: block;
  height: 64px;
  width: 64px;
  border-radius: 50%;
  box-shadow: 0px 3px 10px 0px #00000040;
}

.offcanvas-manager .offcanvas-body {
  padding-bottom: 80px;
}

.headingBar h2 {
  color: #2E2E2E;
  font-size: 24px;
  margin: 0;
  padding: 0;
  font-size: 24px;
  font-weight: 500;
  line-height: 35px;
}

.headingBar p {
  font-size: 20px;
  font-weight: 300;
  line-height: 29px;
  letter-spacing: 0em;
  text-align: left;
  color: #2E2E2E;
}

/*style for checkbox*/
.checkbox-Field input {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}

.checkbox-Field label {
  position: relative;
  cursor: pointer;
  padding-left: 32px;
  display: block;
}

.checkbox-Field label:before {
  background-image: url('../images/add-unchecked.svg  ');
  content: "";
  position: absolute;
  top: 5px;
  left: 0px;
  width: 14px;
  height: 14px;
}

.checkbox-Field input:checked+label:before {
  background-image: url('../images/add-checked.svg');
}

.max-width-100 {
  max-width: 100% !important;
}

.checkbox-Field input:checked+label {
  color: #3CB2AB;
}

.rightfixed {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999999;
}

.offcanvas-manager .offcanvas-body {
  padding-bottom: 80px;
}

.pb-100 {
  padding-bottom: 100px !important;
}

.social-input {
  position: relative;
}

.social-input input {
  padding-left: 90px;
}

.social-input .social-icon {
  position: absolute;
  left: 16px;
  top: 6px;
  border-right: 1px solid #929292;
  height: 80%;
  display: flex;
  align-items: center;
  padding-right: 16px;
}

.list-card {
  margin-bottom: 30px;
}

.list-card label {
  color: #6F6F6F;
  font-size: 17px;
  font-weight: 400;
  line-height: 25px;
  letter-spacing: 0em;
  text-align: left;

}

.list-card p a {
  color: #2E2E2E;
}

.list-card p {
  color: #2E2E2E;
  font-weight: 400;
  font-size: 19px;
  line-height: 27px;
  letter-spacing: 0em;
  text-align: left;

}

.view-link-card .dropdown-toggle {
  box-shadow: 0px 0px 6px 0px #00000040;
  height: 43px;
  width: 43px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
}

.view-link-card .dropdown-toggle:after {
  display: none;
}

.view-link-card .dropdown-menu {
  border-radius: 10px;
  min-width: 250px;
  padding: 0;
  box-shadow: 0px 0px 10px 0px #00000080;

}

.view-link-card .dropdown-menu li a {
  font-size: 20px;
  font-weight: 400;
  line-height: 29px;
  letter-spacing: 0em;
  color: #6E6E6E;
  padding: 8px 20px;
  display: block;

}

.view-link-card .dropdown-menu li a img {
  margin-right: 12px;
}

.Designations-list p,
.broadcast-card p {
  color: #2E2E2E;
  font-size: 19px;
  font-weight: 400;
  line-height: 27px;
  letter-spacing: 0em;
  text-align: left;
}


/*** switch case ***/
.checkbox {
  display: none;
}

.switch {
  align-items: center;
  background-color: #E45B5B;
  border-radius: 600px;
  cursor: pointer;
  display: flex;
  height: 35px;
  justify-content: space-between;
  padding: 0 10px;
  position: relative;
  user-select: none;
  width: 57px;
}

.checkbox:checked~.switch {
  background-color: #3CB2AB;
}

.checkbox:not(:checked)~.switch {
  background-color: #E45B5B;
}

.switch__left,
.switch__right {
  color: #fff;
  font-weight: 600;
  font-size: 11px;


}

.checkbox:checked~.switch .switch__left {
  visibility: hidden;
}

.checkbox:not(:checked)~.switch .switch__right {
  visibility: hidden;
}

.switch__circle {
  height: 31px;
  padding: 5px;
  position: absolute;
  transition: all 0.1s linear;
  width: 31px;
}

.checkbox:checked~.switch .switch__circle {
  left: 0;
  right: calc(100% - 31px);
}

.checkbox:not(:checked)~.switch .switch__circle {
  left: calc(100% - 31px);
  right: 0;
}

.switch__circle-inner {
  background-color: white;
  border-radius: 50%;
  display: block;
  height: 100%;
  width: 100%;
}

.towerlight img {
  filter: grayscale(1);
}

.checkbox:checked~.towerlight img {
  filter: grayscale(0);
}

.setting-nav {
  position: absolute;
  top: 2px;
  right: 10px;
}

.navbar-bottom {
  background-color: #181A1D;
  border-radius: 15px 15px 0px 0px;
  height: 90px;
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  z-index: 99;
}

.navbar-bottom ul li {
  width: 25%;
  text-align: center;
  display: flex;
  justify-content: center;
}

.navbar-bottom ul li a {
  color: #3CB2AB;
  font-weight: 500;
  font-size: 14px;
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

.navbar-bottom ul li a:hover {
  background-color: #131416;
  color: #fff;
}

.navbar-bottom ul li a:hover img {
  filter: brightness(0) invert(1);
}

.navbar-bottom ul li a img {
  margin-bottom: 10px;
}

.navbar-bottom ul li.active a {
  color: #fff;
  background-color: #131416;
  border-radius: 15px 15px 0px 0px;
}

.navbar-bottom ul li.active a img {
  filter: brightness(0) invert(1);
}

.navbar-bottom ul {
  height: 100%;
}

.padding-bottom100 {
  padding-bottom: 100px !important;
}

.notify {
  position: relative;
}

.notify .dot {
  position: absolute;
  top: 4px;
  right: 0px;
  width: 8px;
  height: 8px;
  background-color: #F22727;
  border-radius: 50%;
}

.user-profile-image {
  margin-right: 20px;
}

.user-profile-image figure {
  border-radius: 50%;
  overflow: hidden;
  height: 133px;
  width: 133px;
  border: 5px solid #ddd
}

.user-profile-image figure img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.edit-profile-link {
  text-align: right;
}

.right-side-profile {
  flex-grow: 1;
  margin-top: -30px;
}

.user-info h2 {
  margin: 0px 0px 4px;
  padding: 0px;
  font-weight: 600;
  font-size: 22px;
  color: #454545;
}

.location span {
  font-size: 14px;
  color: #454545;
  font-weight: 400;
}

.designation-info {
  font-size: 16px;
  font-weight: 500;
  color: #454545;
}

.designation-info a {
  color: #3CB2AB;
}

.fav-line {
  margin: 30px 0px 20px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
  z-index: 1;
}

.fav-line:after {
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: 0px;
  margin: auto;
  width: 100%;
  background-color: #E1E1E1;
  height: 1px;
  z-index: -1;
  content: '';
}

.fav-line .heartBar {
  background-color: #fff;
  z-index: 2;
}

.fav-line .heartBar a {
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
}

.heartBar {
  position: relative;
}

.heartBar .active {
  position: absolute;
  top: 0px;
  left: 0px;
  margin: auto;
  right: 0px;
  bottom: 0px;
}

.user-profile-detail ul li {
  display: flex;
  margin-bottom: 16px;
  align-items: center;
  color: #454545;
  font-size: 14px;
}

.user-profile-detail ul li p {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  flex-grow: 1;
}

.user-profile-detail ul li label {
  margin-right: 20px;
  width: 160px;
}

.user-profile-detail ul li p a {
  color: #454545;
}

.user-profile-detail {
  padding-bottom: 30px;
}

.socail-link-info a {
  margin-right: 10px;
}

.socail-link-info a:last-child {
  margin-right: 0;
}

.user-project-profile .fill-btn {
  margin-right: 16px;
}


.work-showcase h2 {
  margin: 0;
  padding: 10px 0px 20px;
  color: #454545;
  font-size: 22px;
  font-weight: 500;
  line-height: 25px;
  letter-spacing: 0em;
  text-align: left;
}

.nav-pills .nav-link {
  background-color: #fff;
  border: 2px solid #474747;
  border-radius: 30px;
  font-size: 16px;
  color: #474747;
  font-weight: 600;
  min-width: 200px;
}

.nav-pills .nav-item {
  margin-right: 12px;
}

.nav-pills .nav-link.active {
  background-color: #fff;
  border: 2px solid #3CB2AB;
  color: #3CB2AB;
}

.nav-pills .nav-link:hover {
  background-color: #fff;
  border: 2px solid #3CB2AB;
  color: #3CB2AB;
}

.add-video-link {
  margin-bottom: 20px;
}

.add-video-link a {
  display: block;
  border-radius: 10px;
  background-color: #F6F6F6;
  padding: 12px 20px;
  font-size: 16px;
  color: #3CB2AB;
  font-weight: 600;
  width: 100%;
  text-align: center;
}

.add-video-link a:hover {
  background-color: #3CB2AB;
  color: #fff
}

.video-artist-listing {
  margin: 0px -10px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}

.video-artist-listing li {
  width: 50%;
  padding: 0px 10px;
  margin-bottom: 20px;
}

.video-artist-box {
  height: 100%;
  background-color: #ECECEC;
  border-radius: 5px;
  padding: 16px;
}

.video-artist-box figure a {
  display: block;
}

.video-artist-box figure a img {
  width: 100%;
}

.video-artist-box span.date {
  color: #525252;
  font-size: 12px;
  display: block;
  text-align: right;
  font-weight: 600;
}

.video-artist-box p {
  margin: 0px;
  padding: 14px 0px;
  color: #000;
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
}

.artist-work-list span {
  display: block;
  padding-left: 12px;
  position: relative;
  font-size: 14px;
  color: #525252;
  margin-bottom: 5px;
}

.artist-work-list span:after {
  position: absolute;
  top: 8px;
  left: 0px;
  content: '';
  height: 5px;
  width: 5px;
  border-radius: 50%;
  background-color: #525252;
}

.more-link {
  text-align: center;
}

.more-link a {
  font-size: 16px;
  color: #3CB2AB;
  font-weight: 600;
  width: 100%;
  text-align: center;
}

.backtopage {
  position: absolute;
  left: 10px;
  top: 9px;
}

.colorred {
  color: #A02626 !important;
}

.offcanvas-bottom.offcanvas-addmore.offcanvas-Action {
  height: 310px;
}

.other-project-profile .btn.requested {
  border: 2px solid #3FAB24;
  background-color: #ECF7E9;
  color: #3FAB24;
}

.add-more-listing li p {
  margin: 0;
  font-size: 18px;
  color: #6C6C6C;
}

.add-more-listing li p a {
  color: #3CB2AB;
  font-size: 18px;
}

.offcanvasRight-videolink .form-group {
  margin-bottom: 20px;
}

.video-upload .video-artist-box {
  border-radius: 5px;
  border: 3px solid #3CB2AB
}

.error {
  font-size: 17px;
  color: #DA0000;
  display: block;
}

.video-upload .video-artist-box p {
  padding-top: 0;
}

.video-upload .video-artist-box .date-block {
  text-align: left;
}

.offcanvas-videoDesignation .video-upload .video-artist-box {
  background-color: #fff;
}

.video-categry-list {
  margin: 0;
  padding: 20px 0px;
}

.video-categry-list li {
  margin-bottom: 16px;
  color: #6E6E6E;
  font-size: 18px;
}

.video-categry-list li strong {
  color: #1D8B85;
  font-weight: 600;
}

.video-info ul li {
  margin-bottom: 14px;
}

.video-info ul li a {
  font-size: 18px;
  color: #3CB2AB;
  font-weight: 500;
}

.video-info ul li a img {
  margin-right: 10px;
}

.redborder-btn {
  color: #C55C68;
  border: 2px solid #C55C68
}

.redborder-btn:hover {
  background-color: #C55C68;
}

.offcanvas-ReportDesignation .video-upload .video-artist-box {
  background-color: #fff;
}

.offcanvas-ReportDesignation .video-categry-list li label {
  font-weight: 400;
}

.offcanvas-ReportDesignation .video-categry-list li b {
  color: #1D8B85;
  font-weight: 600;
}

.video-categry-list li .checkbox-Field label:before {
  background-image: url(../images/close-black.svg);
  height: 20px;
  width: 20px;
}

.video-categry-list li .checkbox-Field input:checked+label:before {
  background-image: url('../images/close-red.svg');
}

.video-categry-list li .checkbox-Field input:checked+label {
  color: #6E6E6E;
}

.sendreportModal .btn-send {
  font-size: 18px;
  color: #E45B5B;
  font-weight: 500;
}

.sendreportModal .btn-send img {
  margin-right: 10px;
}

.sendreportModal .modal-body {
  padding: 30px;
}

.sendreportModal .modal-body p {
  font-size: 18px;
  color: #525252;
  line-height: 30px;
}

.offcanvas-ReportDesignation.offcanvas .offcanvas-header {
  background-color: #E45B5B;
}

.Projectlisting .user-manager span {
  color: #252525;
  font-size: 19px;
}

.offcanvas-addproject-AfterAdd .form-group {
  margin-bottom: 22px;
}

.menu-listing.listing-card {
  margin-top: 20px;
}

.menu-listing.listing-card li {
  margin-bottom: 30px;
}

.menu-listing.listing-card li a {
  border-bottom: 1px solid #D5D5D5;
  color: #535353;
  font-size: 19px;
  display: block;
  padding-bottom: 8px;
}

.listing-card li label.labelarea {
  display: block;
  color: #535353;
  font-size: 19px;
}

.listing-card li span.infotext {
  display: block;
  font-size: 15px;
  color: #939393;
}

.notification-listing {
  margin-top: 20px;
}

.swtich-caseGray .checkbox:not(:checked)~.switch {
  background-color: #ECECEC;
}


/*style for checkbox*/
.radio-Field input {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}

.radio-Field label {
  position: relative;
  cursor: pointer;
  padding-left: 32px;
  display: block;
  font-size: 19px;
  color: #535353;
}

.radio-Field label:before {
  background-image: url('../images/radio-unchecked.svg  ');
  content: "";
  position: absolute;
  top: 4px;
  left: 0px;
  width: 20px;
  height: 20px;
}

.radio-Field input:checked+label:before {
  background-image: url('../images/radio-checked.svg');
}

.small-btn .fill-btn {
  width: 108px;
  height: 45px;
  font-size: 15px;
}

.form-group textarea.form-control {
  height: 162px;
  resize: none;
  background-color: #F5F5F5;
  font-size: 19px;
  padding: 22px;
  border-radius: 5px;
  border: none;
  border-top: 1px solid #00000040;
}


.blocked-listing li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #DFE1E7;
  padding-bottom: 12px;
}

.blocked-listing li .user-text {
  height: 38px;
  width: 38px;
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #3CB2AB;
  font-size: 24px;
  font-weight: 500;
  text-transform: uppercase;
  margin-right: 10px;
}

.blocked-listing li .left-blocked {
  flex-grow: 1;
  padding-right: 12px;
}

.blocked-listing li span {
  font-size: 19px;
  color: #454545;
}

.user-image {
  height: 38px;
  width: 38px;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 10px;
}

.blocked-listing li .right-blocked span {
  font-size: 14px;
  color: #929292;
  margin-right: 10px;
}

.blocked-listing li .left-blocked span {
  flex-grow: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  max-width: 210px;
}

.offcanvas-bottom.offcanvas-addmore.offcanvas-invite {
  height: 300px;
}

.invite-form {
  max-width: 300px;
  margin: auto;
}

.shareinvite-link a img {
  margin-right: 10px;
}

.shareinvite-link a {
  background-color: #F5F5F5;
  font-size: 19px;
  height: 56px;
  font-weight: 500;
  padding-left: 22px;
  padding-right: 22px;
  border-radius: 11px;
  border: none;
  border-bottom: 1px solid #00000040;
  color: #6C6C6C;
  font-size: 15px;
  margin-bottom: 10px;
}

.send-invite-btn a {
  font-weight: 500;
  color: #6C6C6C;
  font-size: 18px;
}

.send-invite-btn a img {
  margin-right: 12px;
}

.directory-listing {
  margin: 20px 0px 20px;
  padding: 0px 0px;
}

.directory-listing li {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.directory-listing li a.text-name {
  flex-grow: 1;
  background-color: #F5F5F5;
  border-radius: 0px 10px 10px 0px;
  padding: 14px 27px;
  position: relative;
  font-size: 19px;
  color: #454545;
}

.directory-listing li a.text-name:after {
  position: absolute;
  top: 0px;
  right: 12px;
  content: '';
  height: 17px;
  width: 12px;
  bottom: 0px;
  margin: auto;
  background-repeat: no-repeat;
  background-image: url(../images/arrow-right-icon.svg);
}

.directory-listing li a.heart-like {
  margin-left: 10px;
}

.directory-card {
  position: relative;
  padding-bottom: 70px;
}

.directory-card .add-search-people {
  z-index: 9;
  bottom: 110px;
}

.fill-directory li a.text-name {
  background-color: #3CB2AB;
  color: #fff;
}

.directory-listing.fill-directory li a.text-name:after {
  background-image: url(../images/left-arrow-icon.svg);
}

.paragraph-content {
  font-size: 19px;
  color: #2E2E2E;
  line-height: 27px;
  margin: 0px;
  padding: 0px 0px 20px;
}

.broadcast-card {
  margin-top: 16px;
}

.broadcast-card .label-info {
  padding: 0px 0px 12px;
}

.broadcast-card .label-info label {
  display: block;
  color: #6F6F6F;
  font-size: 17px;
  font-weight: 400;
}

.broadcast-card .label-info strong {
  display: block;
  color: #2E2E2E;
  font-size: 19px;
  font-weight: 400;
}

.broadcast-card .form-group {
  margin-bottom: 20px;
}


.checkbox-Field-select.checkbox-Field label:before {
  background-image: url('../images/checkbox-unchecked.svg');
  width: 20px;
  height: 20px;
  top: 0px;
}

.checkbox-Field-select.checkbox-Field label {
  padding-left: 16px;
}

.checkbox-Field-select input:checked+label:before {
  background-image: url('../images/checkbox-selected.svg');
}

.disabled-check.checkbox-Field-select.checkbox-Field label:before {
  background-image: url('../images/checkbox-disable.svg');
}

.checkbox-Field-all.checkbox-Field-select.checkbox-Field label {
  padding-left: 0px;
  padding-right: 30px;
  color: #3CB2AB;
  font-size: 16px;
}

.checkbox-Field-all.checkbox-Field-select.checkbox-Field label:before {
  left: auto;
  right: 0px;
}

.btn-grp {
  display: flex;
  align-items: center;
  justify-content: end;
  margin-top: 16px;
}

.btn-grp a {
  width: 33.33%;
  margin: 0px 5px;
  font-size: 15px;
  height: 45px;
}

.btn-grp a:first-child {
  margin-left: 0;
}

.btn-grp a:last-child {
  margin-right: 0;
}

.nav-pills-tabs {
  align-items: center;
  justify-content: space-between;
}

.nav-pills-tabs .nav-item {
  width: auto;
}

.nav-pills-tabs .nav-item .nav-link {
  border: none;
  min-width: inherit;
  padding: 5px 10px;
  color: #888888;
  font-size: 18px;
  font-weight: 600;
  border-bottom: 2px transparent;
  border-radius: 0px;
}

.nav-pills-tabs .nav-item .nav-link.active {
  color: #3CB2AB;
  border-bottom: 2px solid #3CB2AB;
}

.nav-pills-tabs .nav-item .nav-link.active img {
  filter: grayscale(0);
}

.nav-pills-tabs .nav-item .nav-link img {
  filter: grayscale(1);
  -moz-transition: all 0.5s ease 0s;
  -ms-transition: all 0.5s ease 0s;
  -o-transition: 0.8;
  -webkit-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}

.notification-content-listing li {
  margin-bottom: 30px;
}

.notification-content-listing li .date {
  color: #888888;
  font-size: 16px;
  font-weight: 700;
  display: block;
  padding-bottom: 5px;
  padding-left: 20px;
}

.notification-content-listing li .notification-area {
  background-color: #fff;
  box-shadow: 1px 2px 8px 0px #00000040;
  border-radius: 20px;
  padding: 22px;
}

.notification-area p {
  font-size: 18px;
  color: #000000;
  line-height: 28px;
  margin: 0px 0px 5px;
  padding: 0;
}

.notification-area p strong {
  color: #3CB2AB;
}

.red-border {
  color: #E27878;
  border: 2px solid #E27878;
  background-color: #fff;
}

.red-border:hover {
  color: #fff;
  background-color: #E27878;
  border: 2px solid #E27878;
}

.bg-dark-subtle {
  background-color: #BBBBBB;
  color: #fff;
  border: none;
}

.bg-dark-subtle:hover {
  border: 2px solid #BBBBBB;
  color: #BBBBBB;
}

.block-btn {
  background-color: #E27878;
  color: #fff;
  border: 2px solid #E27878;
}

.block-btn:hover {
  background-color: #fff;
  color: #E27878;
  border: 2px solid #E27878;
}

.green-border {
  border: 1px solid #3CB2AB
}


.gray-border {
  color: #BBBBBB;
  border: 2px solid #BBBBBB;
  background-color: #fff;
}

.gray-border:hover {
  color: #fff;
  background-color: #BBBBBB;
  border: 2px solid #BBBBBB;
}


.swtich-case-action {
  margin-top: 30px;
  flex-direction: column;
}

.swtich-case-action .switch {
  width: 190px;
  height: 44px;
}

.swtich-case-action .switch__circle {
  width: 150px;
  background-color: #fff;
  border: 1px solid #3CB2AB;
  border-radius: 24px;
  height: 37px;
}

.swtich-case-action .checkbox:checked~.switch {
  background-color: #CBF0EE;
  box-shadow: 0px 2px 2px 0px #00000040 inset;
}

.swtich-case-action .checkbox:checked~.switch .switch__circle {
  left: 5px;
}

.swtich-case-action .checkbox:not(:checked)~.switch .switch__circle {
  left: 34px;
  border: 1px solid #E45B5B;
}

.swtich-case-action .switch__left,
.swtich-case-action .switch__right {
  font-size: 14px;
  font-weight: 500;
  position: relative;
  z-index: 9;
  width: 100%;
  align-items: center;
  width: 100%;
  display: none;
  padding: 0px 12px;
}

.swtich-case-action .switch__right {
  color: #3CB2AB;
}

.swtich-case-action .switch__left {
  color: #E45B5B;
}

.swtich-case-action .checkbox:checked~.switch .switch__right {
  display: flex;
}

.swtich-case-action .checkbox:not(:checked)~.switch .switch__left {
  display: flex;
  justify-content: end;
}

.swtich-case-action .checkbox:not(:checked)~.switch {
  background-color: #F5DADA;
  box-shadow: 0px 2px 2px 0px #00000040 inset;
}

.project-tab-content {
  width: 100%;
  display: none;
}

.swtich-case-action .project-tab-content.online {
  display: block;
}

/* .swtich-case-action .checkbox:not(:checked)~.project-tab-content.offline {
  display: block;
} */

.active-project {
  position: relative;
  z-index: 1;
  margin-bottom: 22px;
}

.active-project:after {
  position: absolute;
  top: 0px;
  bottom: 0px;
  content: '';
  height: 1px;
  width: 100%;
  left: 0px;
  background-color: #ddd;
  margin: auto;
}

.active-project span {
  display: inline-flex;
  position: relative;
  z-index: 2;
  color: #454545;
  background-color: #fff;
  font-weight: 600;
  padding-right: 20px;
}

.project-listing {
  margin: 0px;
  padding: 0;
}

.project-listing li {
  margin-bottom: 22px;
}

.project-listing li .date {
  color: #454545;
  font-size: 12px;
  padding-left: 16px;
}

.project-box {
  box-shadow: 0px 0px 3px 0px #00000040;
  border-radius: 13px;
  padding: 24px;
  position: relative;
}

.project-box a {
  display: flex;
  align-items: center;
  color: #3CB2AB;
  font-size: 17px;
  font-weight: 500;
}

.project-box a strong {
  font-weight: 500;
}

.project-box .like-project {
  position: absolute;
  bottom: 16px;
  right: 16px;
}

.project-box .project-image {
  overflow: hidden;
  border-radius: 50%;
  height: 39px;
  width: 39px;
  position: absolute;
  left: 20px;
  margin: auto;
  top: 0px;
  bottom: 0px;
  background-color: #D9D9D9;
  display: flex;
  align-items: center;
  justify-content: center;
}

.project-box .project-content {
  flex-grow: 1;
  padding-left: 55px;
  padding-right: 24px;
}

.project-box .project-content span {
  display: block;
  font-size: 14px;
  font-weight: 300;
  color: #454545;
}

.project-box:after {
  position: absolute;
  top: 0px;
  right: 0px;
  content: '';
  height: 31px;
  width: 38px;
  background-image: url(../images/gray-cruve.svg);
  background-repeat: no-repeat;
}

.purple.project-box:after {
  background-image: url(../images/purple-cruve.svg);
}

.green.project-box:after {
  background-image: url(../images/green-cruve.svg);
}

.blue.project-box:after {
  background-image: url(../images/blue-cruve.svg);
}

.project-card .add-search-people a {
  width: 87px;
  height: 64px;
  box-shadow: none;
}

.project-card .add-search-people {
  bottom: 110px;
}

.date-number {
  color: #24908A;
  font-size: 17px;
  font-weight: 500;
}

.offcanvas-ProjectInfo,
.offcanvas-CreateProject {
  z-index: 999999;
}

.project-title-info .date {
  display: block;
  font-size: 15px;
  color: #24908A;
}

.project-title-info h2 {
  font-size: 20px;
  color: #454545;
  font-weight: 500;
  margin: 0px;
  padding-bottom: 12px;
}

.project-title-info .left-title {
  width: 86%;
  padding-right: 15px;
  border-bottom: 2px solid #DFDFDF
}

.project-title-info .right-action {
  width: 14%;
  display: flex;
  justify-content: flex-end;
}

.swtich-case-method .switch {
  width: 100px;
  height: 33px;
}

.swtich-case-method.swtich-case-action .switch__circle {
  width: 74px;
  height: 28px;
}

.swtich-case-method.swtich-case-action .checkbox:not(:checked)~.switch .switch__circle {
  left: 22px;
  background-color: #E45B5B;
}

.swtich-case-method.swtich-case-action .switch__left,
.swtich-case-action .switch__right {
  font-size: 14px;
  padding: 0px 8px;
}

.swtich-case-method.swtich-case-action .switch__right {
  color: #fff;
}

.swtich-case-method.swtich-case-action .switch__left {
  color: #fff;
}

.swtich-case-method.swtich-case-action .checkbox:checked~.switch .switch__circle {
  background-color: #3CB2AB;
}

.swtich-case-method.swtich-case-action .checkbox:checked~.switch .switch__circle-inner {
  background-color: transparent;
}

.swtich-case-method.swtich-case-action .checkbox:not(:checked)~.switch .switch__circle .switch__circle-inner {
  background-color: transparent;
}

.swtich-case-action.swtich-case-method {
  margin-top: 0;
}

.designations-info {
  padding: 12px 0px 16px;
}

.designations-info .leftdesignations {
  width: 86%;
  padding-right: 15px;
}

.designations-info .rightdesignations {
  width: 14%;
  display: flex;
  justify-content: flex-end;
}

.designations-info p {
  margin: 0;
  padding: 0;
  color: #454545;
  font-size: 18px;
  line-height: 21px;
}

.switch-active-case .switch {
  width: 100px;
  height: 33px;
}

.switch-active-case .switch__circle {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  padding: 0;
}

.switch-active-case .checkbox:checked~.switch .switch__circle {
  left: 5px;
  right: 0;
}

.switch-active-case .checkbox:not(:checked)~.switch .switch__circle {
  left: 5px;
  right: 0;
}

.switch-active-case .checkbox:checked~.switch {
  background-color: #fff;
  border: 1px solid #3CB2AB;
}

.switch-active-case .checkbox:checked~.switch .switch__right {
  color: #3CB2AB;
  display: flex;
  justify-content: flex-end;
  width: 100%;
}

.switch-active-case .checkbox:checked~.switch .switch__circle .switch__circle-inner {
  background-color: #3CB2AB;
}

.switch-active-case .switch__left,
.switch-active-case .switch__right {
  display: none;
  font-size: 14px;
}

.switch-active-case .checkbox:not(:checked)~.switch {
  background-color: #fff;
  border: 1px solid #BBBBBB;
}

.switch-active-case .checkbox:not(:checked)~.switch .switch__left {
  color: #BBBBBB;
  display: flex;
  justify-content: flex-end;
  width: 100%;
}

.switch-active-case .checkbox:not(:checked)~.switch .switch__circle .switch__circle-inner {
  background-color: #BBBBBB;
}

.last-activity {
  padding-top: 25px;
}

.last-activity a {
  color: #929292;
  font-size: 16px;
}

.last-activity a span {
  color: #249089;
}

.last-activity a b {
  font-weight: 600;
}

.project-cardbox .user-project figure {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 14px;
}

.project-cardbox .user-project .postition-title {
  font-size: 16px;
  display: block;
  color: #525252;
  line-height: 16px;
}

.project-cardbox .user-project strong {
  display: block;
  font-size: 20px;
  color: #249089;
  font-weight: 500;
}

.project-info-list.listing-card>li {
  margin-bottom: 32px;
}

.project-info-list.listing-card li .project-cardbox {
  position: relative;
}

.project-action-info ul li {
  margin: 0px !important;
}

.project-action-info ul li a {
  font-size: 16px;
  color: #3CB2AB;
  display: block;
  text-align: right;
}

.project-action-info ul {
  box-shadow: 0px 2px 10px 0px #00000040;
  border: none;
  border-radius: 10px;
}

.project-action-info {
  font-size: 15px;
  color: #454545;
}

.listing-card li .project-action-info a {
  font-size: 16px;
  color: #3CB2AB;
  display: block;
  text-align: right;
}

.project-action-info ul li a.removelink {
  color: #454545;
}

.listing-card li .project-action-info a.selectlink {
  color: #454545;
}

.btn-grp a.downloadbtn:hover img {
  filter: brightness(0) invert(1);
}

.btn-grp a.downloadbtn img {
  margin-right: 7px;
}

.btn-grp a.trashbtn img {
  margin-right: 7px;
}

.btn-grp a.trashbtn:hover img {
  filter: brightness(0) invert(1);
}

.call-sheet {
  margin-top: 30px;
}

.call-sheet a {
  color: #3CB2AB;
  font-size: 18px;
  font-weight: 500;
}

.linkproject-modal p {
  font-size: 18px;
  margin-bottom: 20px;
}

.linkproject-modal p strong {
  color: #3CB2AB;
  font-weight: 500;
}

.link-listing {
  margin-bottom: 26px;
}

.link-listing li {
  border-bottom: 1px solid #ddd;
  padding: 10px 0px;
}

.link-listing li .link-card .link-name {
  color: #249089;
  font-size: 20px;
  font-weight: 500;
  flex-grow: 1;
  display: flex;
  width: 80%;
  align-items: center;
  padding-right: 12px;
}

.link-listing li .link-action {
  width: 20%;
}

.project-activity p {
  color: #929292;
  font-size: 16px;
  line-height: 24px;
}

.project-activity p b {
  font-weight: 600;
}

.project-activity ul li {
  color: #929292;
  font-size: 16px;
  line-height: 24px;
  margin-bottom: 22px;
}

.project-activity ul li b {
  font-weight: 600;
}

.project-activity ul {
  list-style: disc;
  padding-left: 30px;
}

.project-activity {
  border-bottom: 2px solid #E3E3E3;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

.callsheet-listing {
  margin: 0px;
  padding: 0;
}

.callsheet-listing li {
  list-style: none;
  display: block;
  position: relative;
  margin-bottom: 22px;
  padding-right: 45px;
}

.callsheet-listing li a {
  display: block;
  box-shadow: 0px 0px 4px 0px #00000040;
  border-radius: 20px;
  padding: 12px;
}

.callsheet-listing li a strong {
  color: #3CB2AB;
  font-weight: 500;
  font-size: 17px;
}

.callsheet-listing li a span {
  font-size: 14px;
  color: #454545;
}

.callsheet-listing li .date {
  font-size: 12px;
  color: #454545;
}

.callsheet-listing li .clock-image {
  position: absolute;
  bottom: 0px;
  right: 0px;
  top: 20px;
  margin: auto;
}

.callsheet-listing li a.active {
  border: 2px solid #3CB2AB
}

.callsheet-listing li.disabled a {
  background-color: #ECECEC;
  pointer-events: none;
}

.callsheet-listing li.disabled a strong {
  color: #ADADAD;
}

.callsheet-listing li.disabled img {
  filter: grayscale(1);
}

.callsheet-bottom {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  padding-bottom: 22px;
  overflow-y: hidden;
  overflow-x: auto;
}

.callsheet-bottom li {
  width: 320px;
  flex: 0 0 320px;
  padding-right: 20px;
  min-height: 156px;
}

.callsheet-bottom li:last-child {
  padding: 0;
}

.callsheet-bottom li .callsheet-box {
  border: 1px solid #454545;
  border-radius: 15px;
  padding: 20px;
  height: 100%;
}

.callsheet-bottom li .callsheet-box strong {
  color: #3CB2AB;
  font-weight: 500;
  font-size: 15px;
}

.callsheet-bottom li .callsheet-box p {
  margin: 0;
  font-weight: 500;
  color: #454545;
  font-size: 16px;
}

.callsheet-section .user-project {
  width: 80%;
  padding-right: 12px;
}

.callsheet-section .project-action-info {
  width: 20%;
}

.time-table-work {
  margin: 20px 0px;
  border-radius: 13px;
  background-color: #3CB2AB;
}

.time-table-work .toptime {
  text-align: center;
}

.time-table-work .toptime strong {
  color: #fff;
  font-size: 18px;
  font-weight: 500;
}

.time-table-work .toptime {
  border-right: 2px solid #fff;
  width: 33.33%;
  padding: 10px 0px 5px;
}

.time-table-work .toptime:last-child {
  border: none;
}

.time-table-work .toptime span {
  font-size: 16px;
  font-weight: 500;
  color: #454545;
  line-height: 18px;
}

.call-time {
  border-top: 2px solid #fff;
  border-bottom: 2px solid #fff;
  padding: 12px 0px;
}

.call-time strong {
  color: #fff;
  font-size: 29px;
  font-weight: 700;
  line-height: 33px;
}

.calltime-work {
  padding: 8px 0px;
  color: #fff;
}

.calltime-work span {
  font-size: 14px;
  color: #454545;
}

.calltime-work strong {
  font-size: 16px;
  font-weight: 500;
}

.call-sheet-detail {
  box-shadow: 0px 0px 8px 0px #00000040;
  border-radius: 13px;
  position: relative;
}

.call-sheet-detail .titlework {
  padding: 16px 20px;
  border-bottom: 2px solid #DFDFDF;
}

.call-sheet-detail .titlework span {
  font-size: 15px;
  color: #24908A;
  font-weight: 500;
}

.call-sheet-detail .titlework h2 {
  font-size: 20px;
  color: #454545;
  margin: 0px;
  font-weight: 500;
}

.call-sheet-detail .editdetail {
  position: absolute;
  top: 8px;
  right: 8px
}

.location-info {
  padding: 16px 20px;
  border-bottom: 2px solid #DFDFDF;
}

.location-info .location-card {
  display: flex;
  margin-bottom: 20px;
}

.location-info .location-card .left-location {
  width: 80%;
  position: relative;
  padding-left: 26px;
}

.location-info .location-card .left-location:after {
  position: absolute;
  top: 6px;
  left: 0px;
  content: '';
  background-repeat: no-repeat;
  background-image: url(../images/marker-pin.svg);
  height: 19px;
  width: 19px;
}

.location-info .location-card .left-location {
  color: #24908A;
  font-size: 18px;
  font-weight: 500;
  line-height: 25px;
}

.location-info .location-card .left-location strong {
  color: #454545;
}

.location-info .location-card .location-time {
  width: 20%;
  text-align: right;
  color: #454545;
  font-size: 16px;
}

.location-info .location-card:last-child {
  margin: 0;
}

.category-namebox {
  padding: 16px 20px;
  position: relative;
  padding-left: 46px;
}

.category-namebox:after {
  position: absolute;
  top: 18px;
  left: 20px;
  content: '';
  background-repeat: no-repeat;
  background-image: url(../images/marker-pin.svg);
  height: 19px;
  width: 19px;
}

.category-namebox {
  color: #24908A;
  font-size: 18px;
  font-weight: 500;
  line-height: 25px;
}

.category-namebox strong {
  color: #454545;
}

@media (min-width:768px) {
  .container {
    width: 100%;
    max-width: 920px;
  }
}

@media (max-width:991px) {
  .whitebox {
    padding: 45px 50px;
  }
}

@media (max-width:767px) {
  .container {
    max-width: 100%;
  }

  .whitebox {
    margin: 15px 0;
    padding: 30px 25px;
    min-height: 600px;
  }

  .offcanvas-end {
    width: 100%;
  }

  .form-group {
    margin-bottom: 22px;
  }

  .list-card {
    margin-bottom: 18px;
  }

  .list-card label {
    font-size: 14px;
  }

  .list-card p {
    font-size: 16px;
  }

  .navbar-bottom ul li a {
    font-size: 12px;
  }

  .navbar-bottom ul li a img {
    margin-bottom: 5px;
  }

  .navbar-bottom {
    height: 70px;
  }

  .user-info h2 {
    font-size: 18px;
  }

  .user-profile-detail ul li label {
    margin-right: 5px;
    width: 80px;
  }

  .user-project-profile .fill-btn {
    margin-right: 6px;
  }

  .nav.nav-pills {
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .video-artist-box p {
    font-size: 14px;
    line-height: 20px;
  }

  .artist-work-list span {
    font-size: 12px;
  }

  .video-artist-listing {
    margin: 0px -5px;
  }

  .video-artist-listing li {
    padding: 0px 5px;
    margin-bottom: 12px;
  }

  .other-project-profile .contactaction {
    height: 55px;
    width: 55px;
  }

  .other-project-profile .contactaction img {
    max-width: inherit;
  }


  .project-title-info h2,
  .designations-info p {
    font-size: 16px;
  }

  .project-title-info .left-title,
  .designations-info .leftdesignations {
    width: 78%;
  }

  .project-title-info .right-action,
  .designations-info .rightdesignations {
    width: 28%;
  }

  .project-card .search-city {
    width: 53%;
  }

  .project-cardbox .user-project strong {
    font-size: 16px;
    line-height: 20px;
  }

  .project-cardbox .user-project {
    width: 70%;
  }

  .project-info-body .btn-grp a {
    width: 100%;
    margin: 10px 5px;
    display: block;
  }
}

@media (max-width:399px) {
  .video-artist-listing {
    margin: 0px;
  }

  .video-artist-listing li {
    padding: 0px;
    width: 100%;
    margin-bottom: 12px;
  }

  .other-project-profile .btn {
    font-size: 14px;
  }

}

.work-showcase .nav.nav-pills {
  flex-wrap: nowrap;
  overflow-x: auto;
}

.project-box.red:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  background-color: red;
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box.yellow_project_status:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  background-color: rgb(255, 255, 0);
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box.green_project_status:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  background-color: rgb(5, 44, 5);
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box.red_project_status:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  background-color: rgb(255, 0, 0);
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box.blue_project_status:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  background-color: rgb(0, 0, 255);
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box.purple_project_status:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  background-color: rgb(128, 0, 128);
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box.brown_project_status:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  /*background-color: rgb(150, 75, 0);*/
  background-color: #A52A2A;
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box.grey_project_status:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  /*background-color: rgb(211, 211, 211);*/
  background-color: #E4E2E2;
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box.dark_grey_project_status:after {
  top: -28px;
  right: -22px;
  height: 50px;
  width: 50px;
  /*background-color: rgb(10, 10, 10);*/
  background-color: #A09C9C;
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
}

.project-box {
  overflow: hidden;
}


.swtich-case.d-flex.switch-active-case {
  position: relative;
}

.switch-circle {
  /*background-color: #3CB2AB;*/
  border-radius: 50%;
  display: block;
  height: 25px;
  width: 25px;
  position: absolute;
  left: 6px;
  top: 4px;
  cursor: pointer;
}

.custom-switch ul {
  border-radius: 12px;
  background: #FFF;
  -webkit-box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.50);
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.50);
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  position: absolute;
  right: 65px;
  top: 40px;
  min-width: 140px;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}

.custom-switch ul.show {
  opacity: 1;
  visibility: visible;
}

.custom-switch ul li {
  padding: 5px;
  width: 33.33%;
}

.custom-switch ul li a {
  display: block;
  width: 33px;
  height: 33px;
  border-radius: 50%;
}

.redswitch {
  background-color: #D97474;
}

.greenswitch {
  background-color: #4FC754;
}

.purpleswitch {
  background-color: #877AD4;
}

.yellowswitch {
  background-color: #D2D47A;
}

.blueswitch {
  background-color: #74A2D8;
}

.brownswitch {
  background-color: #A52A2A;
}

.lightgrayswitch {
  background-color: #E4E2E2;
}

.darkgrayswitch {
  background-color: #A09C9C;
}

.add-new-bill-btn {
  justify-content: right !important;
  padding-bottom: 20px;
}

.back-btn {
  justify-content: right !important;
}

.bills-content {
  color: #3CB2AB;
  font-size: 17px;
  font-weight: 500;
  flex-grow: 1;
  padding-right: 24px;
}

.bills-content span {
  display: block;
  font-size: 14px;
  font-weight: 300;
  color: #454545;
}
.bills-content strong {
  font-weight: 500;
}