@import url("https://fonts.googleapis.com/css?family=Merriweather:700,900|Comfortaa|Open+Sans:100,300,400,500,700");

/* Reset */
* {
  margin: 0;
  padding: 0;
  outline: none;
}

/* Custom Scrollbar works on Firefox only */
* {
  scrollbar-width: thin;
  scroll-behavior: smooth;
  scrollbar-color: #b0b0b0 #dfdedd;
}

/* Custom Scrollbar works on Chrome/Edge/Safari */
*::-webkit-scrollbar {
  width: 0.3rem;
  height: 0.5rem;
}
*::-webkit-scrollbar-track {
  background: #dfdedd;
}
*::-webkit-scrollbar-thumb {
  background-color: #b0b0b0;
}

body {
  width: 100vw;
  height: 100vh;
  color: #656364;
  overflow: hidden;
  font-weight: 300;
  font-family: "Open Sans", sans-serif;
  background-color: #eae7f1;
  background-image: url(/assets/images/coffee-loader.gif);
  background-repeat: no-repeat;
  background-size: 150px;
  background-position: center;
}

a {
  color: #3a1484;
  cursor: pointer;
  user-select: none;
  text-decoration: none;
}
button {
  cursor: pointer;
  user-select: none;
}
a::-moz-focus-inner,
button::-moz-focus-inner {
  border: 0;
}
b,
strong {
  font-weight: bold;
}
small,
.small {
  font-size: 80%;
}
.h1,
h1,
.h2,
h2,
.h3,
h3,
.h4,
h4,
.h5,
h5,
.h6,
h6 {
  color: inherit;
  font-weight: 500;
  line-height: 1.25;
  font-family: inherit;
}
h1 {
  font-size: 2.5rem;
}
h2 {
  font-size: 2.25rem;
}
h3 {
  font-size: 2rem;
}
h4 {
  font-size: 1.75rem;
}
h5 {
  font-size: 1.5rem;
}
h6 {
  font-size: 1.25rem;
}
p {
  font-size: 1rem;
}
input,
select,
button,
optgroup,
textarea {
  font-family: "Open Sans", sans-serif;
}
textarea {
  resize: vertical;
}
input,
select,
textarea {
  background: none;
}

img {
  overflow: hidden;
  position: relative;
  display: inline-block;
}
img::after {
  top: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  align-items: center;
  background-size: 100%;
  justify-content: center;
  background-color: #ffffff;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(/assets/images/no-image.png);
}

.d-flex{ display: flex !important; }

.flex-1{ flex: 1 !important; }
.flex-row{ flex-direction: row !important; }
.flex-row-reverse{ flex-direction: row-reverse !important; }
.flex-column{ flex-direction: column !important; }
.flex-column-reverse{ flex-direction: column-reverse !important; }

.h-100{ height: 100% !important; }

.mb-1{ margin-bottom: 1rem !important; }
.mb-2{ margin-bottom: 2rem !important; }
.mb-3{ margin-bottom: 3rem !important; }
.mb-4{ margin-bottom: 4rem !important; }
.mb-5{ margin-bottom: 5rem !important; }

.mr-1{ margin-right: 1rem !important; }
.mr-2{ margin-right: 2rem !important; }
.mr-3{ margin-right: 3rem !important; }
.mr-4{ margin-right: 4rem !important; }
.mr-5{ margin-right: 5rem !important; }

.ml-1{ margin-left: 1rem !important; }
.ml-2{ margin-left: 2rem !important; }
.ml-3{ margin-left: 3rem !important; }
.ml-4{ margin-left: 4rem !important; }
.ml-5{ margin-left: 5rem !important; }

.mt-1{ margin-top: 1rem !important; }
.mt-2{ margin-top: 2rem !important; }
.mt-3{ margin-top: 3rem !important; }
.mt-4{ margin-top: 4rem !important; }
.mt-5{ margin-top: 5rem !important; }

.mtb-1{ margin: 1rem 0 !important; }
.mtb-2{ margin: 2rem 0 !important; }
.mtb-3{ margin: 3rem 0 !important; }
.mtb-4{ margin: 4rem 0 !important; }
.mtb-5{ margin: 5rem 0 !important; }

.mlr-1{ margin: 0 1rem !important; }
.mlr-2{ margin: 0 2rem !important; }
.mlr-3{ margin: 0 3rem !important; }
.mlr-4{ margin: 0 4rem !important; }
.mlr-5{ margin: 0 5rem !important; }

.m-0{ margin: 0 !important; }
.mt-0{ margin-top: 0 !important; }
.ml-0{ margin-left: 0 !important; }
.mr-0{ margin-right: 0 !important; }
.mb-0{ margin-bottom: 0 !important; }

.p-0{ padding: 0 !important; }
.pt-0{ padding-top: 0 !important; }
.pl-0{ padding-left: 0 !important; }
.pr-0{ padding-right: 0 !important; }
.pb-0{ padding-bottom: 0 !important; }

.flex-1{ flex:1 !important; }

.align-start{ align-items:flex-start !important; }
.align-center{ align-items:center !important; }
.align-end{ align-items:flex-end !important; }
.align-self-start{ align-self:flex-start !important; }
.align-self-center{ align-self:center !important; }
.align-self-end{ align-self:flex-end !important; }

.justify-start{ justify-content:flex-start !important; }
.justify-center{ justify-content:center !important; }
.justify-end{ justify-content:flex-end !important; }
.justify-self-start{ justify-self:flex-start !important; }
.justify-self-center{ justify-self:center !important; }
.justify-self-end{ justify-self:flex-end !important; }

.text-left{ text-align: left !important; }
.text-right{ text-align: right !important; }
.text-center{ text-align: center !important; }
.text-justify{ text-align: justify !important; }

.text-underline{ text-decoration: underline !important; }

.orange{ color: #EB9B3F !important; }
.green{ color: #4BB99A !important; }
.red{ color: #E23E34 !important; }

.no-bg{ background: none !important; }
.no-border{ border: none !important; }
.no-box-shadow{ box-shadow: none !important; }

.toggle-option {
  width: 3rem;
  display: flex;
  height: 1.4rem;
  position: relative;
  align-items: center;
  justify-content: space-between;
}
.toggle {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.4s;
  cursor: pointer;
  position: absolute;
  border-radius: 2.1rem;
  background-color: #cccccc;
}
.toggle:before {
  left: 4px;
  bottom: 2px;
  content: "";
  width: 1.1rem;
  height: 1.1rem;
  transition: 0.4s;
  border-radius: 50%;
  position: absolute;
  background-color: white;
}
.toggle.on {
  background-color: #3a1484;
  box-shadow: 0 0 1px #3a1484;
}
.toggle.on:before {
  transform: translateX(1.4rem);
}
.toggle.off {
  background-color: #cccccc;
}
.toggle-option.small {
  width: 2rem;
  height: 1rem;
}
.toggle-option.small .toggle:before {
  left: 2px;
  width: 0.75rem;
  height: 0.75rem;
}
.toggle-option.small .toggle.on:before {
  transform: translateX(1rem);
}

.table,
table {
  margin: 0;
}
/*.table tbody tr:nth-child(odd) {
   background-color:#f3f1f9;
}*/
small.info {
  font-size: 75%;
  font-weight: 400;
  margin-top: 0.5rem;
  display: inline-flex;
}
.trash {
  align-self: center;
  color: #d24646 !important;
  border-color: #d24646 !important;
}
.hide {
  display: none !important;
}
.m-0 {
  margin: 0 !important;
}
.mb-1 {
  margin-bottom: 1rem !important;
}
.ml-1 {
  margin-left: 1rem !important;
}
.mb-05 {
  margin-bottom: 0.5rem !important;
}
.p-0 {
  padding: 0 !important;
}
.p-05 {
  padding: 0.5rem !important;
}
.h-100 {
  height: 100% !important;
}
.w-auto {
  width: auto !important;
}
.flex-end {
  justify-content: flex-end !important;
}
.fade {
  transition: opacity 300ms linear 700ms, transform 300ms linear 700ms;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
}
.fade.out {
  opacity: 0;
}
@keyframes fadeEffect {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.animation {
  animation: fadeEffect 1.75s;
}
.required {
  color: #ec4254;
}
.space-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.short-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 300px;
}
.short-text * {
  display: inline-block;
}
.hs-1 {
  display: flex;
  margin: 0.5rem 0;
}

/* Structures */
#app {
  width: 100%;
  height: 100%;
  display: flex;
}
#wrapper {
  flex: 1;
  height: 100%;
  display: flex;
  overflow: hidden;
  flex-direction: column;
}
#scrollable {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: #f6f6f6;
}
.empty {
  width: 100%;
  height: 100%;
  display: flex;
  color: #9c9c9c;
  font-size: 1.5rem;
  text-align: center;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.empty i {
  color: #d1d1d1;
  font-size: 4rem;
  margin-bottom: 1rem;
}
.empty h3 {
  font-size: 1.5rem;
}
.empty.white {
  background-color: #ffffff;
}
.empty.shadow {
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.04);
}
.empty.radius {
  border-radius: 0.25rem;
}
#scrollable .content {
  padding: 1rem;
  position: relative;
}
#scrollable .content .content-top {
  margin-bottom: 0.5rem;
}

.empty .btn,
.empty .new-btn{
  margin-top: 1rem;
}
.empty .new-btn i{
  margin: 0;
  font-size: 0.85rem;
}
.empty .btn i{
  margin: 0;
  font-size: 1rem;
}

.coming-soon {
  top: 0;
  left: 0;
  z-index: 9;
  width: 100%;
  height: 100%;
  display: flex;
  font-size: 2rem;
  position: absolute;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.5);
}

