@import url("animate.css/css/animate.css");
@import url("../icon/icofont/css/icofont.css");
@import url("../icon/glyphter-font/css/Glyphter.css");
@import url("../icon/font-awesome/css/font-awesome.min.css");
@import url("../icon/themify-icons/themify-icons.css");
@import url("icons.css");

@-webkit-viewport {
  zoom: 1.0;
  width: device-width;
}

@-moz-viewport {
  zoom: 1.0;
  width: device-width;
}

@-ms-viewport {
  zoom: 1.0;
  width: device-width;
}

@-o-viewport {
  zoom: 1.0;
  width: device-width;
}

@viewport {
  zoom: 1.0;
  width: device-width;
}

/*
#206f28 reemplazado por #206f28


*/

/*:root {
  --favServicioMuestra-fondo: #206f28;
  --favServicioMuestra-texto: #206f28;
}*/
/**  =====================
==========================  **/
body {
  background-color: #f3f3f3;
  font-size: 0.875em;
  overflow-x: hidden;
  color: #222;
  font-family: "Poppins", sans-serif;
  background-attachment: fixed;
}

::-webkit-input-placeholder {
  /* Edge */
  color: #cbcbcb;
}

:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #cbcbcb;
}

::placeholder {
  color: #cbcbcb !important;
}

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

*:focus {
  outline: none;
}

a.text-black {
  font-size: 13px;
  color: #000000;
  text-decoration: none;
  touch-action: auto;
}

a.text-black:hover {
  font-size: 13px;
  color: #206f28;
  text-decoration: none;
  touch-action: auto;
}



a {
  font-size: 13px;
  color: #206f28;
  text-decoration: none;
  touch-action: auto;
}

@media only screen and (min-width: 1400px) {
  a {
    font-size: 14px;
  }
}

.hover1:focus,
.hover1:hover {
  text-decoration: none;
  color: #206f28;
  touch-action: auto;
}

a:focus,
a:hover {
  text-decoration: none;
  color: #1d3520;
  touch-action: auto;
}

h4 {
  font-size: 1.375rem;
}

h6 {
  font-size: 14px;
}

p {
  font-size: 14px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
}

.media-left {
  padding-right: 20px;
}


a.blackHover {
  color: #000;
}

a.blackHover:hover,
a.blackHover:active {
  color: #206f28;
}

/**====== Custom css end ======**/


