/* body */
body {
  background-color: #f2f5f8;
  font-family: "Montserrat", sans-serif;
}
span {
    color: #000;
}
li {
  width: 16%;
}
.main-content .wizard-form .progressbar-list::before {
  content: " ";
  background-color: rgb(155, 155, 155);
  border: 10px solid #fff;
  border-radius: 50%;
  display: block;
  width: 30px;
  height: 30px;
  margin: 9px auto;
  box-shadow: 1px 1px 3px #606060;
  transition: all;
}
.main-content .wizard-form .progressbar-list::after {
  content: "";
  background-color: rgb(155, 155, 155);
  padding: 0px 0px;
  position: absolute;
  top: 14px;
  left: -50%;
  width: 100%;
  height: 2px;
  margin: 9px auto;
  z-index: -1;
  transition: all 0.8s;
}
.main-content .wizard-form .progressbar-list.active::after {
  background-color: #4053B2;
}
.main-content .wizard-form .progressbar-list:first-child::after {
  content: none;
}
.main-content .wizard-form .progressbar-list.active::before {
  font-family: "Font Awesome 5 free";
  content: "\f00c";
  font-size: 11px;
  font-weight: 600;
  color: #cdcbe2;
  padding: 6px;
  background-color: #4053B2;
  border: 1px solid #4053B2;
  box-shadow: 0 0 0 7.5px rgb(118 60 176 / 11%);
}
.progressbar-list {
  color: #6f787d;
}
.active {
  color: #000;
}
.bg-color-info {
  background-color: #00d69f;
}
.border-color {
  border-color: #ececec;
}
.btn {
  padding: 16px 30px;
}
.back-to-wizard {
  transform: translate(-50%, -139%) !important;
}
.bg-success-color {
  background-color: #87d185;
}
.bg-success-color:focus {
  box-shadow: 0 0 0 0.25rem rgb(55 197 20 / 25%);
}
/* Contenedor para los plugins */
.pluginsOptions {
  display: flex;
  flex-wrap: wrap;
}

/* Estilo para cada Checkbox */
.pluginsOptions label {
  display: block;
  background-color: white;
  background-size: cover;
  width: 150px;
  height: 150px;
  margin: 10px;
  cursor: pointer;
  
}
.pluginsOptions label:hover{
  box-shadow: 1px 1px 5px 0px rgb(0 0 0 / 50%);
}

/* Mostrar el checkbox como un botón */
.pluginsOptions input[type="checkbox"], .pluginsOptions input[type="radio"] {
  display: none;
}

/* Estilo para el botón seleccionado */
.pluginsOptions input[type="checkbox"]:checked + label, .pluginsOptions input[type="radio"]:checked + label {
  outline: 2px solid #4053B2;
}

.navbar-brand h1{
  display: inline;
  margin-bottom: 0!important;
  font-size: 32px;
}
.navbar-brand {
  display: flex;
  align-items: center;
}
.navbar-nav li {
  width: 100%;

}

#offcanvasNavbar > div.offcanvas-body > ul > li > a 
{
  color: gray;
  text-decoration:none;
}

.navbar-nav li:hover {
  background-color: #212529;
  
}


.row.h-50{
  overflow-y: scroll;
}

.spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 4px solid #fff;
  border-top-color: #007bff;
  animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to {transform: rotate(360deg);}
}