/* Inputs, Buttons */
.group {
  display: block;
  margin-bottom: 1.5rem;
}
.group label {
  display: flex;
  color: #464a4c;
  align-items: center;
  margin-bottom: 0.5rem;
}
.group .dropdown {
  display: block;
  border: 1px solid rgba(0, 0, 0, 0.15);
}
.multi-controls {
  display: flex;
}
.controls {
  width: 100%;
  display: block;
  font-size: 1rem;
  line-height: 1.25;
  border-radius: 0.25rem;
  box-sizing: border-box;
  background-color: #fff;
  padding: 0.5rem 0.75rem;
  border: 1px solid rgba(0, 0, 0, 0.15);
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.multi-controls .controls:first-child {
  border-radius: 0.25rem 0 0 0.25rem;
  margin-right: -1px;
}
.controls.small {
  width: 8rem;
}
.multi-controls .controls:last-child {
  border-radius: 0 0.25rem 0.25rem 0;
}
input[type="range"]{
  width: 100%;
  outline: none;
}

/* Buttons */
.new-btn {
  outline: none;
  cursor: pointer;
  overflow: hidden;
  font-weight: 400;
  user-select: none;
  font-size: 0.85rem;
  text-align: center;
  align-items: center;
  white-space: nowrap;
  display: inline-flex;
  vertical-align: middle;
  border-radius: 0.25rem;
  text-overflow: ellipsis;
  justify-content: center;
  transition: box-shadow 0.3s ease-in-out;
}
.new-btn i {
  padding: 0.5rem;
}
.new-btn span {
  line-height: 1.5;
  padding: 0 0.75rem;
}
.new-btn:hover {
  box-shadow: 0 4px 7px 0 rgba(0, 0, 0, 0.07);
}
.new-btn.new-btn-cancel,
.new-btn.new-btn-cancel:focus {
  color: #ffffff;
  border: 1px solid #5b5b5b;
  background-color: #5b5b5b;
}
.new-btn.new-btn-cancel i {
  background-color: #4a4a4a;
}
.new-btn.new-btn-cancel:hover {
  background-color: #4a4a4a;
}
.new-btn.new-btn-trash,
.new-btn.new-btn-trash:focus {
  color: #ffffff;
  border: 1px solid #ff4336;
  background-color: #ff4336;
}
.new-btn.new-btn-trash i {
  background-color: #f52415;
}
.new-btn.new-btn-trash:hover {
  background-color: #f52415;
}
.new-btn.new-btn-warning,
.new-btn.new-btn-warning:focus {
  color: #ffffff;
  border: 1px solid #de8216;
  background-color: #de8216;
}
.new-btn.new-btn-warning i {
  background-color: #cf7002;
}
.new-btn.new-btn-warning:hover {
  background-color: #cf7002;
}
.new-btn.new-btn-success,
.new-btn.new-btn-success:focus {
  color: #ffffff;
  border: 1px solid #24A984;
  background-color: #24A984;
}
.new-btn.new-btn-success i {
  background-color: #17795d;
}
.new-btn.new-btn-success:hover {
  background-color: #17795d;
}
.new-btn.new-btn-save,
.new-btn.new-btn-save:focus {
  color: #ffffff;
  border: 1px solid #7f5cc5;
  background-color: #7f5cc5;
}
.new-btn.new-btn-save i {
  background-color: #3a1484;
}
.new-btn.new-btn-save:hover {
  background-color: #3a1484;
}
.new-btn.new-btn-save-outline,
.new-btn.new-btn-save-outline:focus {
  color: #5b5b5b;
  border: 1px solid #dddddd;
  background-color: #dddddd;
}
.new-btn.new-btn-save-outline i {
  background-color: #cccccc;
}
.new-btn.new-btn-save-outline:hover {
  background-color: #cccccc;
}

.new-btn.new-btn-white,
.new-btn.new-btn-white:focus {
  color: #1d2b35;
  border: 1px solid #e9dffd;
  background-color: #ffffff;
}
.new-btn.new-btn-white i {
  background-color: #e9dffd;
}
.new-btn.new-btn-white:hover {
  background-color: #e9dffd;
}

.new-btn.new-btn-sky,
.new-btn.new-btn-sky:focus {
  color: #1d2b35;
  border: 1px solid #2f54eb;
  background-color: #e4e8f9;
}
.new-btn.new-btn-sky.active,
.new-btn.new-btn-sky.active:focus {
  color: #ffffff;
  border: 1px solid #2f54eb;
  background-color: #2f54eb;
}
.new-btn.new-btn-sky i {
  color: #ffffff;
  background-color: #2f54eb;
}
.new-btn.new-btn-sky:hover {
  color: #ffffff;
  background-color: #2f54eb;
}

.new-btn.new-btn-facebook,
.new-btn.new-btn-facebook:focus {
  color: #ffffff;
  border: 1px solid #5475c1;
  background-color: #5475c1;
}
.new-btn.new-btn-facebook i {
  background-color: #4b69b0;
}
.new-btn.new-btn-facebook:hover {
  background-color: #4b69b0;
}
.new-btn.new-btn-twitter,
.new-btn.new-btn-twitter:focus {
  color: #ffffff;
  border: 1px solid #3dc5f3;
  background-color: #3dc5f3;
}
.new-btn.new-btn-twitter i {
  background-color: #1cb7eb;
}
.new-btn.new-btn-twitter:hover {
  background-color: #1cb7eb;
}
.new-btn.new-btn-linkedin,
.new-btn.new-btn-linkedin:focus {
  color: #ffffff;
  border: 1px solid #1287bf;
  background-color: #1287bf;
}
.new-btn.new-btn-linkedin i {
  background-color: #0e76a8;
}
.new-btn.new-btn-linkedin:hover {
  background-color: #0e76a8;
}
.new-btn.new-btn-google,
.new-btn.new-btn-google:focus {
  color: #ffffff;
  border: 1px solid #f95e59;
  background-color: #f95e59;
}
.new-btn.new-btn-google i {
  background-color: #e83f3a;
}
.new-btn.new-btn-google:hover {
  background-color: #e83f3a;
}
.new-btn.new-btn-outlook,
.new-btn.new-btn-outlook:focus {
  color: #ffffff;
  border: 1px solid #0490f7;
  background-color: #0490f7;
}
.new-btn.new-btn-outlook i {
  background-color: #0072c6;
}
.new-btn.new-btn-outlook:hover {
  background-color: #0072c6;
}
.new-btn.new-btn-upload {
  display: flex;
  position: relative;
  justify-content: center;
}
.new-btn.new-btn-upload input[type="file"] {
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  position: absolute;
}
.new-btn.new-btn-upload i {
  margin-right: 0.5rem;
}
.new-btn.new-btn-disabled,
.new-btn.new-btn-disabled:focus {
  cursor: default;
  border-color: #ded7ec;
  background-color: #ded7ec;
}
.new-btn.new-btn-save.disabled,
.new-btn.new-btn-success.disabled {
  border-color: #bdbdbd;
  background-color: #bdbdbd;
}
.new-btn.new-btn-save.disabled i,
.new-btn.new-btn-success.disabled i {
  background-color: #9a9a9a;
}

/* Round Button */
.btn-round {
  z-index: 0;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 0.5rem;
  background: none;
  position: relative;
  border-radius: 50%;
  align-items: center;
  display: inline-flex;
  white-space: pre-wrap;
  justify-content: center;
  -webkit-font-smoothing: antialiased;
}
.btn-round::before {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  z-index: -1;
  content: "";
  display: block;
  position: absolute;
  border-radius: 50%;
  transform: scale(0);
  background: #7f5cc5;
  transition-duration: 0.15s;
  transition-property: transform, opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-round:hover::before {
  opacity: 0.06;
  transform: scale(1);
}
.btn-round.active::before {
  opacity: 0.2;
  transform: scale(1);
}

.btn {
  opacity: 0.8;
  outline: none;
  color: #292b2c;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.45;
  user-select: none;
  text-align: center;
  align-self: center;
  white-space: nowrap;
  border-radius: 5rem;
  display: inline-block;
  padding: 0.25rem 1rem;
  vertical-align: middle;
  text-overflow: ellipsis;
  border: 1px solid #292b2c;
  background-color: #f1f1f1;
  transition: padding 0.2s ease-in-out, opacity 0.2s ease-in-out;
}
.btn.oval {
  border-radius: 25rem;
  padding: 0.25rem 1rem !important;
}
.btn::-moz-focus-inner {
  border: 0;
}
.btn:hover {
  opacity: 1;
}
.btn-secondary {
  color: #333;
  border-color: #ccc;
  background-color: #fff;
}

.btn.btn-trash,
.btn.btn-trash:focus {
  color: #fff;
  border-color: #ff4336;
  background-color: #ff4336;
}
.btn.btn-success,
.btn.btn-success:focus {
  color: #fff;
  border-color: #28ab4a;
  background-color: #4ab12a;
}
.btn.btn-save,
.btn.btn-save:focus {
  color: #fff;
  border-color: #3a1484;
  background-color: #3a1484;
}
.btn.btn-save-outline,
.btn.btn-save-outline:focus {
  color: #3a1484;
  border-color: #3a1484;
  background-color: #fff;
}
.btn.btn-save-outline:hover {
  background-color: #e5dbf6;
}
.btn.btn-cancel,
.btn.btn-cancel:focus {
  color: #666;
  border-color: #aaa;
  background-color: #fff;
}
.btn.btn-cancel:hover {
  background-color: #f2f2f2;
}
.btn.btn-disabled,
.btn.btn-disabled:focus {
  cursor: default;
  border-color: #ded7ec;
  background-color: #ded7ec;
}
.btn.btn-upload {
  display: flex;
  position: relative;
  justify-content: center;
}
.btn.btn-upload input[type="file"] {
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  position: absolute;
}
.btn.btn-upload i {
  margin-right: 0.5rem;
}
.btn.btn-circle {
  padding: 0;
  border-radius: 50%;
  align-items: center;
  display: inline-flex;
  justify-content: center;
  box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.35);
}
.btn.btn-square {
  border-radius: 0;
}
.btn.btn-oval {
  border-radius: 5rem;
}
.btn.btn-icon {
  padding: 0.25rem;
}
.btn.btn-lg {
  font-size: 1.5rem;
  padding: 1rem 1.5rem;
}
.btn.btn-md {
  font-size: 1.25rem;
  padding: 0.75rem 1.25rem;
}
.btn.btn-sm {
  font-size: 0.85rem;
  padding: 0.5rem 0.75rem;
}
.btn.btn-xs {
  font-size: 0.7rem;
  padding: 0.25rem 0.5rem;
}
.btn.btn-save.disabled,
.btn.btn-success.disabled {
  border-color: #bdbdbd;
  background-color: #bdbdbd;
}
.btn.btn-save.btn-icon.disabled,
.btn.btn-success.btn-icon.disabled {
  border-color: #3a1484;
  background-color: #3a1484;
}
.btn.btn-gray {
  color: #ffffff;
  border-color: #5b5b5b;
  background-color: #5b5b5b;
}
.btn.btn-block {
  display: block !important;
}

.new-btn-sm {
  font-weight: lighter;
}
.new-btn-sm.black {
  color: #656364;
}
.new-btn-sm.navy {
  color: #343854;
}
.new-btn-sm.lightblue {
  color: #a7a7b2;
}
.new-btn-sm.blue {
  color: #2196f3;
}
.new-btn-sm.green {
  color: #4caf50;
}
.new-btn-sm.yellow {
  color: #ffc938;
}
.new-btn-sm.red {
  color: #f44336;
}
.new-btn-sm.purple {
  color: #9468e6;
}
.new-btn-sm.orange {
  color: #de8216;
}
.new-btn-sm.gray {
  color: gray;
}
.new-btn-sm.teal {
  color: #1cbcbc;
}
.new-btn-sm.facebook {
  color: #4b69b0;
}
.new-btn-sm.twitter {
  color: #1cb7eb;
}
.new-btn-sm.linkedin {
  color: #1686b0;
}
.new-btn-sm.google {
  color: #e83f3a;
}

.btn-action.no-fill {
  color: #666666;
  font-weight: lighter;
  background-color: #ffffff;
  border: 1px solid #666666;
}
.btn-action.no-fill:hover {
  color: #ffffff;
  background-color: #3a1484;
  border: 1px solid #3a1484;
}
.btn-action.no-fill.navy {
  color: #343854;
  border: 1px solid #343854;
  background-color: #ffffff;
}
.btn-action.no-fill.navy:hover {
  color: #ffffff;
  background-color: #343854;
}
.btn-action.no-fill.lightblue {
  color: #a7a7b2;
  border: 1px solid #a7a7b2;
  background-color: #ffffff;
}
.btn-action.no-fill.lightblue:hover {
  color: #ffffff;
  background-color: #a7a7b2;
}
.btn-action.no-fill.blue {
  color: #2196f3;
  border: 1px solid #2196f3;
  background-color: #ffffff;
}
.btn-action.no-fill.blue:hover {
  color: #ffffff;
  background-color: #2196f3;
}
.btn-action.no-fill.green {
  color: #4caf50;
  border: 1px solid #4caf50;
  background-color: #ffffff;
}
.btn-action.no-fill.green:hover {
  color: #ffffff;
  background-color: #4caf50;
}
.btn-action.no-fill.yellow {
  color: #ffc938;
  border: 1px solid #ffc938;
  background-color: #ffffff;
}
.btn-action.no-fill.yellow:hover {
  color: #ffffff;
  background-color: #ffc938;
}
.btn-action.no-fill.red {
  color: #f44336;
  border: 1px solid #f44336;
  background-color: #ffffff;
}
.btn-action.no-fill.red:hover {
  color: #ffffff;
  background-color: #f44336;
}
.btn-action.no-fill.purple {
  color: #9468e6;
  border: 1px solid #9468e6;
  background-color: #ffffff;
}
.btn-action.no-fill.purple:hover {
  color: #ffffff;
  background-color: #9468e6;
}
.btn-action.no-fill.orange {
  color: #de8216;
  border: 1px solid #de8216;
  background-color: #ffffff;
}
.btn-action.no-fill.orange:hover {
  color: #ffffff;
  background-color: #de8216;
}
.btn-action.no-fill.gray {
  color: gray;
  border: 1px solid gray;
  background-color: #ffffff;
}
.btn-action.no-fill.gray:hover {
  color: #ffffff;
  background-color: gray;
}
.btn-action.no-fill.teal {
  color: #1cbcbc;
  border: 1px solid #1cbcbc;
  background-color: #ffffff;
}
.btn-action.no-fill.teal:hover {
  color: #ffffff;
  background-color: #1cbcbc;
}
.btn-action.no-fill.facebook {
  color: #4b69b0;
  border: 1px solid #4b69b0;
  background-color: #ffffff;
}
.btn-action.no-fill.facebook:hover {
  color: #ffffff;
  background-color: #4b69b0;
}
.btn-action.no-fill.twitter {
  color: #1cb7eb;
  border: 1px solid #1cb7eb;
  background-color: #ffffff;
}
.btn-action.no-fill.twitter:hover {
  color: #ffffff;
  background-color: #1cb7eb;
}
.btn-action.no-fill.linkedin {
  color: #1686b0;
  border: 1px solid #0e76a8;
  background-color: #ffffff;
}
.btn-action.no-fill.linkedin:hover {
  color: #ffffff;
  background-color: #0e76a8;
}
.btn-action.no-fill.google {
  color: #e83f3a;
  border: 1px solid #e83f3a;
  background-color: #ffffff;
}
.btn-action.no-fill.google:hover {
  color: #ffffff;
  background-color: #e83f3a;
}
.btn-action.no-fill.salesforce {
  color: #1798c1;
  border: 1px solid #1798c1;
  background-color: #ffffff;
}
.btn-action.no-fill.salesforce:hover {
  color: #ffffff;
  background-color: #1798c1;
}

.btn-back {
  width: 2rem;
  height: 2rem;
  border: none;
  color: #ffffff;
  font-size: 1rem;
  border-radius: 50%;
  align-items: center;
  display: inline-flex;
  margin-right: 0.5rem;
  justify-content: center;
  background-image: linear-gradient(135deg, #3a1c71, #d76d77);
}

.disabled {
  opacity: 0.75;
  cursor: default;
  pointer-events: none;
}
.disabled i {
  opacity: 0.5;
}
.trash.disabled {
  border-color: #ffa7a7 !important;
}
.btn.btn-trash.disabled,
.new-btn.new-btn-trash.disabled {
  opacity: 0.25;
}

.btn span {
  font-size: 1rem;
}
.btn.red i,
.btn.gray i,
.btn.blue i,
.btn.green i,
.btn.purple i {
  color: #ffffff;
}
.btn.teal i,
.btn.yellow i,
.btn.orange i {
  color: #343854;
}
.btn.navy,
.btn.navy:focus {
  color: #ffffff;
  border-color: #343854;
  background-color: #343854;
}
.btn.lightblue,
.btn.lightblue:focus {
  color: #ffffff;
  border-color: #a7a7b2;
  background-color: #a7a7b2;
}
.btn.blue,
.btn.blue:focus {
  color: #ffffff;
  border-color: #2196f3;
  background-color: #2196f3;
}
.btn.green,
.btn.green:focus {
  color: #ffffff;
  border-color: #4caf50;
  background-color: #4caf50;
}
.btn.yellow,
.btn.yellow:focus {
  color: #343854;
  border-color: #ffc938;
  background-color: #ffc938;
}
.btn.red,
.btn.red:focus {
  color: #ffffff;
  border-color: #f44336;
  background-color: #f44336;
}
.btn.purple,
.btn.purple:focus {
  color: #ffffff;
  border-color: #9468e6;
  background-color: #9468e6;
}
.btn.orange,
.btn.orange:focus {
  color: #343854;
  border-color: #de8216;
  background-color: #de8216;
}
.btn.gray,
.btn.gray:focus {
  color: #ffffff;
  border-color: gray;
  background-color: gray;
}
.btn.teal,
.btn.teal:focus {
  color: #343854;
  border-color: #1cbcbc;
  background-color: #1cbcbc;
}

/* Gradient Style Button */
.btn.gradient.btn-trash,
.btn.gradient.btn-trash:focus {
  color: #fff;
  border: none;
  background-image: linear-gradient(135deg, #770707, #d24646);
}
.btn.gradient.btn-success,
.btn.gradient.btn-success:focus {
  color: #fff;
  border: none;
  background-image: linear-gradient(135deg, #4ab12a, #534646);
}
.btn.gradient.btn-save,
.btn.gradient.btn-save:focus {
  color: #fff;
  border: none;
  background-image: linear-gradient(135deg, #3a1484, #2a0d62);
}
.btn.gradient.btn-save-outline,
.btn.gradient.btn-save-outline:focus {
  border: none;
  color: #fff;
  background-image: linear-gradient(135deg, #ffffff, #534646);
}
.btn.gradient.btn-save-outline:hover {
  background-color: #e5dbf6;
}
.btn.gradient.btn-cancel,
.btn.gradient.btn-cancel:focus {
  color: #fff;
  border: none;
  background-image: linear-gradient(135deg, #cccccc, #534646);
}
.btn.gradient.btn-cancel:hover {
  background-color: #f2f2f2;
}
/* Gradient Style Button */

/* Btn Action with Colors */
.btn-action {
  color: #fff;
  width: 1.2rem;
  height: 1.2rem;
  font-size: 1rem;
  padding: 0.25rem;
  border-radius: 50%;
  font-weight: normal;
  align-items: center;
  display: inline-flex;
  justify-content: center;
  transform: translateZ(0);
  transition: transform 0.1s ease, box-shadow 0.1s ease;
}
.btn-action.blue {
  background-color: #2196f3;
}
.btn-action.green {
  background-color: #4caf50;
}
.btn-action.yellow {
  background-color: #e6cb09;
}
.btn-action.red {
  background-color: #f44336;
}
.btn-action.purple {
  background-color: #3a1484;
}
.btn-action.orange {
  background-color: #de8216;
}
.btn-action.gray {
  background-color: gray;
}
.btn-action.teal {
  background-color: #1cbcbc;
}
.btn-action:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 4px -2px #e2e2e2;
}
.btn-action.small {
  width: 0.6rem;
  height: 0.6rem;
  font-size: 0.6rem;
}
.btn-action.medium {
  width: 0.8rem;
  height: 0.8rem;
  font-size: 0.8rem;
}
/* Btn Action with Colors */

/* Dropdown Wrapper */
.dropdown-menu-wrapper .dropdown {
  width: 7rem;
  border: none;
  border-radius: 18px;
  background-color: #ffffff;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.04);
}
.dropdown-menu-wrapper .dropdown.show {
  border-radius: 18px 18px 0 0;
}
.dropdown-menu-wrapper .dropdown.show .dropdown-menu {
  top: 102%;
  border-color: #f7f7f7;
  border-radius: 0 0 1rem 1rem;
}
/* Dropdown Wrapper */

/* Loader */
._modal ._spinner {
  top: 0;
}

._requesting ._spinner {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2000;
  display: flex;
  position: absolute;
  align-items: center;
  justify-content: center;
  background-color: #464a4c10;
}

#custom-loader{
  width: 100vw;
  height: 100vh;
  display: none;
  background-color: #eae7f1;
  background-image: url(/assets/images/coffee-loader.gif);
  background-repeat: no-repeat;
  background-size: 150px;
  background-position: center;
}
#custom-loader.show{
  display: block;
}

.custom-inner-loader{
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: none;
  position: absolute;
  background-color: #eae7f1;
  background-image: url(/assets/images/coffee-loader.gif);
  background-repeat: no-repeat;
  background-size: 150px;
  background-position: center;
}
.custom-inner-loader.show{
  display: block;
}
/* Loader */

/* Modal */
.modal {
  opacity: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: absolute;
  transform: translate(-100%);
}
.modal.center {
  align-items: center;
  justify-content: center;
}
.modal.right {
  justify-content: flex-end;
}
.modal.open {
  opacity: 1;
  z-index: 1000;
  transform: translate(0);
  background-color: rgba(0, 0, 0, 0.4);
}
.modal .modal-content {
  display: flex;
  overflow: hidden;
  max-width: 30rem;
  background-color: #fff;
  flex-direction: column;
  box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.2), 0 5px 20px 0 rgba(0, 0, 0, 0.15);
}
.modal.center .modal-content {
  opacity: 0;
  margin-left: 5rem;
  border-radius: 0.5rem;
  transform: scale(0.5);
  transition: transform 0.3s cubic-bezier(0, 0.8, 0.6, 1);
}
.modal.center.open .modal-content {
  opacity: 1;
  transform: scale(1);
}
.modal.right .modal-content {
  height: 100%;
  width: 26rem;
  background-color: #fff;
  transform: translate3d(100%, 0, 0);
  transition: transform 0.3s cubic-bezier(0, 0.8, 0.6, 1);
}
.modal.right.open .modal-content {
  transform: translate3d(0, 0, 0);
}
.modal .modal-header {
  display: flex;
  color: #ffffff;
  align-items: center;
  padding: 0.5rem 1rem;
  background-color: #2a0d62;
  justify-content: space-between;
  border-bottom: 2px solid #5b5b5b;
  /* border-radius: 0.5rem 0.5rem 0 0; */
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.07);
}
.modal .modal-header .modal-tab li {
  flex: 1;
  display: flex;
  color: #ffffff;
  cursor: pointer;
  font-weight: 600;
  position: relative;
  text-align: center;
  align-items: center;
  padding: 0.75rem 1rem;
  justify-content: center;
  text-transform: uppercase;
  transition: color 0.3s ease;
  border-bottom: 2px solid transparent;
}
.modal .modal-header .modal-tab li:hover {
  color: #c2a6f9;
}
.modal .modal-header .modal-tab li.active,
.modal .modal-header .modal-tab li.active:hover {
  color: #de8216;
  border-color: #de8216;
}
.modal .modal-header .modal-tab li small.float-count {
  color: #ffffff;
  width: 1.25rem;
  height: 1.25rem;
  padding: 0.075rem;
  border-radius: 50%;
  font-size: 0.575rem;
  align-items: center;
  margin-left: 0.5rem;
  display: inline-flex;
  justify-content: center;
  background-color: #de8216;
}
.modal .modal-body {
  flex: 1;
  padding: 1rem;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
}
.modal.right .modal-body {
  overflow: auto;
}
.modal .modal-footer {
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-top: 1px solid #ddd;
}
.modal .modal-footer .btn {
  margin-left: 1rem;
}
.modal-title {
  display: block;
  overflow: hidden;
  font-size: 1.35rem;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.modal-body .modal-body-inner {
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
}
.modal-body .modal-body-left {
  z-index: 2;
  width: 2rem;
  height: 100%;
  position: fixed;
  background-color: #ebecee;
}
.modal-body .modal-body-right {
  flex: 1;
  display: flex;
  overflow-y: auto;
  margin-left: 2rem;
  overflow-x: hidden;
  flex-direction: column;
  justify-content: space-between;
}
.modal-tab {
  flex: 0.7;
  z-index: 1;
  display: flex;
  list-style: none;
  align-items: center;
  box-shadow: 0 4px 7px 0 rgb(0 0 0 / 7%);
}

.permission-wrapper{
  display: flex;
  overflow: hidden;
  border-radius: 0.25rem;
  flex-direction: column;
  border: 1px solid #888888;
  box-shadow: 0 2px 3px 0 rgba(0,0,0,0.04);
}
.permission-wrapper.no-of{
  overflow: visible;
}
.collapsible-label{
  display: flex;
  cursor: pointer;
  padding: 0.5rem;
  align-items: center;
  margin: 0 !important;
  border-radius: 0.25rem;
  background-color: #eaeaea;
  justify-content: space-between;
}
.collapsible-label span{
  color: #292c44;
  font-weight: bold;
  text-transform: uppercase;
}
.collapsible-label i{
  margin-right: 0 !important;
}
.collapsible-content{
  opacity: 0;
  display: none;
  padding: 0.5rem;
  visibility: hidden;
}
.collapsible-content.show{
  opacity: 1;
  display: flex;
  visibility: visible;
}
.content-inner{
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.content-inner .group{
  margin-bottom: 1rem;
}
.content-inner .group input.controls,
.content-inner .group select.controls,
.content-inner .group textarea.controls{
  padding: 0.25rem 0;
}
.content-inner .radio-wrapper{
  margin: 0;
}
.content-inner .radio-wrapper .checkmark{
  top:0;
}
.content-inner .dropdown{
  margin: 0;
  padding: 0.5rem 0;
}
.content-inner .input-tags{
  padding: 0;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid rgba(0,0,0,.15);
}
.play-view{
  margin-bottom: 0.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 0.1rem solid #de821654;
}
.time-card{
  display: flex;
  list-style: none;
}
.time-card span{
  display: flex;
  color: #656364;
  cursor: pointer;
  padding: 0.25rem;
  font-weight: 500;
  font-size: 0.75rem;
  align-items: center;
  margin-bottom: 1rem;
  border-radius: 0.15rem;
  justify-content: center;
  background-color: #e4e4e4;
  transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.time-card span:hover{
  color: #ffffff;
  background-color: #9490ff;
  box-shadow: 0 2px 3px 0 rgb(0 0 0 / 10%);
}
.time-card span.active{
  color: #ffffff;
  background-color: #2a0d62;
}
/* Modal */

/* Notify Message */
#messages {
  left: 50%;
  bottom: 2rem;
  z-index: 1051;
  position: absolute;
  transform: translateX(-50%);
}

#messages div {
  opacity: 0;
  margin: 1rem;
  cursor: pointer;
  min-width: 12rem;
  max-width: 25rem;
  position: relative;
  border-radius: 5rem;
  padding: 0.75rem 1.5rem;
  transform: translate3d(0, 200%, 0);
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2);
  transition: opacity 0.3s, transform 0.3s cubic-bezier(0, 0.8, 0.6, 1);
}
#messages .close {
  top: 0;
  right: 5px;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 0.25rem;
  background: none;
  position: absolute;
}
#messages .show {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.message-info h3,
.message-error h3,
.message-success h3,
.message-warning h3 {
  font-size: 1rem;
  margin: 0 0 0.5rem 0;
}
.message-info p,
.message-error p,
.message-success p,
.message-warning p {
  margin: 0;
  font-weight: 500;
  font-size: 0.85rem;
}
.message-error {
  color: #ffffff;
  background: #d24646;
}
.message-success {
  color: #ffffff;
  background: #70b65d;
}
.message-info {
  color: #ffffff;
  background: #1bbdb2;
}
.message-warning {
  color: #ffffff;
  background: #f2a531;
}

/* Switch */
.switch {
  width: 60px;
  height: 34px;
  position: relative;
  display: inline-block;
}
.switch input {
  width: 0;
  height: 0;
  opacity: 0;
}
.slider {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  cursor: pointer;
  transition: 0.4s;
  position: absolute;
  background-color: #ccc;
  -webkit-transition: 0.4s;
}
.slider:before {
  left: 4px;
  content: "";
  width: 26px;
  bottom: 4px;
  height: 26px;
  transition: 0.4s;
  position: absolute;
  background-color: white;
  -webkit-transition: 0.4s;
}
input:checked + .slider {
  background-color: #2196f3;
}
input:focus + .slider {
  box-shadow: 0 0 1px #2196f3;
}
input:checked + .slider:before {
  transform: translateX(26px);
  -ms-transform: translateX(26px);
  -webkit-transform: translateX(26px);
}
/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}
.slider.round:before {
  border-radius: 50%;
}