/**  =====================
      Main-body css start
==========================  **/
.main-body .page-wrapper {
  padding: 1.8rem;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

.main-body .page-header h5 {
  color: #206f28;
}

/**====== Main-body css end ======**/


/*====== Ready to use Css Start ======*/
.wrapper {
  padding: 0;
}

/*====== Ready to use Css End ======*/
.card {
  border-radius: 5px;
  -webkit-box-shadow: 0 1px 2.94px 0.06px rgba(4, 26, 55, 0.16);
  box-shadow: 0 1px 2.94px 0.06px rgba(4, 26, 55, 0.16);
  border: none;
  margin-bottom: 30px;
  /* overflow: hidden; */
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.card .card-footer {
  background-color: #fff;
  border-top: none;
}

.card .card-header {
  background-color: transparent;
  border-bottom: none;
  padding: 25px 25px;
}


.card .card-header .card-title {
  font-size: 18px !important;
  color: #60605d;
  font-weight: 400;
}

.card .card-header .card-header-left {
  display: inline-block;
}

.card .card-header .card-header-right {
  border-radius: 0 0 0 7px;
  right: 10px;
  top: 18px;
  display: inline-block;
  float: right;
  padding: 7px 0;
  position: absolute;
}

.card .card-header .card-header-right i {
  margin: 0 11px;
  cursor: pointer;
  font-size: 12px;
  color: #8c8c8c;
  line-height: 2;
}

.card .card-header .card-header-right i.icofont.icofont-spinner-alt-5 {
  display: none;
}

.card .card-header .card-header-right .card-option {
  width: 35px;
  height: 20px;
  overflow: hidden;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.card .card-header .card-header-right .card-option li {
  display: inline-block;
}

.card .card-header span {
  display: block;
  font-size: 13px;
  margin-top: 5px;
}

.card .card-header+.card-block,
.card .card-header+.card-block-big {
  padding-top: 0;
}

.card .card-header h5 {
  margin-bottom: 0;
  color: #222;
  font-size: 14px;
  font-weight: 600;
  display: inline-block;
  margin-right: 10px;
  line-height: 1.4;
}

.card .card-block {
  padding: 25px 25px;
}

.card .card-block table tr {
  padding-bottom: 20px;
}

.card .card-block .sub-title {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
}

.card .card-block code {
  background-color: #eee;
  margin: 5px;
  display: inline-block;
}


.card .card-block.remove-label i {
  margin: 0;
  padding: 0;
}

.card .card-block.button-list span.badge {
  margin-left: 5px;
}








.card .card-block .badge-box {
  padding: 10px;
  margin: 12px 0;
}

.card .card-block-big {
  padding: 35px 35px;
}

.card .card-block-small {
  padding: 15px 15px;
}



.pcoded .card.full-card {
  position: fixed;
  top: 56px;
  z-index: 99999;
  -webkit-box-shadow: none;
  box-shadow: none;
  left: 0;
  border-radius: 0;
  border: 1px solid #ddd;
  width: 100vw;
  height: calc(100vh - 56px);
}

.pcoded .card.full-card.card-load {
  position: fixed;
}

.pcoded .card.card-load {
  position: relative;
  overflow: hidden;
}

.pcoded .card.card-load .card-loader {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 999;
}

.pcoded .card.card-load .card-loader i {
  margin: 0 auto;
  color: #ab7967;
  font-size: 20px;
}

.card-header-text {
  margin-bottom: 0;
  font-size: 1rem;
  color: rgba(51, 51, 51, 0.85);
  font-weight: 600;
  display: inline-block;
  vertical-align: middle;
}

.icofont-rounded-down {
  -webkit-transition: all ease-in 0.3s;
  display: inline-block;
  transition: all ease-in 0.3s;
}

.icon-up {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.rotate-refresh {
  -webkit-animation: mymove 0.8s infinite linear;
  animation: mymove 0.8s infinite linear;
  display: inline-block;
}

@-webkit-keyframes mymove {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes mymove {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.breadcrumb-title a {
  font-size: 14px;
  color: #4a6076;
}

.breadcrumb-title li:last-child a {
  color: #7e7e7e;
}

.overflow-ellipsis {

  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;

}

/*======= Textos colores ===========*/
.text-primary {
  color: #206f28 !important;
}

.text-warning {
  color: #f1c40f !important;
}

.text-default {
  color: #e0e0e0 !important;
}

.text-danger {
  color: #FF5370 !important;
}

.text-success {
  color: #2ed8b6 !important;
}

.text-inverse {
  color: #222 !important;
}

.text-info {
  color: #00bcd4 !important;
}

.text-custom {
  color: #64b0f2 !important;
}

.text-pink {
  color: #ff7aa3 !important;
}

.text-muted {
  color: #919aa3 !important;
}

.text-dark {
  color: #2b3d51 !important;
}

.text-purple {
  color: #9261c6 !important;
}

.text-muted {
  color: #919aa3 !important;
}

.text-white {
  color: #fff !important;
}

/*======= Text css ends ===========*/
/*======= Label-color css starts  ======= */










.label {
  border-radius: 2px;
  color: #fff;
  font-size: 12px;
  line-height: 1;
  margin-bottom: 0;
  text-transform: capitalize;
}

.label-primary {
  background: linear-gradient(45deg, #206f28, #73b4ff);
}

.label-warning {
  background: linear-gradient(45deg, #f1c40f, #f4d03f);
}

.label-default {
  background: linear-gradient(45deg, #e0e0e0, #fafafa);
}

.label-danger {
  background: linear-gradient(45deg, #FF5370, #ff869a);
}

.label-success {
  background: linear-gradient(45deg, #2ed8b6, #59e0c5);
}

.label-inverse {
  background: linear-gradient(45deg, #222, #3c3c3c);
}

.label-info {
  background: linear-gradient(45deg, #00bcd4, #08e3ff);
}

.label-warning {
  color: #fff;
}


.border-dashed {
  border-style: dashed !important;
  border-width: 1px;
}

.border-bottom-dash {
  border-bottom-width: 1px;
  border-bottom-style: dashed;
  border-bottom-color: #a8b2bd;

}

.border-top-dash {
  border-top-width: 1px;
  border-top-style: dashed;
  border-top-color: #a8b2bd;

}

.rounded-0 {
  border-radius: 0px;
}

.border-left {
  border-left: 1px solid #ccc;
}

.shadow-0 {
  box-shadow: none;
}



.list-item-border-dash {
  border-bottom-width: 1px;
  border-bottom-style: dashed;
  border-bottom-color: #a8b2bd;
  padding: 1rem 0rem;
}


.label-rol {
  background-color: #d3f1eb;
  color: #19c29d !important;
  border-radius: 4px;
  font-size: 12px;
  padding: .40rem 7px;
  font-weight: 500;
  text-transform: capitalize;
  display: inline-flex;
  align-items: center;
}

.label-permiso {
  background-color: #d3dff5;
  color: #0b6bda !important;
  border-radius: 4px;
  font-size: 12px;
  padding: .40rem 7px;
  font-weight: 500;
  text-transform: capitalize;
  display: inline-flex;
  align-items: center;
}





/*======= Label-color css starts  ======= */

/*************
gradientes
**************/

.bg-gradient-default {
  background: linear-gradient(87deg, #206f28 0, #8fb887 100%) !important;
}

.bg-gradient-secondary {
  background: linear-gradient(87deg, #35446b 0, #5c77b9 100%) !important;
}

/*======= Badge-color css starts  ======= */
.badge {
  border-radius: 6px;
  padding: 5px 6px;
}

.badge-top-left {
  margin-right: -10px;
  right: 100%;
  top: -3px;
}

.badge-top-right {
  margin-left: -10px;
  top: -3px;
}

.badge-bottom-left {
  margin-left: -33px;
  bottom: -12px;
  right: 97%;
}

.badge-bottom-right {
  margin-left: -10px;
  bottom: -12px;
}

.label {
  border-radius: 4px;
  font-size: 75%;
  padding: 4px 7px;
  margin-right: 5px;
  font-weight: 400;
  color: #fff !important;
}

.label.label-lg {
  padding: 8px 21px;
}

.label.label-md {
  padding: 6px 14px;
}

.badge-lg {
  padding: 5px 9px;
  font-size: 14px;
}

.badge-md {
  padding: 4px 8px;
  font-size: 14px;
}

span.badge {
  display: inline-block !important;
}

.label-main {
  display: inline-block;
  vertical-align: middle;
  margin: 8px 5px;
}

.label-default {
  background-color: #e0e0e0 !important;
  border-color: #e0e0e0;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
}

.label-inverse-default {
  border: 1px solid;
  border-color: #e0e0e0;
  color: #e0e0e0 !important;
}

.label-inverse-primary {
  border: 1px solid;
  border-color: #4099ff;
  color: #4099ff !important;
}

.label-inverse-success {
  border: 1px solid;
  border-color: #2ed8b6;
  color: #2ed8b6 !important;
}

.label-inverse-warning {
  border: 1px solid;
  border-color: #f1c40f;
  color: #f1c40f !important;
}

.label-inverse-danger {
  border: 1px solid;
  border-color: #FF5370;
  color: #FF5370 !important;
}

.label-inverse-info {
  border: 1px solid;
  border-color: #00bcd4;
  color: #00bcd4 !important;
}

.label-inverse-info-border {
  border: 1px solid;
  border-color: #222;
  color: #222 !important;
}

.badge-primary {
  background: #398ff1;
}

.badge-warning {
  background: #f1c40f;
}

.badge-default {
  background: #e0e0e0;
  color: #333;
}

.badge-danger {
  background: #FF5370;
}

.badge-success {
  background: #2ed8b6;
}

.badge-inverse {
  background: #3c3c3c;
}

.badge-info {
  background: #00bcd4;
}

.badge-inverse-default {
  border: 1px solid;
  border-color: #e0e0e0;
  color: #e0e0e0 !important;
}

.badge-inverse-primary {
  border: 1px solid;
  border-color: #4099ff;
  color: #4099ff !important;
}

.badge-inverse-success {
  border: 1px solid;
  border-color: #2ed8b6;
  color: #2ed8b6 !important;
}

.badge-inverse-warning {
  border: 1px solid;
  border-color: #f1c40f;
  color: #f1c40f !important;
}

.badge-inverse-danger {
  border: 1px solid;
  border-color: #FF5370;
  color: #FF5370 !important;
}

.badge-inverse-info {
  border: 1px solid;
  border-color: #222;
  color: #222 !important;
}

/*======= Badge-color css end  ======= */
/*======= Background-color css starts  ======= */
.bg-color-box {
  text-align: center;
  display: inline-block;
  padding: 10px 20px;
  -webkit-box-shadow: 0 0 5px 0 rgba(128, 128, 128, 0.49);
  box-shadow: 0 0 5px 0 rgba(128, 128, 128, 0.49);
  font-weight: 600;
  margin-right: 20px;
  margin-bottom: 20px;
  cursor: pointer;
}

.bg-color-box span {
  color: #fff;
}

.bg-primary {
  background-color: #206f28 !important;

}

.bg-warning {
  background-color: #f1c40f !important;

}

.bg-default {
  background-color: #e0e0e0 !important;

}

.bg-danger {
  background-color: #FF5370 !important;

}

.bg-success {
  background-color: #2ed8b6 !important;

}

.bg-inverse {
  background-color: #222 !important;

}

.bg-info {
  background-color: #00bcd4 !important;

}

/*======= Background-color css end  ======= */

/**====== margenes y padding ======**/

.mt-23rem {
  margin-top: 2.3rem;
}

.mt--6,
.my--6 {
  margin-top: -10.5rem !important;
}


.pt--6 {
  padding-top: 10px;
}

.pb--6 {
  padding-bottom: 10px;
}

.pb-6 {
  padding-bottom: 60px;
}

/**====== Basic-Buttons css Start ======**/



.btn-index {
  border-radius: 7px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  padding: 32px 0;
  font-size: 1.2rem;

  transition: all 0.25s ease;
  border: none;
  color: #fff;
}

.btn-index.menu-btn-01 {
  background: #206f28;

}

.btn-index.menu-btn-01:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  background: #3b7541;
  color: #b6e4ad;
}


.btn-index.menu-btn-02 {
  background: #16441b;

}

.btn-index.menu-btn-02:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  background: #3b5735;
  color: #b6e4ad;
}

.btn-index.menu-btn-03 {
  background: #388b41;

}

.btn-index.menu-btn-03:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  background: #84b87a;
  color: #1e4e23;
}

.btn-index.menu-btn-04 {
  background: #568b5c;

}

.btn-index.menu-btn-04:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  background: #c4e9bd;
  color: #568b5c;
}


.btn-index.menu-btn-05 {
  background: #213524;

}

.btn-index.menu-btn-05:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
  background: #3e6143;
  color: #c4e9bd;
}



.btn-index .icon {
  font-size: 2.5rem;
  display: block;

  color: #99c891;
}


.btn-primary,
.sweet-alert button.confirm,
.wizard>.actions a {
  background-color: #206f28;
  border-color: #206f28;
  color: #fff;
  cursor: pointer;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

.btn-primary:hover,
.sweet-alert button.confirm:hover,
.wizard>.actions a:hover {
  background-color: #86b47c;
  border-color: #86b47c;
}

.btn-primary:active,
.sweet-alert button.confirm:active,
.wizard>.actions a:active {
  background-color: #206f28 !important;
  border-color: #206f28;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
}

.btn-primary:focus,
.sweet-alert button.confirm:focus,
.wizard>.actions a:focus {
  -webkit-box-shadow: none;
  border-color: #206f28;
  box-shadow: none;
  color: #fff;
  background-color: #86b47c;
}

.btn-primary.disabled,
.sweet-alert button.disabled.confirm,
.wizard>.actions a.disabled {
  background-color: rgba(115, 212, 144, 0.5);
  border-color: rgba(115, 212, 144, 0.5);
}

.btn-warning {
  background-color: #f1c40f;
  border-color: #f1c40f;
  color: #fff;
  cursor: pointer;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

.btn-warning:hover {
  background-color: #f4d03f;
  border-color: #f4d03f;
  color: #fff;
}

.btn-warning:active {
  background-color: #b8960b !important;
  border-color: #b8960b;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
}

.btn-warning:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  background-color: #f4d03f;
}

.btn-warning.disabled {
  background-color: rgba(241, 196, 15, 0.5);
  border-color: rgba(241, 196, 15, 0.5);
}

.btn-danger {
  background-color: #FF5370;
  border-color: #FF5370;
  color: #fff;
  cursor: pointer;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

.btn-danger:hover {
  background-color: #ff869a !important;
  border-color: #ff869a !important;
  color: #fff !important;
}

.btn-danger:active {
  background-color: #ff163d !important;
  border-color: #ff163d !important;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff !important;
}

.btn-danger:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  background-color: #ff869a;
}

.btn-danger.disabled {
  background-color: rgba(255, 83, 112, 0.5);
  border-color: rgba(255, 83, 112, 0.5);
}

.btn-success {
  background-color: #2ed8b6;
  border-color: #2ed8b6;
  color: #fff;
  cursor: pointer;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

.btn-success:hover {
  background-color: #59e0c5;
  border-color: #59e0c5;
}

.btn-success:active {
  background-color: #20a98e !important;
  border-color: #20a98e;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
}

.btn-success:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  background-color: #59e0c5;
}

.btn-success.disabled {
  background-color: rgba(46, 216, 182, 0.5);
  border-color: rgba(46, 216, 182, 0.5);
}

.btn-inverse {
  background-color: #222;
  border-color: #222;
  color: #fff;
  cursor: pointer;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

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

.btn-inverse:active {
  background-color: #030303 !important;
  border-color: #030303;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
}

.btn-inverse:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  background-color: #3c3c3c;
}

.btn-inverse.disabled {
  background-color: rgba(34, 34, 34, 0.5);
  border-color: rgba(34, 34, 34, 0.5);
}

.btn-info {
  background-color: #00bcd4;
  border-color: #00bcd4;
  color: #fff;
  cursor: pointer;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

.btn-info:hover {
  background-color: #08e3ff;
  border-color: #08e3ff;
}

.btn-info:active {
  background-color: #008697 !important;
  border-color: #008697;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
}

.btn-info:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  background-color: #08e3ff;
}

.btn-info.disabled {
  background-color: rgba(0, 188, 212, 0.5);
  border-color: rgba(0, 188, 212, 0.5);
}

.btn-disabled {
  background-color: rgba(64, 153, 255, 0.5);
  border-color: rgba(64, 153, 255, 0.5);
  color: #fff;
  cursor: pointer;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

/**====== Basic-Buttons css end ======**/
/**====== Outline-Buttons css Start ======**/
.btn-outline-primary {
  color: #206f28;
  background-color: #fff;
  background-color: transparent;
  border-color: #206f28;
}

.btn-outline-primary:hover,
.btn-outline-primary:active,
.btn-outline-primary:focus {
  background-color: #8fb887 !important;
  border-color: #8fb887 !important;
  box-shadow: 0 0 0 0 !important;
}


.btn-dark:hover,
.btn-dark:active,
.btn-dark:focus {
  background-color: #393b39 !important;
  border-color: #393d39 !important;
  box-shadow: 0 0 0 0 !important;
}



.btn-check:active+.btn-outline-primary,
.btn-check:checked+.btn-outline-primary,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show,
.btn-outline-primary:active {
  background-color: #8fb887 !important;
  border-color: #8fb887 !important;
  box-shadow: 0 0 0 0 !important;
}

.btn-outline-warning {
  color: #b8960b;
  background-color: #fff;
  background-color: transparent;
  border-color: #b8960b;
}

.btn-outline-danger {
  color: #ff163d;
  background-color: #fff;
  background-color: transparent;
}

.btn-outline-danger:hover,
.btn-outline-danger:active,
.btn-outline-danger:focus {
  color: #da576c;
  border-color: #da576c;
  background-color: #fff;
  background-color: transparent;
}


.btn-outline-success {
  color: #20a98e;
  background-color: #fff;
  background-color: transparent;
}

.btn-outline-inverse {
  color: #030303;
  background-color: #fff;
  background-color: transparent;
}

.btn-outline-inverse:hover {
  color: #fff;
}

.btn-outline-warning {
  color: #b8960b;
  background-color: #fff;
  background-color: transparent;
}

.btn-outline-info {
  color: #008697;
  background-color: #fff;
  background-color: transparent;
}

.btn-outline-disabled {
  color: #0378ff;
  background-color: #fff;
}



.btn.btn-rounded {
  border-radius: 50px;
}

.btn.btn-icon {
  width: 42px;
  height: 42px;
  padding: 0;
  line-height: 42px;
}

.btn.btn-icon-sm {
  width: 30px;
  height: 30px;
  padding: 0;
  line-height: 30px;
}

.btn.btn-icon-xs {
  width: 20px;
  height: 20px;
  padding: 0;
  line-height: 20px;
}

.btn-outline-white-opacity {
  color: #ffffff;
  border-color: #ffffff;
  border-width: 2px;
  background-color: rgba(252, 252, 252, 0.5);
}

.btn-outline-white-opacity:hover {
  color: #fff;
  background-color: rgba(252, 252, 252, 0.5);
  border-color: #ffffff;
}

/**====== Outline-Buttons css end ======**/

/********************
sweet alert 
*********************/

.swal-button--cancel {
  color: #8fb887;
  border: 1px solid #8fb887;
  background: transparent;
}

.swal-button--cancel:hover {
  color: #6d9066;
  background-color: rgba(252, 252, 252, 0.5);
  border-color: #6d9066;
}

.swal-button--confirm {
  color: #fff;
  border: 1px solid #206f28;
  background: #206f28;
}

.swal-button--confirm:hover {
  color: #fff;
  border: 1px solid #8fb887;
  background: #8fb887;
}

/*====== Font-size css starts ======*/
.f-10 {
  font-size: 10px !important;
}

.f-12 {
  font-size: 12px !important;
}

.f-13 {
  font-size: 13px !important;
}

.f-14 {
  font-size: 14px !important;
}

.f-16 {
  font-size: 16px !important;
}

.f-18 {
  font-size: 18px !important;
}

.f-20 {
  font-size: 20px;
}

.f-22 {
  font-size: 22px;
}

.f-24 {
  font-size: 24px;
}

.f-26 {
  font-size: 26px;
}

.f-28 {
  font-size: 28px;
}

.f-30 {
  font-size: 30px !important;
}

.f-32 {
  font-size: 32px;
}

.f-34 {
  font-size: 34px;
}

.f-36 {
  font-size: 36px;
}

.f-38 {
  font-size: 38px;
}

.f-40 {
  font-size: 40px;
}

.f-42 {
  font-size: 42px;
}

.f-44 {
  font-size: 44px;
}

.f-46 {
  font-size: 46px;
}

.f-48 {
  font-size: 48px;
}

.f-50 {
  font-size: 50px;
}

.f-52 {
  font-size: 52px;
}

.f-54 {
  font-size: 54px;
}

.f-56 {
  font-size: 56px;
}

.f-58 {
  font-size: 58px;
}

.f-60 {
  font-size: 60px;
}

.f-62 {
  font-size: 62px;
}

.f-64 {
  font-size: 64px;
}

.f-66 {
  font-size: 66px;
}

.f-68 {
  font-size: 68px;
}

.f-70 {
  font-size: 70px;
}

.f-72 {
  font-size: 72px;
}

.f-74 {
  font-size: 74px;
}

.f-76 {
  font-size: 76px;
}

.f-78 {
  font-size: 78px;
}

.f-80 {
  font-size: 80px;
}

/*====== Font-size css ends ======*/
/*====== Font-weight css starts ======*/
.f-w-100 {
  font-weight: 100;
}

.f-w-300 {
  font-weight: 300;
}

.f-w-400 {
  font-weight: 400;
}

.f-w-500 {
  font-weight: 500;
}

.f-w-600 {
  font-weight: 600;
}

.f-w-700 {
  font-weight: 700;
}

.f-w-900 {
  font-weight: 900;
}

/*====== Font-weight css ends ======*/
/*====== Font-style css starts ======*/
.f-s-normal {
  font-style: normal;
}

.f-s-italic {
  font-style: italic;
}

.f-s-oblique {
  font-style: oblique;
}

.f-s-initial {
  font-style: initial;
}

.f-s-inherit {
  font-style: inherit;
}

/*====== Font-style css ends ======*/


/*************
wave animation
 ************/

.wave {
  background-color: #F3F6F9;
  overflow: hidden;
  position: relative;
}

.wave>div {
  z-index: 1;
}

.wave:before {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ffffff;
  z-index: -1;
}

.wave:after {
  content: " ";
  width: 1000px;
  height: 1025px;
  position: absolute;
  bottom: 65%;
  left: -250px;
  border-radius: 35%;
  background: white;
  z-index: 0;
}

.wave:after {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.wave-animate:after {
  -webkit-animation: animate-wave 15s infinite linear;
  animation: animate-wave 15s infinite linear;
}

.wave-animate-slower:after {
  -webkit-animation: animate-wave 50s infinite linear;
  animation: animate-wave 50s infinite linear;
}

.wave-animate-slow:after {
  -webkit-animation: animate-wave 25s infinite linear;
  animation: animate-wave 25s infinite linear;
}

.wave-animate-fast:after {
  -webkit-animation: animate-wave 10s infinite linear;
  animation: animate-wave 10s infinite linear;
}

.wave-animate-faster:after {
  -webkit-animation: animate-wave 5s infinite linear;
  animation: animate-wave 5s infinite linear;
}

.wave.wave-primary {
  background-color: rgba(143, 175, 130, 0.3) !important;
}

.wave.wave-secondary {
  background-color: rgba(228, 230, 239, 0.1) !important;
}

.wave.wave-secondary .svg-icon svg g [fill] {
  fill: #E4E6EF;
}

.wave.wave-success {
  background-color: rgba(27, 197, 189, 0.1) !important;
}

.wave.wave-info {
  background-color: rgba(137, 80, 252, 0.1) !important;
}

.wave.wave-warning {
  background-color: rgba(255, 168, 0, 0.1) !important;
}

.wave.wave-warning .svg-icon svg g [fill] {
  fill: #FFA800;
}

.wave.wave-danger {
  background-color: rgba(246, 78, 96, 0.1) !important;
}

.wave.wave-danger .svg-icon svg g [fill] {
  fill: #F64E60;
}

.wave.wave-light {
  background-color: rgba(243, 246, 249, 0.1) !important;
}

.wave.wave-light .svg-icon svg g [fill] {
  fill: #F3F6F9;
}

.wave.wave-dark {
  background-color: rgba(24, 28, 50, 0.1) !important;
}

.wave.wave-dark .svg-icon svg g [fill] {
  fill: #181C32;
}

.wave.wave-white {
  background-color: rgba(255, 255, 255, 0.1) !important;
}

.wave.wave-white .svg-icon svg g [fill] {
  fill: #ffffff;
}

@-webkit-keyframes animate-wave {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes animate-wave {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/*======= Loader-color css starts  ======= */
.loader-primary {
  background-color: #206f28 !important;
}

.loader-warning {
  background-color: #f1c40f !important;
}

.loader-default {
  background-color: #e0e0e0 !important;
}

.loader-danger {
  background-color: #FF5370 !important;
}

.loader-success {
  background-color: #2ed8b6 !important;
}

.loader-inverse {
  background-color: #222 !important;
}

.loader-info {
  background-color: #00bcd4 !important;
}

/*======= Loader-color css ends  ======= */

/*======= Card-Border-Top-color css starts  ======= */
.card-border-primary {
  border-top: 4px solid #206f28;
}

.card-border-warning {
  border-top: 4px solid #f1c40f;
}

.card-border-default {
  border-top: 4px solid #e0e0e0;
}

.card-border-danger {
  border-top: 4px solid #FF5370;
}

.card-border-success {
  border-top: 4px solid #2ed8b6;
}

.card-border-inverse {
  border-top: 4px solid #222;
}

.card-border-info {
  border-top: 4px solid #00bcd4;
}

/*======= Card-Border-Top-color css ends  ======= */
/*======= Panels-wells-color css starts  ======= */
.panels-wells .panel-primary {
  border-color: #206f28;
}

.panels-wells .panel-warning {
  border-color: #f1c40f;
}

.panels-wells .panel-default {
  border-color: #e0e0e0;
}

.panels-wells .panel-danger {
  border-color: #FF5370;
}

.panels-wells .panel-success {
  border-color: #2ed8b6;
}

.panels-wells .panel-inverse {
  border-color: #222;
}

.panels-wells .panel-info {
  border-color: #00bcd4;
}

/*======= Panels-wells-color css ends  ======= */
/*======= All-Borders-color css starts  ======= */
.b-t-primary {
  border-top: 1px solid #206f28;
}

.b-b-primary {
  border-bottom: 1px solid #206f28;
}

.b-l-primary {
  border-left: 1px solid #206f28;
}

.b-r-primary {
  border-right: 1px solid #206f28;
}

.b-t-warning {
  border-top: 1px solid #f1c40f;
}

.b-b-warning {
  border-bottom: 1px solid #f1c40f;
}

.b-l-warning {
  border-left: 1px solid #f1c40f;
}

.b-r-warning {
  border-right: 1px solid #f1c40f;
}

.b-t-default {
  border-top: 1px solid #e0e0e0;
}

.b-b-default {
  border-bottom: 1px solid #e0e0e0;
}

.b-l-default {
  border-left: 1px solid #e0e0e0;
}

.b-r-default {
  border-right: 1px solid #e0e0e0;
}

.b-t-danger {
  border-top: 1px solid #FF5370;
}

.b-b-danger {
  border-bottom: 1px solid #FF5370;
}

.b-l-danger {
  border-left: 1px solid #FF5370;
}

.b-r-danger {
  border-right: 1px solid #FF5370;
}

.b-t-success {
  border-top: 1px solid #2ed8b6;
}

.b-b-success {
  border-bottom: 1px solid #2ed8b6;
}

.b-l-success {
  border-left: 1px solid #2ed8b6;
}

.b-r-success {
  border-right: 1px solid #2ed8b6;
}

.b-t-inverse {
  border-top: 1px solid #222;
}

.b-b-inverse {
  border-bottom: 1px solid #222;
}

.b-l-inverse {
  border-left: 1px solid #222;
}

.b-r-inverse {
  border-right: 1px solid #222;
}

.b-t-info {
  border-top: 1px solid #00bcd4;
}

.b-b-info {
  border-bottom: 1px solid #00bcd4;
}

.b-l-info {
  border-left: 1px solid #00bcd4;
}

.b-r-info {
  border-right: 1px solid #00bcd4;
}

.b-t-theme {
  border-top: 1px solid #d6d6d6;
}

.b-b-theme {
  border-bottom: 1px solid #d6d6d6;
}

.b-l-theme {
  border-left: 1px solid #d6d6d6;
}

.b-r-theme {
  border-right: 1px solid #d6d6d6;
}

/*======= All-Borders-color css ends  ======= */
/*======= All-color css start  ======= */
.bg-facebook {
  background: linear-gradient(45deg, #3B5997, #4c70b9);
}

.text-facebook {
  color: #3B5997;
}

.bg-twitter {
  background: linear-gradient(45deg, #42C0FB, #74d1fc);
}

.text-twitter {
  color: #42C0FB;
}

.bg-dribbble {
  background: linear-gradient(45deg, #EC4A89, #f178a7);
}

.text-dribbble {
  color: #EC4A89;
}

.bg-pinterest {
  background: linear-gradient(45deg, #BF2131, #dc3747);
}

.text-pinterest {
  color: #BF2131;
}

.bg-youtube {
  background: linear-gradient(45deg, #E0291D, #e75249);
}

.text-youtube {
  color: #E0291D;
}

.bg-googleplus {
  background: linear-gradient(45deg, #C73E2E, #d75f51);
}

.text-googleplus {
  color: #C73E2E;
}

.bg-instagram {
  background: linear-gradient(45deg, #AA7C62, #bc9883);
}

.text-instagram {
  color: #AA7C62;
}

/* .bg-viber {
  background: linear-gradient(45deg, #7B519D, #a48db7);
}

.text-viber {
  color: #7B519D;
} */


.bg-viber {
  background: linear-gradient(45deg, #00B7F1, #5fa5ba);
}

.text-viber {
  color: #00B7F1;
}


.bg-amazon {
  background: linear-gradient(45deg, #000, #1a1a1a);
}

.text-amazon {
  color: #000;
}

.bg-c-primario {
  background: linear-gradient(45deg, #206f28, #8daf87);
}

.bg-c-blue {
  background: linear-gradient(45deg, #60839a, #73b4ff);
}

.text-c-blue {
  color: #206f28;
}

.bg-c-pink {
  background: linear-gradient(45deg, #FF5370, #ff869a);
}

.text-c-pink {
  color: #FF5370;
}

.bg-c-green {
  background: linear-gradient(45deg, #2ed8b6, #59e0c5);
}

.text-c-green {
  color: #2ed8b6;
}

.bg-c-yellow {
  background: linear-gradient(45deg, #FFB64D, #ffcb80);
}

.text-c-yellow {
  color: #FFB64D;
}

.bg-c-orenge {
  background: linear-gradient(45deg, #FE8A7D, #feb8b0);
}

.text-c-orenge {
  color: #FE8A7D;
}

.bg-c-lite-green {
  background: linear-gradient(45deg, #69CEC6, #8fdbd5);
}

.text-c-lite-green {
  color: #69CEC6;
}

/*======= All-color css ends  ======= */
/**====== Generic-class css end ======**/
.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(1)>a>.pcoded-micon {
  color: #206f28;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(2)>a>.pcoded-micon {
  color: #f78ea4;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(3)>a>.pcoded-micon {
  color: #2ed8b6;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(4)>a>.pcoded-micon {
  color: #f1c40f;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(5)>a>.pcoded-micon {
  color: #ab7967;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(6)>a>.pcoded-micon {
  color: #39ADB5;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(7)>a>.pcoded-micon {
  color: #7C4DFF;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(8)>a>.pcoded-micon {
  color: #FF5370;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(9)>a>.pcoded-micon {
  color: #206f28;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(10)>a>.pcoded-micon {
  color: #f78ea4;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(11)>a>.pcoded-micon {
  color: #2ed8b6;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(12)>a>.pcoded-micon {
  color: #f1c40f;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(13)>a>.pcoded-micon {
  color: #ab7967;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(14)>a>.pcoded-micon {
  color: #39ADB5;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(15)>a>.pcoded-micon {
  color: #7C4DFF;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(16)>a>.pcoded-micon {
  color: #FF5370;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(17)>a>.pcoded-micon {
  color: #206f28;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(18)>a>.pcoded-micon {
  color: #f78ea4;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(19)>a>.pcoded-micon {
  color: #2ed8b6;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(20)>a>.pcoded-micon {
  color: #f1c40f;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(21)>a>.pcoded-micon {
  color: #ab7967;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(22)>a>.pcoded-micon {
  color: #39ADB5;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(23)>a>.pcoded-micon {
  color: #7C4DFF;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li:nth-child(24)>a>.pcoded-micon {
  color: #FF5370;
}

.pcoded[nav-type="st2"] .pcoded-item.pcoded-left-item>li>a>.pcoded-micon {
  color: #222;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li>a>.pcoded-micon,
.pcoded[nav-type="st2"] .pcoded-item.pcoded-left-item>li>a>.pcoded-micon {
  color: #222;
}

.pcoded[nav-type="st1"] .pcoded-item.pcoded-left-item>li>a>.pcoded-micon b,
.pcoded[nav-type="st2"] .pcoded-item.pcoded-left-item>li>a>.pcoded-micon b {
  display: none;
}

/**  =====================
      Left-side-menu css start
==========================  **/
.main-menu {
  float: left;
  width: 235px;
  z-index: 99;
}

.main-menu .main-menu-header {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 30px 20px 15px;
}

.main-menu .main-menu-header .user-details {
  display: inline-block;
  margin-left: 15px;
  margin-right: 15px;
}


.img-radius {
  border-radius: 50%;
}

.main-menu .main-menu-header .user-details #more-details {
  cursor: pointer;
}

.main-menu .main-menu-header .user-details span {
  color: #000;
  display: block;
  font-size: 14px;
  text-transform: capitalize;
}

.main-menu .main-menu-header .user-details span i {
  font-size: 10px;
  margin-left: 10px;
}

.main-menu .main-menu-header .user-details span:first-child {
  margin-bottom: 5px;
  font-weight: 600;
}

.main-menu .main-menu-header .user-details span:last-child {
  color: #999;
  font-size: 12px;
}

.main-menu .main-menu-content .more-details {
  display: none;
}

.main-menu .main-menu-content .more-details a {
  padding: 10px 25px;
  display: block;
  color: #000;
  -webkit-transition: all ease-in 0.3s;
  transition: all ease-in 0.3s;
}

.main-menu .main-menu-content .more-details a:hover {
  color: #206f28;
}

.main-menu .main-menu-content .more-details a i {
  margin-right: 10px;
}

.main-menu .main-menu-content .menu-search {
  padding: 20px 20px 10px;
}

.main-menu .main-menu-content li {
  position: relative;
}

.pcoded[theme-layout="vertical"][vertical-nav-type="collapsed"] .main-menu-content,
.pcoded[theme-layout="vertical"][vertical-nav-type="collapsed"] .main-menu-header {
  display: none;
}

.pcoded[theme-layout="vertical"][vertical-nav-type="collapsed"] .main-menu {
  width: 56px;
}

.sidebar_toggle a {
  margin: -5px;
  line-height: 1;
}


.selector-toggle>a:before {
  font-family: 'themify';
  font-size: 20px;
  content: "\e60f";
  position: relative;
  float: left;
  left: 13px;
  line-height: 35px;
  transition: 0.5s;
  -webkit-transition: 0.5s;
  -ms-transition: 0.5s;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -webkit-animation: mymove 1.3s infinite linear;
  animation: mymove 1.3s infinite linear;
}

.open .selector-toggle>a:before {
  font-family: 'themify';
  font-size: 20spx;
  content: "\e646";
  position: relative;
  float: left;
  left: 13px;
  line-height: 35px;
  transition: 0.5s;
  -webkit-transition: 0.5s;
  -ms-transition: 0.5s;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -webkit-animation: mymove 0s infinite linear;
  animation: mymove 0s infinite linear;
}




.pcoded[theme-layout="vertical"][vertical-nav-type="fullpage"] .pcoded-main-container,
.pcoded[theme-layout="vertical"][vnavigation-view="view3"] .pcoded-main-container {
  position: static;
}

.pcoded .pcoded-header[header-theme="theme1"] {
  background: -webkit-gradient(linear, left top, right top, from(#1b1f24), to(#51606d));
  background: linear-gradient(to right, #1b1f24, #51606d);
}

.pcoded .pcoded-header[header-theme="theme1"] a {
  color: #fff;
}


.pcoded .pcoded-header[header-theme="theme5"] {
  background: -webkit-gradient(linear, left top, right top, from(#206f28), to(#99c891));
  background: linear-gradient(to right, #206f28, #99c891);
}

.pcoded .pcoded-header[header-theme="theme5"] a {
  color: #fff;
}

.pcoded-hasmenu a {
  color: #222;
}

.pcoded-hasmenu a:hover {
  color: #206f28;
}

body .pcoded[pcoded-device-type="phone"][vertical-nav-type="expanded"] .pcoded-navbar,
body .pcoded[pcoded-device-type="tablet"][vertical-nav-type="expanded"] .pcoded-navbar {
  position: fixe !important;
}

body .pcoded[pcoded-device-type="phone"][vertical-nav-type="expanded"] .pcoded-navbar .pcoded-item .pcoded-hasmenu>.pcoded-submenu,
body .pcoded[pcoded-device-type="tablet"][vertical-nav-type="expanded"] .pcoded-navbar .pcoded-item .pcoded-hasmenu>.pcoded-submenu {
  -webkit-transition: all 0s ease-in !important;
  transition: all 0s ease-in !important;
}

body .pcoded[theme-layout="vertical"][vertical-placement="right"][vertical-nav-type="collapsed"] .pcoded-navbar .pcoded-item>li>a .pcoded-micon {
  left: 0;
}

body .pcoded[theme-layout="vertical"][vertical-placement="right"][vertical-nav-type="collapsed"] .pcoded-navbar .pcoded-item>li.pcoded-trigger>a .pcoded-micon {
  left: calc(100% - 30px);
}

body .pcoded[theme-layout="vertical"][vertical-placement="right"][vertical-nav-type="collapsed"] .pcoded-item>li.pcoded-trigger>a>.pcoded-mtext {
  padding-right: 90px;
}



body .pcoded[vertical-nav-type="collapsed"] .header-navbar .navbar-wrapper .navbar-container {
  margin-left: 0;
}

body .pcoded[vertical-nav-type="collapsed"] .header-navbar .navbar-logo {
  width: 56px;
}

body .pcoded[vertical-nav-type="collapsed"] .header-navbar .navbar-logo a img {
  display: none;
}

body .pcoded[vertical-nav-type="compact"] .main-menu {
  width: 200px;
}

body .pcoded[vertical-nav-type="compact"] .main-menu .pcoded-item>li>.pcoded-submenu {
  -webkit-box-shadow: 0 0 16px -6px rgba(0, 0, 0, 0.57);
  box-shadow: 0 0 16px -6px rgba(0, 0, 0, 0.57);
}

body .pcoded[vertical-nav-type="compact"] .main-menu .pcoded-search {
  padding: 40px 20px 20px;
}

body .pcoded[vertical-nav-type="compact"] .main-menu .pcoded-badge {
  display: none;
}

body .pcoded[vertical-nav-type="compact"] .main-menu .mCSB_container {
  width: 100% !important;
}

body .pcoded[vertical-nav-type="compact"] .main-menu .mCSB_container_wrapper {
  overflow: visible !important;
}

body.menu-bottom .navbar-wrapper {
  z-index: 1050;
}

body.menu-bottom .pcoded .pcoded-main-container {
  margin-top: 0 !important;
}

body.menu-bottom .p-chat-user,
body.menu-bottom .showChat_inner {
  top: 0;
}

body.menu-bottom .navbar-wrapper {
  bottom: 0;
  top: auto;
  z-index: 1050;
}

@media only screen and (max-width: 992px) {
  body.menu-bottom .navbar-wrapper .pcoded-navbar {
    top: -56px;
  }
}

body.menu-bottom .header-navbar {
  min-height: auto;
  position: fixed !important;
  bottom: 0;
  z-index: 9999 !important;
  -webkit-box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.08) !important;
}

body.menu-bottom .mega-menu-top .show-notification,
body.menu-bottom .mega-menu-top .header-navbar .navbar-wrapper .navbar-container .header-notification .profile-notification,
.header-navbar .navbar-wrapper .navbar-container .header-notification body.menu-bottom .mega-menu-top .profile-notification {
  bottom: 0 !important;
}

body.menu-bottom .header-notification .show-notification,
body.menu-bottom .header-navbar .navbar-wrapper .navbar-container .header-notification .profile-notification,
.header-navbar .navbar-wrapper .navbar-container body.menu-bottom .header-notification .profile-notification {
  bottom: 65px;
}

body.menu-bottom #collapse-menu {
  display: none;
}

.mCSB_container,
.mCustomScrollBox {
  overflow: visible !important;
}

.pcoded[theme-layout="vertical"][vertical-nav-type="collapsed"] .mCSB_container_wrapper {
  overflow: visible !important;
}

.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: rgba(59, 70, 80, 0.5) !important;
}

.mCSB_inside>.mCSB_container {
  margin-right: 0 !important;
}

.fixed-button {
  position: fixed;
  bottom: -50px;
  right: 30px;
  -webkit-box-shadow: 0 15px 50px rgba(0, 0, 0, 0.35);
  box-shadow: 0 15px 50px rgba(0, 0, 0, 0.35);
  opacity: 0;
  z-index: 9;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.fixed-button.active {
  bottom: 50px;
  opacity: 1;
}




@media only screen and (min-width: 1367px) and (max-width: 1700px) {}

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

@media only screen and (min-width: 1279px) and (max-width: 1500px) {}

@media only screen and (min-width: 1200px) and (max-width: 1258px) {}

@media only screen and (min-width: 1200px) and (max-width: 1366px) {}

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

@media only screen and (max-width: 992px) {

  .navbar,
  .navbar .navbar-logo {
    width: 100% !important;
  }



  #footer-search tfoot .form-control,
  #footer-select tfoot .form-control,
  #form-input-table .form-control,
  .search-api .form-control,
  #dt-live-dom .form-control {
    width: 80%;
  }

  .pcoded-main-container {
    margin-top: 56px !important;
  }

  .card-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 5px;
  }

  .header-navbar {
    position: fixed !important;
    z-index: 1209;
  }

  .header-navbar[pcoded-header-position="relative"] {
    position: fixed !important;
    top: 0;
  }

  .header-navbar .navbar-wrapper .navbar-container {
    margin-left: 0;
  }

  .header-navbar .navbar-wrapper .navbar-logo {
    width: 100% !important;
  }

  .header-navbar .navbar-wrapper .navbar-logo a img {
    display: block !important;
  }

  .header-navbar .navbar-wrapper .navbar-logo .mobile-menu {
    display: block;
    position: absolute;
    left: 20px;
    top: 15px;
    right: auto;
  }

  .header-navbar .navbar-wrapper .navbar-logo .mobile-search {
    display: block;
    position: absolute;
    left: 70px;
    top: 0px;
  }

  .header-navbar .navbar-wrapper .navbar-logo .mobile-options {
    display: block;
    position: absolute;
    right: 30px;
  }

  .header-navbar .navbar-container .nav-left,
  .header-navbar .navbar-wrapper .navbar-container .nav-right {
    display: none;
  }


}

@media only screen and (min-width: 992px) {}

@media only screen and (max-width: 991px) {
  .main-body .page-wrapper .align-items-end .page-header-title {
    text-align: center;
    display: block;
  }

  .main-body .page-wrapper .align-items-end .page-header-title i {
    float: none;
    margin-bottom: 10px;
    margin-right: 0;
  }

  .main-body .page-wrapper .align-items-end body .pcoded[vertical-placement="right"] .main-body {
    direction: ltr;
  }

  .main-body .page-wrapper .align-items-end .page-header-breadcrumb {
    width: 100%;
    text-align: center;
    margin-top: 10px;
    display: block;
  }

  .page-header-breadcrumb .breadcrumb-item {
    display: inline-block;
    float: none;
  }


}

@media only screen and (min-width: 801px) and (max-width: 915px) {}

@media only screen and (min-width: 768px) {}

@media only screen and (min-width: 768px) and (max-width: 872px) {}

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

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

@media only screen and (max-width: 640px) {
  .dt-button {
    margin-bottom: 5px;
  }


}

@media only screen and (max-width: 991px) {
  .main-body .page-wrapper .align-items-end .page-header-title {
    text-align: center;
    display: block;
  }

  .main-body .page-wrapper .align-items-end .page-header-title i {
    float: none;
    margin-bottom: 10px;
  }

  .main-body .page-wrapper .align-items-end body .pcoded[vertical-placement="right"] .main-body {
    direction: ltr;
  }

  .main-body .page-wrapper .align-items-end .page-header-breadcrumb {
    width: 100%;
    text-align: center;
    margin-top: 10px;
    display: block;
  }

  .page-header-breadcrumb .breadcrumb-item {
    display: inline-block;
    float: none;
  }

  .messages-content {
    border-right: none;
  }
}

@media only screen and (max-width: 993px) {

  .navbar,
  .navbar .navbar-logo {
    width: 100% !important;
  }

  .error-500,
  .error-503,
  .error-404,
  .error-400,
  .error-403,
  .login {
    display: block !important;
    position: relative !important;
  }

  .header .login-card {
    margin-top: 80px;
    margin-bottom: 60px;
  }
}

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

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

@media only screen and (max-width: 480px) {
  .j-pro .j-checkbox-toggle {
    padding-bottom: 30px;
  }

  .main-body .page-wrapper {
    padding: 10px;
  }


}

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

@media only screen and (min-width: 576px) and (max-width: 1366px) {}

@media only screen and (max-width: 576px) {

  .header-navbar .navbar-wrapper .navbar-container .header-notification .show-notification,
  .header-navbar .navbar-wrapper .navbar-container .header-notification .profile-notification {
    min-width: 280px;
    left: 0;
    right: auto;
    width: auto;
  }

  .header-navbar .navbar-wrapper .navbar-container .header-notification .profile-notification {
    left: auto;
    right: 0;
  }

}














/************
 preloader 
***********/

div#preloader {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99999;
  width: 100%;
  height: 100%;
  overflow: visible;
  background: rgba(0, 0, 0, 0.8) url(../images/preload.svg) no-repeat center center;
}




div#preloading {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 4;
  width: 100%;
  height: 100%;
  overflow: visible;
  border-radius: 8px;
  background: rgba(20, 21, 20, 0.8) url(../images/loading.svg) no-repeat center center;
}

div#preloadInLine {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 4;
  width: 100%;
  height: 100%;
  overflow: visible;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.8) url(../images/loading.svg) no-repeat center center;
  background-size: 80px 80px;
  /* 👈 ajustá el tamaño que quieras */
}

div#preloadInLineTransp,
div.preloadInLineTransp {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 4;
  width: 100%;
  height: 100%;
  overflow: visible;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.205) url(../images/loading.svg) no-repeat center center;
  background-size: 80px 80px;
  /* 👈 ajustá el tamaño que quieras */
}

/********svg icons*/
.svg-icon.svg-icon-gray svg g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
  fill: var(--bs-gray-600) !important;
}

.svg-icon.svg-icon-primary svg g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
  fill: #206f28 !important;
}

.svg-icon.svg-icon-primary svg:hover g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
}

.svg-icon.svg-logo-primary svg path {
  fill: #206f28 !important;
}

.svg-icon.svg-icon-success svg g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
  fill: var(--bs-success) !important;
}

.svg-icon.svg-icon-warning svg g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
  fill: var(--bs-warning) !important;
}


.svg-icon.svg-icon-info svg g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
  fill: #3d5af1 !important;
}

.svg-icon.svg-icon-danger svg g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
  fill: #dc3545 !important;
}

.svg-icon.svg-icon-grey svg g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
  fill: #bbc0c3 !important;
}

.svg-icon.svg-icon-white svg g [fill] {
  -webkit-transition: fill 0.3s ease;
  transition: fill 0.3s ease;
  fill: #ffffff !important;
}



.svg-icon.svg-icon-sm svg {
  height: 1.25rem !important;
  width: 1.25rem !important;
}

.svg-icon.svg-icon-md svg {
  height: 1.5rem !important;
  width: 1.5rem !important;
}

.svg-icon.svg-icon-lg svg {
  height: 1.75rem !important;
  width: 1.75rem !important;
}

.svg-icon.svg-icon-xl svg {
  height: 2rem !important;
  width: 2rem !important;
}

.svg-icon.svg-icon-xxl svg {
  height: 2.25rem !important;
  width: 2.25rem !important;
}

.svg-icon.svg-icon-1x svg {
  height: 1rem !important;
  width: 1rem !important;
}

.svg-icon.svg-icon-2x svg {
  height: 2rem !important;
  width: 2rem !important;
}

.svg-icon.svg-icon-3x svg {
  height: 3rem !important;
  width: 3rem !important;
}

.svg-icon.svg-icon-4x svg {
  height: 4rem !important;
  width: 4rem !important;
}

.svg-icon.svg-icon-5x svg {
  height: 5rem !important;
  width: 5rem !important;
}

.svg-icon.svg-icon-6x svg {
  height: 6rem !important;
  width: 6rem !important;
}

.svg-icon.svg-icon-7x svg {
  height: 7rem !important;
  width: 7rem !important;
}

.svg-icon.svg-icon-8x svg {
  height: 8rem !important;
  width: 8rem !important;
}

.svg-icon.svg-icon-9x svg {
  height: 9rem !important;
  width: 9rem !important;
}

.svg-icon.svg-icon-10x svg {
  height: 10rem !important;
  width: 10rem !important;
}




/************ skeleton*/


#u_0_v {
  width: 500px;
  margin: 0 auto;
}

.lightui2 {
  padding: 20px;
  background: #fff;
}


.lightui2-shimmer div {
  background: #fff;
  height: 6px;
  left: 0;
  position: absolute;
  right: 0
}

.lightui2-shimmer {
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name: placeHolderShimmer;
  -webkit-animation-timing-function: linear;
  background: #99a1ac;
  background-image: linear-gradient(to right, #99a1ac 0%, rgb(177, 185, 194) 20%, rgb(167, 181, 195) 60%, #c1ccdb 80%, #d4dbe4 100%);
  background-repeat: no-repeat;
  background-size: 100% 104px;
  height: 40px;
  position: relative
}

.lightui1 {
  padding: 20px;
  background: #fff;
}

.lightui1-shimmer {
  -webkit-animation-duration: 1s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-name: placeHolderShimmer;
  -webkit-animation-timing-function: linear;
  background: #99a1ac;
  background-image: linear-gradient(to right, #99a1ac 0%, rgb(177, 185, 194) 20%, rgb(167, 181, 195) 60%, #c1ccdb 80%, #d4dbe4 100%);
  background-repeat: no-repeat;
  background-size: 100% 104px;
  height: 104px;
  position: relative
}

.lightui1-shimmer div {
  background: #fff;
  height: 6px;
  left: 0;
  position: absolute;
  right: 0
}




div._2iwr {
  height: 40px;
  left: 40px;
  right: auto;
  top: 0;
  width: 8px;
}

div._2iws {
  height: 8px;
  left: 48px;
  top: 0
}

div._2iwt {
  left: 39%;
  top: 8px
}

div._2iwu {
  height: 12px;
  left: 48px;
  top: 14px
}

div._2iwv {
  left: 73%;
  top: 26px
}

div._2iww {
  height: 10px;
  left: 48px;
  top: 32px
}

div._2iwx {
  height: 20px;
  top: 40px
}

div._2iwy {
  left: 40%;
  top: 60px
}

div._2iwz {
  height: 13px;
  top: 66px
}

div._2iw- {
  left: 100%;
  top: 79px
}

div._2iw_ {
  height: 13px;
  top: 85px
}

div._2ix0 {
  left: 63%;
  top: 98px
}

@-webkit-keyframes placeHolderShimmer {
  0% {
    background-position: -468px 0
  }

  100% {
    background-position: 468px 0
  }
}

@-webkit-keyframes prideShimmer {
  from {
    background-position: top left
  }

  to {
    background-position: top right
  }
}



/***************
progress bar
******************/

.progress-bar.grey {
  background-color: #838383 !important;
}

.progress-bar.blue {
  background-color: #188ae2 !important;
}

.progress-bar.green {
  background-color: #2ed8b6 !important;
}

.progress-bar.red {
  background-color: #dd4a3e !important;
}

.progress-bar.orange {
  background-color: #f1bc0e !important;
}

.progress.progress-jps {
  width: 100%;
  height: 4px;
  border-radius: 30px;
  overflow: hidden;
  background: #b9bcc3;
  margin-top: 5px;
}

.progress.progress-jps.progress-small {
  height: 2px;
}

.progress-bar.progress-bar-jps {
  height: 4px;
  border-radius: 30px;
}

.progress-bar.progress-bar-jps.progress-bar-small {
  height: 2px;
}

.progress-details .title {
  margin-bottom: 0;
}

.progress-details .title span {
  font-size: 16px;
  color: #212121;
  display: block;
}

.progress-details .title strong {
  font-size: 14px;
  color: #9b9b9b;
  margin-bottom: 5px;
}

.progress-details .number {
  color: #7c7c7c;
  font-size: 2.0rem;
}


/*form control*/


.form-control-warning {
  border-color: #f1c40f;
  color: #f1c40f;
}

.form-control-warning:focus {
  border-color: #f1c40f;
}

.input-group-warning .input-group-addon {
  background-color: #f1c40f;
}

.input-group-warning .form-control {
  border-color: #f1c40f;
}

.form-control-default {
  border-color: #e0e0e0;
  color: #e0e0e0;
}

.form-control-default:focus {
  border-color: #e0e0e0;
}

.input-group-default .input-group-addon {
  background-color: #e0e0e0;
}

.input-group-default .form-control {
  border-color: #e0e0e0;
}

.form-control-danger {
  border-color: #FF5370;
  color: #FF5370;
}

.form-control-danger:focus {
  border-color: #FF5370;
}

.input-group-danger .input-group-addon {
  background-color: #FF5370;
}

.input-group-danger .form-control {
  border-color: #FF5370;
}

.form-control-success {
  border-color: #2ed8b6;
  color: #2ed8b6;
}

.form-control-success:focus {
  border-color: #2ed8b6;
}

.input-group-success .input-group-addon {
  background-color: #2ed8b6;
}

.input-group-success .form-control {
  border-color: #2ed8b6;
}






/* =======================================
    Login
 ========================================= */
.common-img-bg {
  background-size: cover;
  background-image: url(../images/bg-login.jpg);
}



.login-card.auth-body {
  width: 100%;
}

@media (min-width: 1024px) {
  .login-card.auth-body {
    width: 450px;
  }
}





.login-card {
  border-radius: 30px;
  position: relative;
  display: block;
}

.login-card h1 {
  font-size: 25px;
  font-weight: 400;
  margin-bottom: 20px;
  text-align: center;
}

.login {
  text-align: left;
}

.login ul li label {
  color: #757575;
  font-weight: 600;
  letter-spacing: 1px;
}

.login h3 {
  color: #666666;
  font-size: 24px;
  font-weight: 600;
  margin-top: 20px;
}



.login-card .card-footer {
  background: #fff;
}




.login-card h3 {
  color: #666666;
  font-size: 24px;
  font-weight: 600;
  margin-top: 20px;
}






.auth-box {
  background-color: #fff;
  border-radius: 8px;
  margin: 20px 0 0 0;
  padding: 20px;
  -webkit-box-shadow: 0 2px 18px -2px black;
  box-shadow: 0 2px 18px -2px black;
}



/***********
bordes
*******************/
.bo-0 {
  border: 0px !important;
}

.bot-0 {
  border-top: 0px;
}

.bob-0 {
  border-bottom: 0px;
}

.bob-1 {
  border-bottom: 1px solid rgba(133, 138, 148, 0.4);
}

.bot-1 {
  border-top: 1px solid rgba(48, 52, 60, 0.75);
}

.bo-1 {
  border: 1px solid rgba(74, 79, 90, 0.75);
}

.bol-1 {
  border-right: 1px solid rgba(74, 79, 90, 0.75);
}

.bor-1 {
  border-right: 1px solid #757575;
}

.bo-2 {
  border: 1px solid #FF5370;
}

.bo-3 {
  border: 1px solid #3a3a3a;
}

/***************
imagenes avatar
****************/

.circle-xlg {
  width: 160px;
  height: 160px;
  line-height: 75px;
  text-align: center;
  border-radius: 50%;
  display: inline-block;
}

.circle-md {
  width: 60px;
  height: 60px;
  line-height: 40px;
  text-align: center;
  border-radius: 50%;
  display: inline-block;
}

.circle-sm {
  width: 40px;
  height: 40px;

  text-align: center;
  border-radius: 50%;
  display: inline-block;
}

.img-circle {
  border-radius: 50%;
}

.user-avatar {
  width: 45px;
  height: 45px;
  object-fit: cover;

}

.user-avatar-mi-perfil img {
  width: 160px;
  height: 160px;
  object-fit: cover;

}








.wrapper-image-profile {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  object-fit: cover;

  position: relative;

}


.wrapper-image-profile img {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  object-fit: cover;

  border: 1px solid #a2abb9
}



.overlay-image {

  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  transition: background 0.5s ease;
  border-radius: 50%;

}

.wrapper-image-profile:hover .overlay-image {
  display: block;
  background: rgba(0, 0, 0, .5);
  border-radius: 50%;
}






.symbol-badge.online {
  width: 20px;
  height: 20px;
  top: -10px;
  right: -10px;
  position: absolute;
  font-size: 20px;
}

/*boton input type file*/
.button-image-profile {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  opacity: 0;
  transition: opacity .35s ease;
  display: flex;
  border-radius: 50%;
}

.button-image-profile a {}


.wrapper-image-profile:hover .button-image-profile {
  opacity: 1;
  border-radius: 50%;
}


.wrapper-image-profile .inputfile {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

.wrapper-image-profile .inputfile+label {
  max-width: 65%;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  padding: 0.625rem 1.25rem;
  display: flex;
  justify-content: center;
  justify-items: center;
  align-items: center;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  font-size: 1rem;

}



.wrapper-image-profile .inputfile:focus+label,
.wrapper-image-profile .inputfile.has-focus+label {
  outline: 1px dotted #000;
  outline: -webkit-focus-ring-color auto 5px;
}


/*md*/

.wrapper-image-profile-md {
  width: 100px;
  height: 100px;

  object-fit: cover;
  border-radius: 3px;
  position: relative;

}


.wrapper-image-profile-md img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 3px;
  border: 1px solid #a2abb9
}




.wrapper-image-profile-md:hover .overlay-image {
  display: block;
  background: rgba(0, 0, 0, .5);
}






/*boton input type file*/
.button-image-profile {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  opacity: 0;
  transition: opacity .35s ease;
  display: flex;
}


.wrapper-image-profile-md:hover .button-image-profile {
  opacity: 1;
}


.wrapper-image-profile-md .inputfile {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

.wrapper-image-profile-md .inputfile+label {
  max-width: 65%;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  padding: 0.625rem 1.25rem;
  display: flex;
  justify-content: center;
  justify-items: center;
  align-items: center;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  font-size: 0.8rem;

}



.wrapper-image-profile-md .inputfile:focus+label,
.wrapper-image-profilee-md .inputfile.has-focus+label {
  outline: 1px dotted #000;
  outline: -webkit-focus-ring-color auto 5px;
}

/***************
listados
****************/


a.item-list {
  padding: 10px;
  text-decoration: none;
  display: inline-block;
  width: 100%;
  color: #000
}

a.item-list:hover {
  background: #dbdbdb;
  color: #212121
}

.item-list {
  padding: 10px;
}

.listado-container {
  position: relative;
}

/*listado laboratiroio*/
.footer-fila-lab {
  border-top: 1px dashed #000;
  border-bottom: 1px solid #000;
  padding: 6px 0;
  margin-bottom: 20px
}

/******************
altos y anchos
*****************/

.h-150 {
  height: 150px;
  overflow: hidden;
}

.h-200 {
  height: 200px;
  overflow: hidden;
}

.h-250 {
  height: 250px;
  overflow: hidden;
}

.h-300 {
  height: 300px;
  overflow: hidden;
}

.h-100vh {
  height: 100vh;
  overflow: hidden;
}

.h-350 {
  height: 350px;
  overflow: hidden;
}

.mh-615 {
  min-height: 615px;
}

.mh-730 {
  min-height: 730px;
}

.mh-230 {
  min-height: 230px;
}

.mh-985 {
  min-height: 985px;
}

.w-250 {
  width: 250px;
}


@media (min-width: 320px) {
  .w-250 {
    width: 100%;
  }

}

@media (min-width: 768px) {
  .w-250 {
    width: 250px;
  }

}

.w-200 {
  width: 250px;
}


@media (min-width: 320px) {
  .w-200 {
    width: 100%;
  }

}

@media (min-width: 768px) {
  .w-200 {
    width: 200px;
  }

}


.ddlBusquedaAvanzada {
  min-width: 460px;
}

/***************
perfectscrollbar
******************/

.ps-scrollbar-y-rail {
  right: 0px !important;
}


/************************
empty states
**********************/
.empty {

  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.empty-height {
  height: 85vh;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.empty-height-400 {
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.empty-height-350 {
  height: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.empty-height-100 {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}




/*iconos tamaños*/
.icon-x60 {
  height: 60px;
  width: 60px;
  line-height: 60px;
  text-align: center;
  border-radius: 50%;
}

.icon-x50 {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 50%;
}


.icon-x40 {
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 50%;
}

.icon-x30 {
  height: 30px;
  width: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 50%;
}




/*fondos*/

/* .bg-01 {
  background-color: #97589e;
} */
.bg-01 {
  background-color: #00B7F1;
}

.bg-02 {
  background-color: #699c61;
}

.bg-03 {
  background-color: #6f6f6e;
}

.bg-04 {
  background-color: #dadad9;
}

.bg-05 {
  background-color: #c2c2c2;
}

.bg-06 {
  background-color: #e8e8e8;
}

.bg-transp {
  background-color: transparent !important;
}

.bg-07 {
  background-color: #dcecd9;
}

.bg-08 {
  background-color: #f6f8fc;
}


/*formularios*/
.input-group .input-group-text {
  background-color: transparent;

  padding-top: 0;
  padding-bottom: 0;
}


.form-label {
  color: #848484
}


textarea {
  resize: none;
}


/* checkbox naranja estilo alert-warning */
.form-check-input.warning:checked {
  background-color: var(--bs-warning) !important;
  /* amarillo/naranja de Bootstrap warning */
  border-color: var(--bs-warning) !important;
}

.form-check-input.warning:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, .25);
}



.form-check-input:checked {
  background-color: #206f28 !important;
  border-color: #206f28 !important;
}


.checkbox-md .form-check-input {
  width: 1.20rem;
  height: 1.20rem;
}



.checkbox-md .form-check-label {
  margin-left: 10px;
  margin-top: 3px;
}

.checkbox-lg .form-check-input {
  width: 1.55rem;
  height: 1.55rem;
}


.checkbox-lg .form-check-label {
  margin-left: 10px;
  margin-top: 5px;

}


/* ✅ Success */
.form-check-input.check-success {
  border-color: #46db96 !important;
}

.form-check-input.check-success:checked {
  background-color: #46db96 !important;
  border-color: #46db96 !important;


}



.accordion-button:not(.collapsed) {
  color: #0c63e4;
  background-color: #fff;
  box-shadow: none;
}

.accordion-button:focus {
  z-index: 3;
  border-color: #86b7fe;
  outline: 0;
  box-shadow: none;
}

/* ❌ Danger */
.form-check-input.check-danger {
  border-color: #fc6881 !important;
}

.form-check-input.check-danger:checked {
  background-color: #fc6881 !important;
  border-color: #fc6881 !important;
}

/* ℹ️ Info */
.form-check-input.check-info {
  border-color: #6395ff !important;
}

.form-check-input.check-info:checked {
  background-color: #6395ff !important;
  border-color: #6395ff !important;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: #206f28;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(81, 172, 116, 0.6);
}


select option:disabled {
  color: #ccc;
}

/* ===== TIMELINE HORIZONTAL ===== */

/* ===== TIMELINE HORIZONTAL ===== */

.timeline {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  margin: 30px auto;
  padding: 0;
  max-width: 1000px;
}

/* Línea gris base */
.timeline::before {
  content: '';
  position: absolute;
  top: 6px;
  left: 0;
  right: 0;
  height: 2px;
  background: #999;
  z-index: 1;
}

/* Línea verde dinámica */
.timeline::after {
  content: '';
  position: absolute;
  top: 6px;
  left: 0;
  height: 2px;
  background: #206f28;
  z-index: 1;
  width: var(--line-width, 0);
  /* controlado por JS */
  transition: width 0.3s ease;
}

/* Cada ítem del timeline */
.timeline-item {
  position: relative;
  text-align: center;
  z-index: 2;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Alinear los extremos correctamente */
.timeline-item:first-child {
  align-items: flex-start;
  text-align: left;
}

.timeline-item:last-child {
  align-items: flex-end;
  text-align: right;
}

/* Punto del timeline */
.timeline-point {
  width: 12px;
  height: 12px;
  background: white;
  border-radius: 50%;
  border: 1px solid #206f28;
  cursor: pointer;
  transition: transform 0.2s ease, background 0.2s ease;
  position: relative;
  z-index: 3;
}

/* Punto activo (relleno) */
.timeline-point.active {
  background: #206f28;
}

/* Etiquetas */
.timeline-label {
  margin-top: 15px;
  font-size: 12px;
  font-weight: 600;
  max-width: 120px;
  line-height: 1.2;
}

* Ocultar apariencia circular cuando es triángulo */ .timeline-point.triangulo {
  background: transparent;
  border: none;
}

/* Triángulo dibujado con ::after y centrado exactamente */
.timeline-point.triangulo::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 20%;
  transform: translate(-50%, -50%);
  /* centra el triángulo respecto al contenedor */
  width: 0;
  height: 0;
  border-left: 11px solid transparent;
  /* mitad de ancho del triángulo */
  border-right: 11px solid transparent;
  border-bottom: 18px solid #ffc107;
  /* altura y color del triángulo */
  z-index: 4;
  /* opcional: añadir ligera sombra para separación visual */
  /* filter: drop-shadow(0 0 0 rgba(0,0,0,0.05)); */
}

/* ===== VERSIÓN RESPONSIVE (VERTICAL) ===== */
@media (max-width: 768px) {
  .timeline {
    flex-direction: column;
    align-items: center;
  }

  .timeline::before,
  .timeline::after {
    width: 3px;
    height: 100%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
  }

  .timeline-item {
    align-items: center;
    text-align: center;
  }

  .timeline-label {
    margin-top: 10px;
  }
}







/*vertical*/
.rb-container {
  margin: auto;
  display: block;
  position: relative;
  list-style: none;
  margin: auto;
  border-left: 3px solid #7c7c7c;
  min-height: 250px;
  position: relative;
}

.rb-container ul.rb {
  width: 100%;
  padding: 0;
  display: inline-block;
}

.rb-container ul.rb li.rb-item {
  /* list-style: none;
  margin: auto;
  min-height: 350px;
  border-left: 3px solid #7c7c7c;
 
 */
  position: relative;
  padding: 0 0 0px 20px;
}

.rb-container ul.rb li.rb-item.last {
  /* list-style: none;
   margin: auto;
   min-height: 350px;
   border-left: 3px solid #7c7c7c;
  
  */
  bottom: -65px;
  position: absolute;
  padding: 0 0 0px 20px;
}



.rb-container ul.rb li.rb-item:last-child {
  border-left: 0;
}

.rb-container ul.rb li.rb-item::before {
  position: absolute;
  left: -10px;
  top: -1px;
  content: " ";
  background: #c4cad0;
  border: 1px solid #59e0c5;
  border-radius: 50%;
  height: 18px;
  width: 18px;
  transition: all 500ms ease-in-out;
}

.rb-container ul.rb li.rb-item.active::before {
  background: #59e0c5
}

.rb-container ul.rb li.rb-item:hover::before {
  border-color: #232931;
  transition: all 1000ms ease-in-out;
}

ul.rb li .item-title {
  color: #000;
  position: relative;
  font-size: 15px;

}


.item-user,
.item-date {
  font-size: 13px;
  color: #919aa3;
}


.rb-container ul.rb li.horizontal-rb-item {
  list-style: none;
  margin: 10px 0 25px;
  padding: 20px 0 30px 15px;
  position: relative;
}

.progreso-timeline .datos {
  position: relative;
  z-index: 2;

}

.progreso-timeline .datos .inicioLab {
  position: relative;
  width: 50%;
  float: left
}


.progreso-timeline .datos .finLab {
  float: right;
  position: relative;

}

/* 
.progreso-timeline .datos .inicioLab .legend::before {
  position: absolute;
  left: 0px;
  top: -12px;
  content: " ";
  background: #c4cad0;
  border: 3px solid rgba(255, 255, 255, 1);
  border-radius: 50%;
  height: 20px;
  width: 20px;
  transition: all 500ms ease-in-out; 
}*/

.progreso-timeline .datos .inicioLab .legend.active::before {

  background: #59e0c5
}

/* 
.progreso-timeline .datos .finLab .legend::after {
 position: absolute;
  right: 0px;
  top: -12px;
  content: " ";
  background: #c4cad0;
  border: 3px solid rgba(255, 255, 255, 1);
  border-radius: 50%;
  height: 20px;
  width: 20px;
  transition: all 500ms ease-in-out; 
}*/

.progreso-timeline .datos .finLab .legend.active::after {

  background: #59e0c5
}


.horizontal-rb-item::after {
  position: absolute;
  left: -9px;
  top: 22px;
  content: " ";
  background: #c4cad0;
  border-radius: 50%;
  height: 15px;
  width: 15px;
  transition: all 500ms ease-in-out;
}

.horizontal-rb-item.active::after {
  background: #59e0c5;
}





/**************
file upload
*****************/

.inputfile {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

.inputfile+label {
  width: 100%;
  font-size: 1.25rem;
  /* 20px */
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  /* padding: 0.625rem 1.25rem; */
  /* 10px 20px */
  position: relative;
  border: 1px solid #000;
}

.inputfile:focus+label,
.inputfile.has-focus+label {
  outline: 1px dotted #000;
  outline: -webkit-focus-ring-color auto 5px;
}

/*
.inputfile+label * {
  pointer-events: none; 

}
*/
.inputfile-green+label {
  color: #d9dcdf;
}

.box.is-invalid .inputfile-green {
  border: 1px solid #23272b;
  /* background-color: #f1e5e6;*/
  padding: 0;
  border-radius: .25rem;
  height: 40px;
  margin: 0px;
}


.is-invalid .inputfile-green+label {
  border: 1px solid #FF5370;
  background-color: #f1e5e6;
  padding: 0;
  border-radius: .25rem;
  height: 40px;
  margin: 0px;
}

.inputfile-green:focus+label,
.inputfile-green.has-focus+label,
.inputfile-green+label:hover {
  border-color: #206f28;
}

.inputfile-green+label span,
.inputfile-green+label strong {
  padding: 0.625rem 1.25rem;
  /* 10px 20px */
}

.inputfile-green+label span {
  width: 250px;
  min-height: 40px;
  display: inline-block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  vertical-align: top;
  font-size: 13px;
  color: #206f28;
}

.inputfile-green+label strong {
  height: 100%;
  color: #f2f2f2;
  background-color: #23272b;
  display: inline-block;
  font-size: 13px;
  position: absolute;
  right: 0px;
  top: 0px;
}

.inputfile-green:focus+label strong,
.inputfile-green.has-focus+label strong,
.inputfile-green+label:hover strong {
  background-color: #9ab096;
  color: #e4e9ee;
}

@media screen and (max-width: 50em) {
  .inputfile-green+label strong {
    display: block;
  }
}



/***********
buscador por texto
**************/
.lupa {
  position: absolute;
  font-size: 19px;
  color: #8a939c;
  right: 10px;
  top: 15px;
}


.ddl-options {
  min-width: 250px;
}


.bootstrap-datetimepicker-widget.dropdown-menu {
  display: block;
}


a.dropdown-toggle::after {

  border: none !important;

}



/*tags*/

.wrap-tags {
  margin-right: -3px;
  margin-left: -3px;
}

.tag-item {

  font-size: 13px;
  color: #3e3e3e;
  line-height: 1.5;
  padding: 5px 15px;
  border: 1px solid #3e3e3e;
  border-radius: 15px;
  margin: 3px;
}


/*******
opacidades
*************/


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

.opacity-2 {
  opacity: .2 !important;
}

.opacity-3 {
  opacity: .3 !important;
}

.opacity-4 {
  opacity: .4 !important;
}

.opacity-5 {
  opacity: .5 !important;
}

.opacity-6 {
  opacity: .6 !important;
}

.opacity-7 {
  opacity: .7 !important;
}

.opacity-8 {
  opacity: .8 !important;
}

.opacity-8 {
  opacity: .9 !important;
}

.opacity-10 {
  opacity: 1 !important;
}

.overflow-visible {
  overflow: visible !important;
}



/*header pages details*/


.mask {
  position: absolute;
  top: 0;
  left: 0;

  width: 100%;
  height: 100%;

  transition: all .15s ease;
}

@media (prefers-reduced-motion: reduce) {
  .mask {
    transition: none;
  }
}


.z-i {
  z-index: 2;
}

.header-page-detail {
  position: relative;
}






.form-check-input.disabled {
  pointer-events: none;
  filter: none;
  opacity: .5;
}


input[type="radio"],
input[type="checkbox"],
.form-check-label {
  cursor: pointer;
}





.page_error {
  background: #FFF;
}



.text-oh-error {

  background: url(../images/error-img.gif) no-repeat center;
  height: 400px;


}




.form-select.invalid,
.form-control.invalid,
.form-check-input.invalid {
  border: 1px solid #e5493e;
}


.validation-message {
  color: #e5493e;
  font-size: 12px;
}

.btn-search-filter {
  color: #206f28 !important;
  padding: 10px;
  position: absolute;
  font-size: 23px;
  right: 5px;
  top: 0px;
}

.btn-search-filter:hover {
  color: #b1ceab !important;
}







.ellipsis-w200 {
  overflow: hidden;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  /*-webkit-line-clamp: 2;*/
  -webkit-box-orient: vertical;
  width: 150px;

}






/*********************
Paginador
**************************/

.pagination .page-item.active .page-link {
  z-index: 3;
  color: #206f28 !important;
  background-color: transparent;
  border: 0px;
  font-weight: bold;
}

.pagination .page-link {
  position: relative;
  display: block;
  color: #000;
  text-decoration: none;
  background-color: transparent;
  border: 0px;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.pagination .page-link:hover {
  color: #206f28;

}

.page-item.disabled .page-link {
  color: #6c757d;
  pointer-events: none;
  background-color: transparent;
  border: 0px;
}


.logo-search img {
  width: 100px;
}










/*********************
RESPONSIVE
**************************/


@media all and (max-width:480px) {
  .btn-block-xs-only {
    display: block;
    width: 100%;
  }

  h4 {
    font-size: 1.005rem;
  }

  .f-20 {
    font-size: 18px;
  }

  .f-24 {
    font-size: 18px;
  }

  .f-18 {
    font-size: 16px !important;
  }


  .w-100-mobile {
    width: 100% !important;
  }

  .w-80-mobile {
    width: 75% !important;
  }

  .logo-search {
    display: none
  }
}



/*tabs*/


.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  color: #338e3c;
  background-color: #fff;
  border-color: #dee2e6 #dee2e6 #fff;
}

.nav-link {

  color: #232931;
}

.nav-link:focus,
.nav-link:hover {
  color: #51606d;
}




/***tree***/
.active-tree::before {
  font-family: 'FontAwesome';
  content: '\f061';
  color: #338e3c;
  font-size: 14px;
  margin-right: 5px
}






/*configuraciono login portal*/

.rect-log {
  z-index: 3;
  padding: 40px;
  background-color: rgba(106, 155, 97, 0.7);
  position: absolute;
  left: 15px;
  top: 35%;
  border-radius: 30px;
  width: 80%
}


.activo-publicado {
  border: 5px solid #6d9066;
  border-radius: 8px;
}

.activo-publicado .icon {
  position: absolute;
  color: #e94e1b;
  background: #fff;
  padding: 2px 5px;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3px;
  top: 15px;
  left: -18px;
  transform: rotate(-0.10turn);
}

.activo-publicado .icon::after {
  content: 'Publicado';
  color: #e94e1b;

  font-size: 10px;
  text-transform: uppercase;
  font-weight: bold;
  margin-left: 5px;

}


.img-thumbnail.activo-publicado {
  position: relative;
  padding: 0px
}



/**********
picker color
************/


input.pickercolor[type="color"] {
  width: 45px;
  height: 45px;
  padding: 0;
  position: relative;
  top: 0px;
  RIGHT: 0PX;
  background: transparent;
  box-shadow: 0px;
  outline: none;
  border: 0px;
  cursor: pointer;
}

input[type="color"] {
  width: 30px;
  height: 30px;
  padding: 0;
  position: absolute;
  right: 15px;
  top: 15px;
  background: transparent;
  box-shadow: 0px;
  border-radius: 50%;
  outline: none;
  border: 2px solid rgb(235, 235, 235);
  cursor: pointer;
}

.colorTop::-webkit-color-swatch-wrapper {
  padding: 0;
}

.colorTop::-webkit-color-swatch {
  border: none;
  border-radius: 100%;
}

.colorTop::-moz-color-swatch {
  border: none;
  border-radius: 100%;
}

.colorTop::-moz-color-swatch-wrapper {
  padding: 0px;
}


.favServicioMuestra {
  display: inline-block;
  margin-right: 5px;
  padding: 0 10px;
  text-decoration: none;
  margin-top: 0px !important;
  border-radius: 50%;
  white-space: nowrap;
  overflow: inherit;
  /*  background-color: var(--favServicioMuestra-fondo) !important;
  color: var(--favServicioMuestra-texto) !important;*/
  text-transform: uppercase;
  width: 100px;
  height: 100px;
  line-height: 100px;
  font-size: 50px;
  font-weight: bold;
}




.lupaSearch {
  top: 10px;
  font-size: 20px;
  right: 15px;
  color: #8c8c8c;
}





/*************
 Textos tamaños
 ************/
.text-8 {
  font-size: 8px !important;
}

.text-9 {
  font-size: 9px !important;
}

.text-10 {
  font-size: 10px !important;
}

.text-11 {
  font-size: 11px !important;
}

.text-12 {
  font-size: 12px !important;
  ;
}

.text-13 {
  font-size: 13px !important;
}

.text-14 {
  font-size: 14px !important;
}

.text-15 {
  font-size: 15px;
}

.text-16 {
  font-size: 16px !important;
}

.text-18 {
  font-size: 18px !important;
}

.text-20 {
  font-size: 20px !important;
}

.text-22 {
  font-size: 22px !important;
}

.text-24 {
  font-size: 24px !important;
}

.text-25 {
  font-size: 25px !important;
}

.text-30 {
  font-size: 30px !important;
}

.text-40 {
  font-size: 40px !important;
}

.text-45 {
  font-size: 45px !important;
}

.text-50 {
  font-size: 50px !important;
}

.text-60 {
  font-size: 60px !important;
}

.text-70 {
  font-size: 70px !important;
}

.text-80 {
  font-size: 80px !important;
}

.text-100 {
  font-size: 100px !important;
}
















/*************
MENU  NUEVOOOOOOOOOOOOOOOOOOOOOOOOO
 ************/

/*notificacion campana*/

.bullet-notification {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--bs-danger-active);
  position: absolute;
  right: 5px;
  top: 8px;
}

.btn-menu i {
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.btn-menu i:hover {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.menu-aside {
  background-color: var(--bs-menu-900);
}

.flex-row-fluid {
  flex: 1 auto;
  min-width: 0;
}

.text-brand-menu {
  color: var(--bs-text-brand-menu);

}

.subtext-brand-menu {
  color: var(--bs-text-primary);
  letter-spacing: 3px;

}

.bullet {
  display: inline-block;
  background-color: var(--bs-bullet-bg-color);
  border-radius: 6px;
  width: 8px;
  height: 4px;
  flex-shrink: 0
}

.bullet-dot {
  width: 4px;
  height: 4px;
  border-radius: 100% !important
}

.offcanvas.offcanvas-start {
  top: 0;
  left: 0;
  width: 320px;
}



/*************
HEADER
 ************/

.navApp {
  background: -webkit-gradient(linear, left top, right top, from(#206f28), to(#99c891));
  background: linear-gradient(to right, #206f28, #99c891);
  height: 60px;
}



.tituloDesktopHeader {
  width: 1395px;
}



@media only screen and (min-width: 980px) and (max-width:1600px) {
  .tituloDesktopHeader {
    width: 900px;
  }
}

@media only screen and (min-width: 360px) and (max-width: 768px) {
  .tituloDesktopHeader {
    width: 1395px;
  }
}




.btn-menu {
  color: #fff;
}


.btn-menu:hover,
.btn-menu:active,
.btn-menu:focus {
  color: #99c891;
  box-shadow: none;
}



/*----------------------sidebar-menu-------------------------*/


.offcanvas-body {
  padding: 0px;
  overflow: hidden;
  background-color: #fff;
}

.offcanvas-header {
  background-color: #fff;
}

.offcanvas-header .btn-close {
  color: #666;
}

.sidebar-menu {
  padding-bottom: 10px;


}

.sidebar-header {
  padding: 20px
}

/*boton cerrar menu*/
.btn-close-menu {
  background: transparent;
  border: 0px;
  box-shadow: none;
  font-size: 20px;
  color: #333;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.btn-close-menu:hover {
  text-decoration: none;
  outline: none;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.menu-content {
  padding: 10px 20px;
  font-size: 12px;
  font-weight: bold;
}

.menu-heading {
  color: #699a60;
}

.sidebar-menu ul li a {
  display: flex;
  align-items: center;

  text-decoration: none;
  position: relative;
  padding: 20px;
  color: #333;
  font-size: 14px;

  border-radius: .475rem;
  padding-top: .75rem;
  padding-bottom: .75rem;

}

.sidebar-menu ul li a .menu-bullet {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;

  margin-right: .5rem;
  background-color: #e2e2e8;

  display: inline-block;

  width: 4px;
  height: 4px;
  border-radius: 100% !important
}




.sidebar-menu ul li a:hover,
.sidebar-menu ul li a:active,
.sidebar-menu ul li a:focus {
  color: #222
}


.sidebar-menu ul li a i {
  margin-right: 10px;

  color: #699a60;
  font-size: 18px;
  text-align: center;

}

.sidebar-menu ul li a.active {
  transition: color .2s ease;
  background-color: #699a60;
  color: #fff;
  margin-left: 20px;
  margin-right: 20px;
  position: relative;


}




.sidebar-menu .sidebar-dropdown>a:after {
  font-family: 'themify';
  font-weight: 900;
  content: "\e64b";
  font-style: normal;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  background: 0 0;
  position: absolute;
  right: 15px;
  top: 15px;
  font-size: 13px;
}



.sidebar-menu .sidebar-dropdown .sidebar-submenu ul {
  padding: 5px 0;
}

.sidebar-menu .sidebar-dropdown .sidebar-submenu li {
  padding-left: 25px;
  font-size: 13px;
}




.sidebar-menu ul {

  padding-left: 0px;
}

.sidebar-menu ul li a span.label,
.sidebar-menu ul li a span.badge {
  float: right;
  margin-top: 8px;
  margin-left: 5px;
}

.sidebar-menu .sidebar-dropdown .sidebar-submenu li a .badge,
.sidebar-menu .sidebar-dropdown .sidebar-submenu li a .label {
  float: right;
  margin-top: 0px;
}

.sidebar-menu .sidebar-submenu {
  display: none;
}

.sidebar-menu .sidebar-dropdown.active>a:after {
  transform: rotate(90deg);
  right: 17px;
}


.sidebar-footer {
  position: absolute;
  width: 100%;
  bottom: 0;
  display: flex;
  background-color: #699a60;

}

.sidebar-footer>a {
  flex-grow: 1;
  text-align: center;

  line-height: 30px;
  position: relative;
  color: #fff;
  padding: 20px;
  display: block;
}



.btn-light {
  background-color: transparent;
  border-color: #699a60;
  color: #699a60;
  font-size: 20px;

}

.btn-light:hover,
.btn-light:focus,
.btn-light:active {
  background-color: #92c289;
  border-color: #699a60;
  color: #699a60;

  box-shadow: none !important;
}






.btn-outline-light {
  background-color: transparet;
  border-color: #333;
  color: #333;
  width: 35px;
  height: 35px;
  font-size: 18px;
  padding: 5px;


}


.btn-outline-light:hover,
.btn-outline-light:focus,
.btn-outline-light:active {
  background-color: #a1a1a1;
  border-color: #333;
  color: #333;

}







/*busqueda por qr*/
.search-container {
  display: flex;
  align-items: center;
  width: 100%;
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 8px 15px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1);
  background: #fff;
}

.search-container input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 16px;
  padding: 5px 10px;
  width: 100%;
}

.search-container .icon-btn {
  border: none;
  background: none;
  cursor: pointer;
  padding: 5px;
  margin-left: 8px;
  border-radius: 50%;
  transition: background 0.2s;
}

.search-container .icon-btn:hover {
  background: #f0f0f0;
}

.search-container i {
  font-size: 18px;
  color: #666;
}

.buttons {
  margin-top: 20px;
}

.buttons button {
  margin: 5px;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  background: #f8f9fa;
  cursor: pointer;
}

.buttons button:hover {
  border: 1px solid #dadce0;
}






/**************
    filepreview*******/

.file-card {
  position: relative;
  display: inline-block;
  width: 100%;
  border: 1px solid #ddd;
  border-radius: 4px;
  overflow: hidden;

  background: #fff;
}

.file-thumbnail {
  width: 100%;
  display: block;
}

/* etiqueta PDF con nombre */
.file-label {



  display: flex;
  align-items: center;
  padding: 4px 6px;
  max-width: 100%;

}

.file-label img {
  width: 20px;
  height: 20px;
  margin-right: 5px;
}

.file-label span {
  font-size: 12px;
  font-weight: bold;
  color: #444;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 150px;
}

/* acciones debajo */
.file-actions {
  padding: 6px;
  text-align: right;
  border-top: 1px solid #eee;
  background: #fafafa;
}







/*****************
tabs
*******************/


.nav-link {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  color: #666;
  padding: 2rem 2.5rem;
  border: 0px !important;
}

.nav-link:hover,
.nav-link:active,
.nav-link:focus {
  outline: none;
}

.nav-tabs {
  border-bottom: 0px;
}

.nav-link.active .number-tab {
  color: #ffffff;
  background-color: #206f28;
}

.nav-link.active .name-tab {
  color: #206f28
}

.nav-link .number-tab {
  font-size: 1.3rem;
  font-weight: 600;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 2.75rem;
  flex: 0 0 2.75rem;
  height: 2.75rem;
  width: 2.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: rgba(52, 69, 229, 0.08);
  color: #206f28;
  margin-right: 1rem;
  border-radius: 0.5rem;
}

.number-title {
  font-size: 1.3rem;
  font-weight: 600;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 2.75rem;
  flex: 0 0 2.75rem;
  height: 2.75rem;
  width: 2.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: #ffffff;
  background-color: #206f28;
  margin-right: 1rem;
  border-radius: 0.5rem;
}


.user-detail .nav-link {
  padding: 2rem 1rem !important
}



.separator {
  display: block;
  height: 0;
  border-bottom: 1px solid var(--bs-border-color);
}

.separator.separator-dashed {
  border-bottom-style: dashed;
  border-bottom-color: var(--bs-border-dashed-color);
}


.transition {
  transition: all .1s ease;
}