body{ 

background: rgb(2,0,36);
background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(83,199,163,1) 0%, rgba(0,241,255,1) 27%, rgba(9,224,255,1) 50%, rgba(51,179,209,1) 67%, rgba(0,255,91,1) 91%, rgba(0,255,91,1) 91%, rgba(0,255,46,1) 100%);

 }
.colorfondo
{
  background: rgb(2,0,36);
background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(83,199,163,1) 0%, rgba(0,241,255,1) 27%, rgba(9,224,255,1) 50%, rgba(51,179,209,1) 67%, rgba(0,255,91,1) 91%, rgba(0,255,91,1) 91%, rgba(0,255,46,1) 100%);

}
.navbar {
  background-color: #000000; /* Blue color */
  transition: background-color 0.3s ease, opacity 0.3s ease;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
}


.navbar .navbar-brand,
.navbar .nav-item .nav-link {
  color: #ffffff; /* White color */
}

.navbar .navbar-brand:hover,
.navbar .nav-item .nav-link:hover {
  color: #ffffff; /* White color (hover) */
}

.navbar .form-inline .form-control {
  width: 200px;
}


.navbar.opaque {
  opacity: 1;
}

.navbar.transparent {
  opacity: 0.8;
}


/* Transparent Button */
.transparent-button {
  background-color: transparent;
  border: none;
  color: #ffffff; /* Text color */
  cursor: pointer;
  padding: 10px 20px;
  transition: background-color 0.3s ease;
}

.transparent-button:hover {
  background-color: rgba(255, 255, 255, 0.3); /* Transparent background color on hover */
}

/* Opaque Button */
.opaque-button {
  background-color: #ffffff; /* Background color */
  border: none;
  color: #000000; /* Text color */
  cursor: pointer;
  padding: 10px 20px;
  transition: background-color 0.3s ease;
}

.opaque-button:hover {
  background-color: #cccccc; /* Background color on hover */
}

.logo_icono{

  width: 40px;
  height: 40px;

  }

  .logo_banner{
      width: 80%px;
      height: 90px;
      border-radius: 10px;

  }
  .page_style{
padding: 10px;
background-image: url('img/barrera.jpg');
background-size: cover;
margin-top: 160px;
border-radius: 10px;
  }
  .form_style{
    width:80%;
padding: auto;
margin: 10px;
position: relative;
left: 60px;
  }
  .portada_home{
height: 560px;
height: auto;
border-radius: 10px;
padding: auto;
margin-top: auto;
  }
  .btn_modulos{
background-color: #ffffff;
border-radius: 10px;
padding: 10px;
  }

  .fondos-sing{
    background-color: rgba(255, 255, 255, 0.3); 
    border-radius: 5px;
  }
  @media (max-width: 767px) {
    .form_style{
      width:80%;
  padding: auto;
  margin: 10px;
  position: relative;
  left: 10px;
    }
  }