/* Tooltip */
/* .tooltip{
  opacity: 0.8;
  color: #ffffff;
  position: fixed;
  max-width: 150px;
  padding: 4px 8px;
  text-align: center;
  border-radius: 4px;
  z-index: 2147483647;
  background: #000000;
  word-break: break-all;
  box-shadow: 0 2px 5px 0 rgb(0 0 0 / 40%);
}
.tooltip.top{
  transform: translate(-8px, -16px);
}
.tooltip.right{
  transform: translate(12px, -4px);
}
.tooltip.bottom{
  transform: translate(-8px, 16px);
}
.tooltip.left{
  transform: translate(-12px, -4px);
}

.tooltip::after{
  content: "";
  color: #000000;
  position: absolute;
  vertical-align: middle;
  border-bottom: 8px solid;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
}

.tooltip.left::after{
  top: 8px;
  right: -12px;
  transform: rotate(90deg);
}
.tooltip.right::after{
  top: 8px;
  left: -12px;
  transform: rotate(-90deg);
}
.tooltip.top::after{
  left: 50%;
  bottom: -8px;
  transform: translateX(-50%) rotate(180deg);
}
.tooltip.bottom::after{
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
} */

[tooltip] {
  position: relative;
  display: inline-block;
}

[tooltip]::before {
  left: 50%;
  opacity: 0;
  content: "";
  z-index: 5;
  top: -0.4rem;
  position: absolute;
  border-style: solid;
  transform: translateX(-50%);
  border-width: 0.25rem 0.4rem 0 0.4rem;
  border-color: rgba(35, 32, 32, 1) transparent transparent transparent;
}
[tooltip-position="left"]::before {
  top: 50%;
  left: -4%;
  margin-left: -0.75rem;
  transform: translatey(-50%) rotate(-90deg);
}
[tooltip-position="right"]::before {
  top: 50%;
  left: 100%;
  margin-left: 0;
  transform: translatey(-50%) rotate(90deg);
}
[tooltip-position="top"]::before {
  left: 50%;
}
[tooltip-position="bottom"]::before {
  top: 100%;
  margin-top: 0.5rem;
  transform: translateX(-50%) translatey(-100%) rotate(-180deg);
}

[tooltip]::after {
  left: 50%;
  opacity: 0;
  color: #fff;
  z-index: 5;
  top: -0.4rem;
  min-width: 3rem;
  font-size: 0.8rem;
  position: absolute;
  text-align: center;
  white-space: nowrap;
  pointer-events: none;
  line-height: initial;
  content: attr(tooltip);
  border-radius: 0.25rem;
  padding: 0.25rem 0.5rem;
  background: rgba(35, 32, 32, 1);
  transform: translateX(-50%) translateY(-100%);
}
[tooltip-position="left"]::after {
  left: 0%;
  top: 50%;
  margin-left: -0.5rem;
  transform: translateX(-100%) translateY(-50%);
}
[tooltip-position="right"]::after {
  top: 50%;
  left: 100%;
  margin-left: 0.5rem;
  transform: translateX(0%) translateY(-50%);
}
[tooltip-position="top"]::after {
  left: 50%;
}
[tooltip-position="bottom"]::after {
  top: 100%;
  margin-top: 0.5rem;
  transform: translateX(-50%) translateY(0%);
}
[tooltip]:hover::after,
[tooltip]:hover::before {
  opacity: 1;
}
/* Tooltip */

/* Message */
.alert {
  padding: 0.5rem 1rem;
  border-radius: 0.25rem;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.15);
}
.alert-warning {
  color: #fff;
  background-color: #f2a531;
}
.alert-error {
  color: #fff;
  background-color: #d24646;
}
.alert-success {
  color: #fff;
  background-color: #70b65d;
}
.alert-info {
  color: #fff;
  background-color: #1bbdb2;
}

/* Custom Checkbox */
.checkbox-section {
  display: flex;
  align-items: center;
  margin-right: 1.5rem;
  justify-content: space-between;
}
.checkbox-wrapper {
  display: block;
  font-size: 22px;
  cursor: pointer;
  margin-top: 5px;
  user-select: none;
  position: relative;
  padding-left: 25px;
  margin-bottom: 12px;
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
}
.checkbox-wrapper input {
  width: 0;
  height: 0;
  opacity: 0;
  cursor: pointer;
  position: absolute;
}
.checkbox-wrapper .checkmark {
  left: 0;
  top: -4px;
  width: 1rem;
  height: 1rem;
  display: flex;
  position: absolute;
  align-items: center;
  justify-content: center;
  background-color: #eeeeee;
}
.checkbox-wrapper:hover input ~ .checkmark {
  background-color: #cccccc;
}
.checkbox-wrapper input:checked ~ .checkmark {
  background-color: #2a0d62;
}
.checkbox-wrapper .checkmark:after {
  content: "";
  display: none;
  position: absolute;
}
.checkbox-wrapper input:checked ~ .checkmark:after {
  display: block;
}
.checkbox-wrapper .checkmark:after {
  width: 3px;
  height: 8px;
  margin-top: -3px;
  border: solid white;
  transform: rotate(45deg);
  border-width: 0 3px 3px 0;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.checkbox-wrapper .extra-info {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.checkbox-wrapper .extra-info small {
  color: #c2a6f9;
  font-size: 0.7rem;
}
/* Custom Checkbox */

/* Custom Radio */
.radio-section {
  display: flex;
  align-items: center;
  margin-right: 1.5rem;
  justify-content: space-between;
}
.radio-wrapper {
  display: block;
  cursor: pointer;
  font-size: 22px;
  user-select: none;
  position: relative;
  padding-left: 30px;
  margin-bottom: 12px;
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
}
.radio-wrapper input {
  opacity: 0;
  cursor: pointer;
  position: absolute;
}
.radio-wrapper .checkmark {
  left: 0;
  top: -2px;
  width: 1rem;
  height: 1rem;
  display: flex;
  position: absolute;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  background-color: #eeeeee;
}
.radio-wrapper:hover input ~ .checkmark {
  background-color: #cccccc;
}
.radio-wrapper input:checked ~ .checkmark {
  background-color: #656364;
}
.radio-wrapper .checkmark:after {
  content: "";
  display: none;
  position: absolute;
}
.radio-wrapper input:checked ~ .checkmark:after {
  display: block;
}
.radio-wrapper .checkmark:after {
  width: 7.5px;
  height: 7.5px;
  background: white;
  border-radius: 50%;
}
.radio-wrapper .extra-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.radio-wrapper .extra-info small {
  color: #c2a6f9;
  font-size: 0.7rem;
}
/* Custom Radio */

.table-responsive {
  display: block;
  overflow: auto;
}

/* PlaybookAI Custom Table */
.playbook-table {
  width: 100%;
  color: #7d7a7a;
  max-width: 100%;
  font-size: 0.75rem;
  border-radius: 0.5rem;
  margin-bottom: 1.25rem;
  background-color: #ffffff;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.04);
}
.playbook-table > thead > tr > th,
.playbook-table > tbody > tr > th {
  color: #7d7a7a;
  font-size: 0.75rem;
  line-height: 1.25rem;
  text-transform: uppercase;
  border-bottom: 1px solid #eef0f0;
}
.playbook-table thead {
}
.playbook-table th {
  padding: 0.5rem 0.75rem;
}
.playbook-table tbody {
}
.playbook-table tbody tr td {
  color: #7d7a7a;
  border-bottom: 1px solid #e8e8e8;
}
.playbook-table tbody tr:last-child td {
  border-bottom: none;
}
.playbook-table tbody tr:first-child td {
  color: #7d7a7a;
  font-size: 1rem;
  font-weight: bold;
  padding: 1rem 0.5rem;
  line-height: 1.25rem;
  text-transform: uppercase;
  border-bottom: 2px solid #c2a6f9;
}
.playbook-table .wrapped-info {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.playbook-table .dropdown {
  border-radius: 5rem;
  width: calc(100% - 4rem);
  border: 1px solid #ffc93859;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.07);
}
.playbook-table .dropdown .dropdown-value {
  border-radius: 5rem;
}
.playbook-table tbody tr:first-child td:first-child input {
  margin-right: 0.5rem;
}
.playbook-table tbody td:last-child {
  text-align: right;
}
.playbook-table tbody tr {
  position: relative;
}
.playbook-table tbody tr.recent,
.playbook-table tbody tr.recent td {
  background-color: #e6d8ff;
}
.playbook-table tbody tr:first-child:hover {
  background: none;
}
.playbook-table tbody td {
  font-size: 0.8rem;
  font-weight: normal;
  margin-bottom: 1rem;
  padding: 0.65rem 0.5rem;
}
.playbook-table tbody tr td:first-child {
  padding-left: 1rem;
}
.playbook-table tbody tr td:last-child {
  padding-right: 1rem;
}
.playbook-table .playbook-action a {
  opacity: 0.7;
  color: #2a0d62;
  font-size: 1rem;
  font-weight: normal;
  margin-right: 0.35rem;
  margin-inline: 0.35rem;
  transition: opacity 0.3s ease;
}
.playbook-table .playbook-action a:last-child {
  margin-right: 0;
}
.playbook-table .playbook-action a:hover {
  opacity: 1;
}
.playbook-table .playbook-action a i {
  width: 1rem;
  height: 1rem;
  padding: 0.15rem;
  font-size: 0.8rem;
  vertical-align: middle;
}
.playbook-table .playbook-action a i.icon-trash {
  color: #f44336;
  border-color: #f44336;
}
.playbook-table .playbook-action a:hover i.icon-trash {
  color: #ffffff;
  border-color: #f44336;
  background-color: #f44336;
}
.playbook-table tbody tr.unread {
  font-weight: bold;
  background-color: #ffc9381c;
}
.playbook-table tbody tr:hover {
  background-color: #f7f7f7;
}
.playbook-table .table-action {
  display: flex;
  list-style: none;
  align-items: center;
  justify-content: flex-end;
}
.playbook-table .table-action li a i {
  width: 1.25rem;
  height: 1.25rem;
  font-size: 1rem;
  padding: 0.25rem;
  text-align: center;
  line-height: 1.5rem;
}
.playbook-table .table-action li a i:hover {
  border-radius: 50%;
  background-color: #00000010;
}
.playbook-table .table-action li:first-child a i {
  margin-left: 0 !important;
}
/* PlaybookAI Custom Table */

div.bulk-options {
  top: 1rem;
  right: 2rem;
  width: 11rem;
  position: absolute;
}
div.bulk-options .dropdown {
  width: calc(100% - 1.5rem);
}
span.result-info {
  top: 1rem;
  left: 1.5rem;
  color: #3a1484;
  font-weight: 500;
  position: absolute;
  font-size: 0.85rem;
}
span.result-info.sm {
  top: 25px;
  left: 35px;
  color: #1ea69a;
  position: absolute;
}
small.result-selected {
  color: #343854;
  font-weight: bold;
  margin-left: 0.25rem;
}

/* Styled Lists */
.group-lists {
  display: flex;
  list-style: none;
  margin-bottom: 0.75rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.group-lists li i {
  margin-right: 0.35rem;
}
.group-lists.navy li i {
  color: #343854;
}
.group-lists.lightblue li i {
  color: #a7a7b2;
}
.group-lists.blue li i {
  color: #2196f3;
}
.group-lists.green li i {
  color: #4caf50;
}
.group-lists.yellow li i {
  color: #ffc938;
}
.group-lists.red li i {
  color: #f44336;
}
.group-lists.purple li i {
  color: #9468e6;
}
.group-lists.orange li i {
  color: #ebba16;
}
.group-lists.gray li i {
  color: gray;
}
.group-lists.teal li i {
  color: #1cbcbc;
}

.dot-lists {
  display: flex;
  list-style: none;
  margin-left: 1rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.dot-lists li::before {
  width: 1rem;
  color: #5b5b5b;
  content: "\2022";
  margin-left: -1rem;
  display: inline-block;
}
.dot-lists.navy li::before {
  color: #343854;
}
.dot-lists.lightblue li::before {
  color: #a7a7b2;
}
.dot-lists.blue li::before {
  color: #2196f3;
}
.dot-lists.green li::before {
  color: #4caf50;
}
.dot-lists.yellow li::before {
  color: #ffc938;
}
.dot-lists.red li::before {
  color: #f44336;
}
.dot-lists.purple li::before {
  color: #9468e6;
}
.dot-lists.orange li::before {
  color: #ebba16;
}
.dot-lists.gray li::before {
  color: gray;
}
.dot-lists.teal li::before {
  color: #1cbcbc;
}

/* Styled Lists */

/* Table */
.table {
  width: 100%;
  margin: 0 auto;
  border-spacing: 0;
  position: relative;
  border-radius: 0.25rem;
  background-color: #fff;
  border: 1px solid #ddd;
  box-sizing: content-box;
  border-collapse: separate;
}
.table thead {
  color: #3a1484;
  background-color: #fff;
}
.table thead th {
  padding: 0.5rem;
  text-align: left;
  font-weight: bold;
  font-size: 0.75rem;
  vertical-align: middle;
  box-sizing: content-box;
}
.table thead th:first-child {
  border-radius: 0.5rem 0 0 0;
}
.table thead th:last-child {
  border-radius: 0 0.5rem 0 0;
}
.table tbody td {
  padding: 0.5rem;
  font-size: 0.85rem;
  vertical-align: middle;
  box-sizing: content-box;
  border-bottom: 1px solid #f7f7f7;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  word-break: break-all;
}
.table tbody tr:first-child td p {
  font-size: 0.85rem;
}
.table thead th:last-child,
.table tbody td:last-child {
  text-align: right;
}
.table tbody td:last-child a {
  border: 1px solid #555;
  color: #555;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  align-items: center;
  display: inline-flex;
  justify-content: center;
}
.table tbody td:last-child {
  border-right: none;
}
.table tbody tr:first-child td {
  /* border-top:1px solid #bbbdc0; */
}
.table th br,
.table td br {
  display: none;
}

.terms {
  padding: 1rem;
  margin: 2rem 0;
  border-radius: 0.5em;
  border: 1px solid #bbbdc0;
  background-color: #fbfbfb;
}
.terms label {
  display: flex;
  cursor: pointer;
  margin-bottom: 0;
  align-items: flex-start;
  justify-content: flex-start;
}
.terms p {
  font-size: 0.8rem;
}
.terms input {
  float: left;
  margin-top: 5px;
  position: static;
  margin-left: -1.25rem;
}
.terms ul {
  font-size: 0.8rem;
  margin: 1rem 0 0 1rem;
}
.terms li {
  margin-bottom: 0.5rem;
}

.action-button {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.action-button a.btn-sm {
  margin-left: 0.5rem;
}
.action-button a.btn-sm:first-child {
  margin-left: 0;
}
.action-button .btn-action {
  font-size: 1rem;
  padding: 0.25rem;
}

/* Play Nodes */
.email .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-email.png") no-repeat scroll 0 50% / 25%;
}
.sms .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-sms.png") no-repeat scroll 0 50% / 25%;
}
.call .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-call.png") no-repeat scroll 0 50% / 20%;
}
.tweet .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-twitter.png") no-repeat scroll 0 50% / 30%;
}
.favorite .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-twitter.png") no-repeat scroll 0 50% / 30%;
}
.follow .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-twitter.png") no-repeat scroll 0 50% / 30%;
}
.linkedin .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-linkedin.png") no-repeat scroll 0 50% /
    28%;
}
.lnmessage .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-linkedin.png") no-repeat scroll 0 50% /
    28%;
}
.whatsapp .flowchart-operator-inputs-outputs {
  background: #fff url("../images/opt-sms.png") no-repeat scroll 0 50% / 25%;
}

/* Input Custom Style 2 */
.field-wrapper {
  display: flex;
  padding: 0.5rem;
  margin-bottom: 0.75rem;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.field-wrapper input,
.field-wrapper textarea {
  width: 100%;
  color: #4c4978;
  border-width: 0;
  display: inline;
  font-weight: 300;
  font-size: 0.85rem;
  box-sizing: border-box;
  padding: 1rem 0 0.5rem;
  border-bottom: 1px solid #dddddd;
}
.field-wrapper textarea {
  border: 1px solid #dddddd;
}
.field-wrapper div.telephone {
  width: 100%;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #dddddd;
}
.field-wrapper .intl-tel-input.allow-dropdown .selected-flag,
.field-wrapper .intl-tel-input.separate-dial-code .selected-flag {
  padding: 0;
  width: 40px;
  margin-top: 2px;
}
.field-wrapper input:focus,
.field-wrapper textarea:focus {
  transition: 0.4s;
  border-color: #2a0d62;
}
.field-wrapper label {
  display: flex;
  color: #9a9a9a;
  font-size: 0.85rem;
  align-items: center;
}
.field-wrapper label i {
  font-size: 1rem;
  margin-right: 0.5rem;
}
.field-wrapper input:disabled,
.field-wrapper textarea:disabled {
  color: #dddddd;
  background-color: #ffffff;
}
.field-wrapper .dropdown {
  width: 100%;
  border: none;
  border-radius: 0;
  padding: 1rem 0 0.5rem;
  border-bottom: 1px solid #dddddd;
}
.field-wrapper .dropdown .dropdown-select {
  padding-left: 0;
  font-size: 0.85rem;
}
.field-wrapper .dropdown .dropdown-select .dropdown-item {
  font-size: 0.85rem;
}
.field-wrapper .dropdown .dropdown-value input {
  padding: 0.6rem 0;
}
.field-wrapper .intl-tel-input input:focus + .field-wrapper div.telephone,
.field-wrapper
  .dropdown
  .dropdown-value
  input:focus
  + .field-wrapper
  .dropdown {
  transition: 0.4s;
  border-color: #2a0d62;
}
.field-dropdown {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.field-card {
  flex-direction: row;
  border-radius: 0.25rem;
  border: 1px solid #d4beff;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  background-color: #ffffff;
  justify-content: space-between;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.04);
}
.field-card:hover {
  /* transform:scale(1.02); */
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.07);
}
.field-card.no-border,
.field-card.no-border:hover {
  padding: 0;
  border: none;
  border-radius: 0;
  box-shadow: unset;
  margin-bottom: 1.25rem;
}
.field-card label {
  color: #5b5b5b;
}
.field-card i {
  font-size: 0.85rem;
}
/* Input Custom Style 2 */

/* Input Custom Style */
.group input.controls,
.group select.controls,
.group textarea.controls {
  width: 100%;
  color: #4c4978;
  border-width: 0;
  display: inline;
  font-weight: 300;
  border-radius: 0;
  font-size: 0.85rem;
  padding: 0.55rem 0;
  box-sizing: border-box;
  border-bottom: 1px solid #dddddd;
}
.group textarea.controls {
  border: 1px solid #dddddd;
}
.group input.controls:focus,
.group select.controls:focus,
.group textarea.controls:focus {
  transition: 0.4s;
  border-color: #2a0d62;
}
.group div.telephone {
  width: 100%;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #dddddd;
}
.group .intl-tel-input.allow-dropdown .selected-flag,
.group .intl-tel-input.separate-dial-code .selected-flag {
  padding: 0;
  width: 40px;
  bottom: 5px;
  margin-top: 2px;
}
.group .dropdown {
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #dddddd;
}
.group .dropdown .dropdown-select {
  padding-left: 0 !important;
}
.group .dropdown .dropdown-value input {
  padding: 0.6rem 0;
}
.group .dropdown .dropdown-menu .search-filter-wrapper input {
  padding-top: 0.55rem;
  padding-left: 0.75rem;
}
.group .dropdown .dropdown-reset {
  padding-right: 0 !important;
}
.group .intl-tel-input input:focus + div.telephone,
.group .dropdown .dropdown-value input:focus + .dropdown {
  transition: 0.4s;
  border-color: #2a0d62;
}
.group label {
  display: flex;
  color: #232020;
  font-size: 0.85rem;
  align-items: center;
}
.group label i {
  font-size: 1rem;
  margin-right: 0.5rem;
}
.group .label-files {
  cursor: pointer;
}
/* Input Custom Style */

/* Font Size */
.font-size-large {
  font-size: 1rem;
}
.font-size-medium {
  font-size: 0.75rem;
}
.font-size-small {
  font-size: 0.5rem;
}
/* Font Size */

/* Load More CSS */
#loading {
  -webkit-animation: rotation 2s infinite linear;
}
@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
  }
}
.load-more {
  display: flex;
  margin: 1rem 0;
  align-items: center;
  justify-content: center;
}
.load-more a {
  width: 6rem;
  display: flex;
  margin: 1rem 0;
  color: #ffffff;
  font-size: 0.85rem;
  font-weight: normal;
  align-items: center;
  border-radius: 5rem;
  padding: 0.25rem 1rem;
  background-color: #9a9a9a;
  border: 1px solid #9a9a9a;
  justify-content: space-between;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.3s ease, background-color 0.3s ease;
}
.load-more a:hover {
  color: #ffffff;
  background-color: #b5b5b5;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.07);
}
.load-more i {
  font-size: 1rem;
  font-weight: normal;
  margin-left: 0.5rem;
}
/* Load More CSS */

.modal-title {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.modal-title h4 {
}
.close-modal {
  display: flex;
  color: #ffffff;
  align-items: center;
}
.close-modal i {
}

/* Rotation Keyframes & CSS */
@-webkit-keyframes rotating {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.rotating {
  line-height: unset;
  -webkit-animation: rotating 2s linear infinite;
  -moz-animation: rotating 2s linear infinite;
  -ms-animation: rotating 2s linear infinite;
  -o-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
}
/* Rotation Keyframes & CSS */

/* Header CSS */
.temporary-request {
  display: flex;
  color: #ffffff;
  overflow: hidden;
  padding: 0.75rem;
  font-size: 0.85rem;
  background-image: linear-gradient(to right, #3a1484, #8e54a2);
}
.temporary-request .temporary-header {
  flex: 1;
  display: flex;
  font-weight: bold;
  text-align: center;
  align-items: center;
  justify-content: center;
}
.temporary-request .temporary-header span {
  margin-right: 0.25rem;
}
.temporary-request .temporary-header a {
  color: #ffffff;
  text-decoration: underline;
}
.temporary-request .temporary-close i {
  color: #f44336;
  padding: 0.15rem;
  font-weight: bold;
  border-radius: 50%;
  font-size: 0.75rem;
  background-color: #ffffff;
}
.req-setup {
  border: none;
  color: #ffffff;
  font-weight: bold;
  font-size: 0.85rem;
  padding: 0.25rem 0.5rem;
  transition: box-shadow ease-in-out 0.3s;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.04);
  background-image: linear-gradient(135deg, #c6426e, #642b73);
}
.req-setup:hover {
  box-shadow: 0 4px 7px 0 rgba(0, 0, 0, 0.07);
}

.subheader-wrapper {
  flex: 1;
  display: flex;
  align-self: stretch;
  justify-content: space-between;
}
.subheader-left {
  flex: 1;
  display: flex;
}
.subheader-left nav.tab a {
  border-radius: 0;
  font-size: 0.8rem;
  font-weight: bold;
  align-items: center;
  display: inline-flex;
  justify-content: center;
  padding: 0.5rem 1rem !important;
  border-bottom: 2px solid transparent;
  transition: background-color 0.3s ease, border-color 0.3s ease,
    color 0.3s ease;
    white-space: nowrap;
}
.subheader-left nav.tab a:last-child {
  border-right: none;
}
.subheader-left nav.tab a:hover {
  color: #3a1484 !important;
  background-color: #eae7f1;
}
.subheader-left nav.tab a.active {
  color: #de8216 !important;
  border-color: #de8216 !important;
}
.subheader-left nav.tab a i {
  font-size: 0.85rem;
  line-height: 1.5rem;
  margin-right: 0.2rem;
}
.subheader-right {
  flex: 0.7;
  display: flex;
  align-items: center;
  margin-right: 0.5rem;
  justify-content: flex-end;
}

.search-control {
  overflow: hidden;
  border-radius: 5rem;
  border: none !important;
  display: flex !important;
  background-color: #ffffff;
  position: relative !important;
  align-items: center !important;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.07);
}
.search-control .search-area {
  flex: 1;
  position: relative;
  align-items: center;
  display: inline-flex;
  padding-left: 0.75rem;
}
.search-control input {
  width: 100%;
  margin-right: 2rem;
  border: none !important;
  background-color: #ffffff;
}
.search-control .clear-search {
  right: 5px;
  position: absolute;
  font-size: 0.85rem;
}
.search-control .search-btn {
  padding: 0.4rem;
  border-radius: 0;
  display: inline-flex;
}
.search-control .search-btn i {
  font-size: 1.15rem;
}
.search-control .add-btn {
  width: 2rem;
  height: 2rem;
  line-height: 1rem;
  text-align: center;
  border-radius: 50%;
  margin-left: 0.5rem;
  align-items: center;
  display: inline-flex;
  justify-content: center;
}
/* Header CSS */

.row-search {
  display: flex;
  align-items: center;
}
.row-search .search-control {
  margin: 0;
  width: 100%;
}

/* Custom Dropdown */
.custom-dropdown {
  top: 110%;
  padding: 0;
  opacity: 0;
  left: auto;
  z-index: -1;
  width: 100%;
  overflow: auto;
  min-width: 12rem;
  position: absolute;
  visibility: hidden;
  border-radius: 0.25rem;
  border: 1px solid #dddddd;
  background-color: #ffffff;
  transform: translateY(-5%);
  transition: transform 0.25s ease;
  box-shadow: 0 50px 100px rgba(50, 50, 93, 0.1),
    0 15px 35px rgba(50, 50, 93, 0.15), 0 5px 15px rgba(0, 0, 0, 0.1);
}
.custom-dropdown.show {
  opacity: 1;
  z-index: 999;
  visibility: visible;
  transform: translateY(0);
}
.custom-dropdown ul {
  list-style: none;
}
.custom-dropdown li a {
  display: flex;
  opacity: 0.85;
  color: #888888;
  align-items: center;
  padding: 0.5rem 0.75rem;
  border-top: 1px solid #88888825;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.custom-dropdown li a:hover {
  opacity: 1;
  color: #3a1484;
  background-color: #faf7ff;
}
.custom-dropdown li a.active {
  opacity: 1;
  color: #2a0d62;
  font-weight: bold;
  background-color: #eae7f1;
}
.custom-dropdown li a span {
  font-size: 0.85rem;
  margin-top: 0.15rem;
}
.custom-dropdown li a i {
  font-size: 1rem;
  margin-right: 0.35rem;
}
.custom-dropdown li:first-child a {
  border: none;
}
.custom-dropdown p.short-text {
  width: 200px;
  text-align: left;
}
/* Custom Dropdown */

/* Radial Progress */
.channel-statistics {
  margin: 1.5rem 0;
  padding: 0 1.75rem;
  align-items: center;
  display: inline-flex;
  justify-content: center;
}
.tweet-progress {
  display: flex;
  justify-content: flex-end;
}
.tweet-progress .c100 {
  margin: 0;
  margin-right: 0.25rem;
}
.sms-progress {
  display: flex;
  justify-content: flex-start;
}
.sms-progress .c100 {
  margin: 0;
  margin-left: 0.25rem;
}
/* Radial Progress */

/* Import */
.import-wrapper {
  position: relative;
}
.import-area {
  padding: 2rem 0;
  border-radius: 0.25rem;
  border: 2px dashed #dedddf;
}
.import-area small {
  color: #de8216;
  font-size: 0.75rem;
  margin-top: 0.75rem;
}
.import-wrapper input[type="file"] {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  width: 100%;
  cursor: pointer;
  position: absolute;
}
.import-wrapper.disabled .import-area {
  opacity: 0.7;
}
.import-wrapper.disabled .import-area small {
  opacity: 0.7;
}
/* Import */

/* Condition */
.condition-area {
  padding: 2rem 0;
  border-radius: 0.25rem;
  border: 2px dashed #dedddf;
}
/* Condition */

#tidio-chat {
  z-index: 1 !important;
  position: relative !important;
}

/* Pulse Effect */
.blob-red {
  background: rgba(255, 82, 82, 1);
  animation: pulse-red 2s infinite;
  box-shadow: 0 0 0 0 rgba(255, 82, 82, 1);
}
@keyframes pulse-red {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 82, 82, 0.7);
  }

  70% {
    box-shadow: 0 0 0 10px rgba(255, 82, 82, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 82, 82, 0);
  }
}

.blob-white {
  background: white;
  animation: pulse-white 2s infinite;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
}

@keyframes pulse-white {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
  }

  70% {
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
/* Pulse Effect */

/* Tags Section */
.tags-section {
  display: flex;
  position: relative;
  padding: 0.5rem 1.5rem;
  flex-direction: column;
}
.tags-section .tags-card-wrapper {
  display: block;
}
.tags-section .tags-card {
  width: 75px;
  color: #454240;
  cursor: default;
  font-size: 0.85rem;
  text-align: center;
  margin-left: 0.25rem;
  display: inline-block;
  margin-bottom: 0.25rem;
  border-radius: 0.15rem;
  padding: 0.15rem 0.35rem;
  border: 1px solid #a378f7;
  background-color: #faf7ff;
  transition: background-color 0.2s ease;
}
.tags-section .tags-card:hover {
  background-color: #f5f0ff;
}
.tags-section .tags-card:first-child {
  margin-left: 0;
}
.tags-section .tags-card.tag-more {
  width: auto;
  opacity: 0.7;
  cursor: pointer;
  overflow: hidden;
  transition: opacity 0.2s ease;
}
.tags-section .tags-card.tag-more:hover {
  opacity: 1;
}
.tags-section .custom-dropdown.show {
  top: 90%;
  width: 75%;
  height: auto;
  overflow-y: auto;
  max-height: 200px;
  overflow-x: hidden;
  padding: 1rem 0 0.5rem;
}
.tags-section .custom-dropdown.show .tags-card {
  margin-left: 0.25rem;
}
/* Tags Section */

.odd-bg {
  background-color: #f3f1f9 !important;
}
.even-bg {
  background-color: #ffffff !important;
}
.spacer {
  background: transparent;
  display: block !important;
  padding: 1.5rem !important;
}
.text-center {
  text-align: center !important;
}

/* Filter CSS */
.search-section {
  position: relative;
  align-items: center;
  display: inline-flex;
  justify-content: space-between;
}
.search-section .search-control .search-area {
  flex: 0.92;
}
.top-filter-wrapper {
  right: 10px;
  position: absolute;
}
.top-filter {
  position: relative;
}
.top-filter .filter-count {
  margin: 0;
  color: #2f54eb;
  font-weight: 500;
  font-size: 0.75rem;
  border-radius: 50%;
  margin-left: 0.5rem;
  padding: 0.2rem 0.5rem;
  background-color: #ffffff;
}
.top-filter .clear-filter {
  top: -8px;
  right: -8px;
  color: #ffffff;
  width: 0.75rem;
  height: 0.75rem;
  font-size: 0.5rem;
  position: absolute;
  text-align: center;
  border-radius: 50%;
  line-height: 0.85rem;
  background-color: #f44336;
}
.top-filter .custom-dropdown.filter-dropdown {
  width: 20rem;
  border: none;
  overflow: visible;
}
.top-filter .filter-dropdown .dropdown-menu .dropdown-options {
  max-height: 250px;
}
.top-filter .filter-dropdown .dropdown-menu .search-filter-wrapper input {
  padding-left: 0.5rem;
}

.top-filter .filter-lists {
  display: flex;
  flex-direction: column;
}
.top-filter .filter-lists .filter-item {
  flex: 1;
}
.top-filter .filter-lists .filter-item a.open-anchor {
  display: flex;
  padding: 1rem;
  justify-content: space-between;
}
.top-filter .filter-lists .filter-menu .group {
  margin-bottom: 0;
}
.top-filter .filter-lists .group > .dropdown {
  flex: 1;
  border: none;
}
.top-filter .filter-lists .filter-menu a {
  padding: 1rem;
}
.top-filter .filter-lists .filter-details {
  background-color: #ffffff;
  padding: 0.15rem 0.5rem 0.15rem 1rem;
}
.top-filter .filter-lists .filter-details:first-child {
  border-radius: 0.25rem 0.25rem 0 0;
}
.top-filter .filter-lists .filter-details:last-child {
  border-radius: 0 0 0.25rem 0.25rem;
}
.top-filter .filter-lists .filter-details label i {
  margin: 0;
  display: flex;
  color: #de8216;
  font-size: 0.85rem;
  margin-top: 0.25rem;
}
.top-filter .filter-lists .filter-details .group {
  display: flex;
  align-items: center;
  margin-bottom: 1rem;
}
.top-filter .filter-lists .filter-details .group:last-child {
  margin-bottom: 0;
}
.top-filter .filter-lists .filter-details .group label {
  color: #c4c4c4;
  margin-bottom: 0.25rem;
}
.top-filter .filter-lists .filter-details .filter-icon {
  display: flex;
  color: #a3a3a3;
  font-size: 0.85rem;
  align-items: center;
  margin-bottom: 0.5rem;
}
.top-filter .filter-lists .filter-details .filter-icon i {
  margin-right: 0.25rem;
}
.top-filter .filter-lists .filter-details .group > .controls {
  flex: 1;
  border: none;
  color: #464a4c;
  padding: 0.5rem 0;
  border-bottom: 1px solid #dddddd;
}
.top-filter .filter-lists .filter-menu .list-tags {
  margin-top: 0.75rem;
}
.top-filter .filter-lists .filter-menu .list-tags span {
  color: #2f54eb;
  font-weight: 600;
  font-size: 0.75rem;
  align-items: center;
  border-radius: 1rem;
  display: inline-flex;
  margin-right: 0.5rem;
  margin-bottom: 0.25rem;
  padding: 0.15rem 0.5rem;
  background-color: #d6e4ff;
}
.top-filter .filter-lists .filter-menu .list-tags i {
  cursor: pointer;
  margin-left: 0.3rem;
}
.top-filter .filter-lists .filter-menu .search-pagination a {
  padding: 0.5rem;
}
.top-filter .filter-lists .filter-menu .dropdown input,
.top-filter .filter-lists .filter-menu .dropdown button {
  padding-left: 0.5rem;
}
.top-filter .filter-lists .filter-menu .dropdown,
.top-filter .filter-lists .filter-menu .dropdown .dropdown-item,
.top-filter .filter-lists .filter-menu .dropdown .icon-search {
  font-size: 0.75rem;
}
.top-filter .filter-lists .filter-menu .group label i {
  margin-right: 0;
  font-size: 0.85rem;
}
.top-filter .filter-item a span,
.top-filter .filter-menu .group label span {
  display: flex;
  color: #9a9a9a;
  line-height: 1;
  font-size: 0.85rem;
  align-items: center;
}
.top-filter .filter-item a span i,
.top-filter .filter-menu .group label span i {
  font-size: 1rem;
  margin-right: 0.5rem;
}
.top-filter .filter-item i {
  font-size: 1rem;
}
.filter-menu .dropdown input {
  padding-top: 0.35rem;
  padding-left: 1.5rem;
}
.filter-menu .group label.space-between {
  cursor: pointer;
}
.filter-footer {
  display: flex;
  padding: 1rem;
  background-color: #eae7ff;
  justify-content: space-between;
  border-radius: 0 0 0.25rem 0.25rem;
}
/* Filter CSS */

/* Import Modal Table & CSS */
.terms label.checkbox-wrapper .checkmark {
  top: 2px;
}

.map-controls {
  width: 100%;
}
.map-controls .dropdown-select,
.map-controls .dropdown-reset,
.map-controls .dropdown-item {
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
}
.map-controls.color-red .dropdown-select,
.map-controls.color-red .dropdown-reset {
  color: #d00;
}
.column-heads {
  color: #292c44;
  font-weight: 600;
  font-size: 0.95rem;
  text-align: center;
  padding: 0.35rem 0;
  background-color: #eaeaea;
}
.column-content {
  height: 100%;
  display: flex;
  font-size: 0.85rem;
  flex-direction: column;
}
.csv-headers {
  flex: 1;
  padding-top: 0.5rem;
}
.csv-rows {
  display: flex;
  height: 2.25rem;
  align-items: center;
}
.csv-rows label {
  margin: 0;
  width: 100%;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.csv-rows label input[type="checkbox"] {
  float: left;
  margin: 4px 5px 0 0;
}

.csv-rows .search-filter-wrapper i.icon-search {
  font-size: 0.95rem;
}
.csv-rows .search-filter-wrapper input {
  font-size: 0.75rem;
  padding-left: 0.5rem !important;
}
.csv-rows .dropdown.map-controls {
  padding: 0 !important;
}
.csv-rows .dropdown.map-controls span.dropdown-value button {
  font-size: 0.8rem !important;
}
.status-dropdown.dropdown {
  padding-left: 0;
}

.csv-appointment-wrapper {
  margin: 2rem 0;
  border-radius: 0.25rem;
  border: 1px solid #888888;
  background-color: #ffffff;
  box-shadow: 0 2px 3px 0 rgb(0 0 0 / 4%);
}
.csv-appointment-wrapper h4 {
  color: #292c44;
  padding: 0.5rem;
  font-size: 1rem;
  font-weight: bold;
  text-transform: uppercase;
  background-color: #eaeaea;
  border-radius: 0.25rem 0.25rem 0 0;
}
.csv-appointment-wrapper .csv-appointment-content {
  padding: 0.75rem;
}

.import-modal-radio {
  display: flex;
  align-items: center;
}
.import-modal-radio label {
  display: flex;
  margin-bottom: 0;
  margin-right: 1rem;
}
.import-modal-radio label span {
  margin-left: 0.25rem;
}

.import-table {
  border: 1px solid #888;
  border-radius: 0.25rem;
}
.import-table p.column-heads.tl-br {
  border-top-left-radius: 0.25rem;
}
.import-table p.column-heads.tr-br {
  border-top-right-radius: 0.25rem;
}
.import-table .csv-headers.lb-p {
  padding-left: 1rem;
  padding-bottom: 1rem;
}
.import-table .csv-headers.rb-p {
  padding-right: 1rem;
  padding-bottom: 1rem;
}
.import-table .csv-headers.center {
  margin: 0 0.75rem;
  padding: 0.5rem 0.75rem 0;
  border-left: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
}
/* Import Modal Table & CSS */

/* Animated Down Arrow Indicator */
.arrow{
  z-index: 2;
  right: 2rem;
  bottom: 2.5rem;
  cursor: pointer;
  position: absolute;
  transform: translate(-50%, -50%);
}
.arrow span{
  width: 8px;
  height: 8px;
  margin: -8px;
  display: block;
  transform: rotate(45deg);
  animation: animate 2s infinite;
  border-right: 2px solid #de8216;
  border-bottom: 2px solid #de8216;
}
.arrow span:nth-child(2) {
  animation-delay: -0.2s;
}
.arrow span:nth-child(3) {
  animation-delay: -0.4s;
}
@keyframes animate {
  0% {
    opacity: 0;
    transform: rotate(45deg) translate(-20px, -20px);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: rotate(45deg) translate(20px, 20px);
  }
}
/* Animated Down Arrow Indicator */

/* Animated Content Loading */
.content-animation{
  animation-duration: 2s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-name: placeHolderShimmer;
  animation-timing-function: linear;
  background-color: #e4e4e4;
  background: linear-gradient(to right, #eeeeee 8%, #dbdbdb 18%, #eeeeee 33%);
  background-size: 800px 104px;
  height: 70px;
  position: relative;
}

@keyframes placeHolderShimmer{
  0%{
    background-position: -800px 0;
  }
  100%{
    background-position: 800px 0;
  }
}

.dummy-container{
  flex: 1;
  display: flex;
  flex-direction: column;
}
.dummy-container.horizontal{
  flex-direction: row;
}
.dummy-loader{
  flex: 1;
  display: flex;
  padding: 1rem;
  margin-bottom: 1rem;
}
.dummy-container.box .dummy-loader{
  border-radius: 0.25rem;
  background-color: #ffffff;
  box-shadow: 0 2px 3px rgb(0 0 0 / 4%);
}
.dummy-loader:last-child{
  margin-bottom: 0;
}
.dummy-container.horizontal .dummy-loader{
  margin-right: 1rem;
  margin-bottom: 1rem;
}
.dummy-container.horizontal .dummy-loader:last-child{
  margin-right: 0;
}
.dummy-left{
  display: flex;
}
.dummy-img{
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 100%;
  background-color: #e4e4e4;
}
.dummy-right{
  flex: 1;
  display: flex;
  margin-left: 1rem;
  flex-direction: column;
}
.dummy-single{
  flex: 1;
  display: flex;
  flex-direction: column;
}
.dummy-line{
  height: 1rem;
  margin-bottom: 0.5rem;
  border-radius: 0.25rem;
  background-color: #e1e1e1;
}
.dummy-line:last-child{
  margin-bottom: 0;
}
.dummy-line.d1{
  width: 100%;
}
.dummy-line.d2{
  width: 60%;
}
.dummy-line.d3{
  width: 75%;
}
.dummy-line.d4{
  width: 50%;
}
.dummy-line.d5{
  width: 25%;
}
.dummy-line.d6{
  width: 30%;
}
.dummy-line.d7{
  width: 15%;
}

.dummy-container.box.contacts .dummy-loader{
  min-height: 8rem;
}
.dummy-container.box.contacts .dummy-img{
  width: 4rem;
  height: 4rem;
}

.dummy-container.box.lists .dummy-loader{
  min-height: 6rem;
}

.dummy-container.box.tags .dummy-loader{
  min-height: 5rem;
}

.dummy-container.box.plays .dummy-loader{
  min-height: 5rem;
  border: 1px solid rgba(0, 0, 0, 0.16);
}

.dummy-container.response-contact .dummy-loader{
  margin-bottom: 0.25rem;
  padding-bottom: 0.5rem;
}

.dummy-container.card-contact .dummy-loader{
  flex-direction: column;
}
.dummy-container.card-contact .dummy-top{
  flex: 1;
  align-self: center;
}
.dummy-container.card-contact .dummy-bottom{
  flex: 1;
  display: flex;
  margin-top: 1.5rem;
  align-items: center;
  flex-direction: column;
}
.dummy-container.card-contact .dummy-top .dummy-img{
  width: 8rem;
  height: 8rem;
}
.dummy-container.card-contact .dummy-social{
  display: flex;
  margin-top: 1.5rem;
  align-items: center;
  justify-content: space-evenly;
}
.dummy-container.card-contact .dummy-info{
  display: flex;
  margin-top: 2.5rem;
  flex-direction: column;
  align-items: flex-start;
}
.dummy-container.card-contact .dummy-info .dummy-line{
  margin-top: 0.5rem;
}
.dummy-container.card-contact .dummy-graph{
  display: flex;
  margin-top: 2.5rem;
  align-items: center;
  justify-content: space-evenly;
}
.dummy-container.card-contact .dummy-graph .dummy-img{
  width: 4rem;
  height: 4rem;
}

.dummy-container.card-info .dummy-loader{
  margin-bottom: 0.5rem;
  border-radius: 0.25rem;
  background-color: #ffffff;
  box-shadow: 0 2px 3px 0 rgb(0 0 0 / 4%);
}
.dummy-container.card-info .dummy-header{
  align-items: center;
  display: inline-flex;
  padding: 0.65rem 1rem;
  border: 1px solid #eeeeee;
  background-color: #f9f9f9;
  border-radius: 0.25rem 0.25rem 0 0;
}
.dummy-container.card-info .dummy-header .dummy-line{
  background-color: #cccccc;
}
.dummy-container.card-info .dummy-basic{
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.dummy-container.card-info:last-child .dummy-loader{
  margin-bottom: 0;
}

.dummy-container.card-settings{
  padding: 0 0.5rem;
}
.dummy-container.card-settings .dummy-line.heading{
  height: 1.75rem;
  margin-bottom: 2rem;
}

.dummy-container.card-pipeline .dummy-line{
  margin-bottom: 0;
}
.dummy-container.card-pipeline .dummy-img{
  width: 1.5rem;
  height: 1.5rem;
}

.dummy-container.table{
  border: none;
}
.dummy-container.table .playbook-action{
  display: flex;
  margin-bottom: 0;
  align-items: center;
  justify-content: flex-end;
}
.dummy-container.table .playbook-action .dummy-img{
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 1rem;
}
.dummy-container.table .playbook-action .dummy-img:last-child{
  margin-right: 0;
}

.dummy-searchbar{
  display: flex;
  align-items: center;
  margin-bottom: 1rem;
  justify-content: space-between;
}
.dummy-searchbar .dummy-line{
  margin: 0;
  width: 60%;
  height: 2rem;
  border-radius: 5rem;
}
.dummy-actions{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.dummy-actions .dummy-img{
  width: 2rem;
  height: 2rem;
  margin-right: 1rem;
}
.dummy-actions .dummy-line{
  margin: 0;
  width: 6rem;
  height: 2rem;
  border-radius: 5rem;
}
.dummy-actions .dummy-img:last-child{
  margin-right: 0;
}
/* Animated Content Loading */


/* Width */
.w1{width:1%;}.w2{width:2%;}.w3{width:3%;}.w4{width:4%;}.w5{width:5%;}.w6{width:6%;}.w7{width:7%;}.w8{width:8%;}.w9{width:9%;}.w10{width:10%;}.w11{width:11%;}.w12{width:12%;}.w13{width:13%;}.w14{width:14%;}.w15{width:15%;}.w16{width:16%;}.w17{width:17%;}.w18{width:18%;}.w19{width:19%;}.w20{width:20%;}.w21{width:21%;}.w22{width:22%;}.w23{width:23%;}.w24{width:24%;}.w25{width:25%;}.w26{width:26%;}.w27{width:27%;}.w28{width:28%;}.w29{width:29%;}.w30{width:30%;}.w31{width:31%;}.w32{width:32%;}.w33{width:33%;}.w34{width:34%;}.w35{width:35%;}.w36{width:36%;}.w37{width:37%;}.w38{width:38%;}.w39{width:39%;}.w40{width:40%;}.w41{width:41%;}.w42{width:42%;}.w43{width:43%;}.w44{width:44%;}.w45{width:45%;}.w46{width:46%;}.w47{width:47%;}.w48{width:48%;}.w49{width:49%;}.w50{width:50%;}.w51{width:51%;}.w52{width:52%;}.w53{width:53%;}.w54{width:54%;}.w55{width:55%;}.w56{width:56%;}.w57{width:57%;}.w58{width:58%;}.w59{width:59%;}.w60{width:60%;}.w61{width:61%;}.w62{width:62%;}.w63{width:63%;}.w64{width:64%;}.w65{width:65%;}.w66{width:66%;}.w67{width:67%;}.w68{width:68%;}.w69{width:69%;}.w70{width:70%;}.w71{width:71%;}.w72{width:72%;}.w73{width:73%;}.w74{width:74%;}.w75{width:75%;}.w76{width:76%;}.w77{width:77%;}.w78{width:78%;}.w79{width:79%;}.w80{width:80%;}.w81{width:81%;}.w82{width:82%;}.w83{width:83%;}.w84{width:84%;}.w85{width:85%;}.w86{width:86%;}.w87{width:87%;}.w88{width:88%;}.w89{width:89%;}.w90{width:90%;}.w91{width:91%;}.w92{width:92%;}.w93{width:93%;}.w94{width:94%;}.w95{width:95%;}.w96{width:96%;}.w97{width:97%;}.w98{width:98%;}.w99{width:99%;}.w100{width:100%;}
/* Width */



/* New Timeline CSS */
ul.timeline-lists{
  padding: 0;
  margin: 1rem 0;
  list-style: none;
  position: relative;
  padding-left: 70px;
}
ul.timeline-lists::before{
  top: 0;
  width: 1px;
  left: 70px;
  content: '';
  height: 100%;
  position: absolute;
  background-color: #A383E9;
}
ul.timeline-lists li{
  margin: 20px;
  position: relative;
  margin-right: 16px;
  padding-left: 10px;
}
ul.timeline-lists li:last-child{
  margin-bottom: 0;
}
ul.timeline-lists li::before{
  left: -5px;
  border: solid transparent;
  content: ' ';
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-right-color: #ffffff;
  border-width: 8px;
  top: 16px;
  margin-top: -8px;
  z-index: 1;
}
ul.timeline-lists li.separator{
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
ul.timeline-lists li.separator::before{
  display: none;
}
ul.timeline-lists li.separator small{
  height: 1px;
  left: 30px;
  width: 250px;
  position: relative;
  background-color: #e7e7e7;
}
ul.timeline-lists li > span{
  top: 0;
  width: 1px;
  left: -20px;
  content: '';
  height: 100%;
  position: absolute;
  background-color: #A383E9;
}
ul.timeline-lists li > span::after{
  top: 8px;
  left: -7px;
  content: '';
  width: 10px;
  height: 10px;
  position: absolute;
  border-radius: 50%;
  border: 2px solid #A383E9;
  background-color: #ffffff;
  animation: pulse-green 2s infinite;
}
ul.timeline-lists .content-wrapper{
  width: 100%;
  display: flex;
  padding: 1.5rem;
  box-sizing: border-box;
  border-radius: 0.25rem;
  align-items: flex-start;
  border: 1px soild #D9D9D9;
  background-color: #ffffff;
  transition: box-shadow 0.3s ease-in-out;
  box-shadow: 1px 1px 4px 1px rgba(0, 0, 0, 0.1);
}
ul.timeline-lists .content-wrapper:hover{
  /* box-shadow: 0 2px 3px rgba(0, 0, 0, 0.07); */
}
ul.timeline-lists .img-wrapper{
  width: 72px;
  margin-right: 1rem;
}
ul.timeline-lists .img-wrapper img,
ul.timeline-lists .img-wrapper [data-letters]:after{
  margin: 0;
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 50%;
  font-size: 2.25rem;
  object-position: top;
}
ul.timeline-lists .info-wrapper{
  flex: 1;
  display: flex;
  flex-direction: column;
}
ul.timeline-lists .info-wrapper p{
  color: #888888;
  font-size: 13px;
  line-height: 1.5;
  font-weight: 400;
  margin-bottom: 0.5rem;
}
ul.timeline-lists .info-wrapper p:first-child{
  color: #684CA1;
  font-size: 13px;
}
ul.timeline-lists .info-wrapper p:last-child{
  margin-bottom: 0;
}
ul.timeline-lists .time-wrapper{
  top: 8px;
  left: -70px;
  display: flex;
  text-align: right;
  position: absolute;
  flex-direction: column;
}
ul.timeline-lists .time-wrapper label{
  color: #283252;
  font-size: 14px;
  line-height: 1.25;
  font-weight: bold;
  font-style: italic;
}
ul.timeline-lists .time-wrapper span{
  color: #cdcdcd;
  line-height: 2;
  font-size: 12px;
}
/* New Timeline CSS */


/* Accordion */
.accordion-wrapper{
  width: 100%;
  display: flex;
  list-style: none;
  flex-direction: column;
}
.accordion-card{
  display: flex;
  margin-bottom: 1rem;
  flex-direction: column;
}
.accordion-card:last-child{
  margin-bottom: 0;
}
.accordion-question{
  display: flex;
  padding: 1rem;
  cursor: pointer;
  align-items: center;
  border-radius: 0.25rem;
  background-color: #e4e4e4;
  justify-content: space-between;
}
.accordion-answer p{
  color: #696969;
  font-size: 1.15rem;
  line-height: 1.5rem;
}
.accordion-question i,
.accordion-question span{
  color: #696969;
  font-size: 1.25rem;
  line-height: 1.5rem;
}
.accordion-answer{
  height: 0;
  z-index: -1;
  overflow: hidden;
  padding: 0 0.5rem;
  background-color: #ffffff;
  transition: height 0.2s ease, padding 0.2s ease;
}
.accordion-answer.show{
  z-index: 1;
  height: 100%;
  padding: 0.75rem;
}
/* Accordion */
