/* ******************************************************************* */
/* ******************************************************************* */
.place-content-center {
  place-content: center;
  display: grid;
}
/* ******************************************************************* */
/* ******************************************************************* */


/* *************************************************** */
/*** background del login ***/
.login-background {
  background-image: url("../img/light-gray-acrylic-texture-background-wallpaper.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
/*** background del login ***/
/* *************************************************** */


/* *************************************************** */
/*** background del toll number ***/
.ad-background {
  background-image: url("../img/light-gray-acrylic-texture-background-wallpaper.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  display: block;
}
/*** background del toll number ***/
/* *************************************************** */


/* *************************************************** */
/*** ocultar todos los inputs tipo file ***/
input[type="file"] {
  display: none;
}
/*** ocultar todos los inputs tipo file ***/
/* *************************************************** */

/* *************************************************** */
/*** input para cargar imagenes mostrando foro tipo facebook ***/
.load-image {
  background-image: url("../img/undraw_profile.svg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
  width: 125px;
  height: 125px;
  transition: cubic-bezier(0.165, 0.84, 0.44, 1);
}
/*** input para cargar imagenes mostrando foro tipo facebook ***/
/* *************************************************** */

/* *************************************************** */
/*** efecto rotatorio de cartas ***/
.rotate {
  -webkit-transition: 0.3s ease;
}

.rotate:hover {
  transform: rotate(-2deg);
  box-shadow: 0.45rem 0.45rem rgba(0, 0, 0, 0.1);
}
/*** efecto rotatorio de cartas ***/
/* *************************************************** */


/* *************************************************** */
/*** expandir tamaño del boton en resoluciones pequeñas ***/
@media (max-width: 991.98px) {
  .x-100 {
    width: 100%;
  }
}
/*** expandir tamaño del boton en resoluciones pequeñas ***/
/* *************************************************** */


/* *************************************************** */
/*** background del iniciar sesion ***/
.sign-in-background {
  background-image: url("../img/house-7497001_1920.png");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
/*** background del iniciar sesion ***/
/* *************************************************** */

/* *************************************************** */
/*** efecto hover de los link del footer  ***/
.footer-link {
  color: white;
  -webkit-transition: 0.3s ease;
}

.footer-link:hover {
  color: #696E77;
}

.footer-link:active, 
.footer-link:focus {
  color: rgba(25,135,84,.7);
}
/*** efecto hover de los link del footer  ***/
/* *************************************************** */

/******************************/
/*** hover del return to log in  ***/
.a-login {
  -webkit-transition: 0.3s ease;
  color: rgb(25,135,84);
}

.a-login:hover {
  color: rgba(25,135,84,.7);
}
/*** hover del return to log in  ***/
/******************************/

/******************************/
/*** separador de texto ***/
hr.hr-text {
  position: relative;
  border: none;
  height: 1px;
  background: black;
}

hr.hr-text::before {
  content: attr(data-content);
  display: inline-block;
  background: #fff;
  font-weight: bold;
  color: black;
  padding: 0.2rem 2rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/*** separador de texto ***/
/******************************/

/******************************/
/*** background del index ***/
.index-background {
  background: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0.3) 0%,
      rgba(0, 0, 0, 0.7) 75%,
      #000 100%
    ),
    url("../img/10282049_l.jpg");
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}
/*** background del index ***/
/******************************/

/******************************/
/*** background de about ***/
.about-background {
  background: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0.3) 0%,
      rgba(0, 0, 0, 0.7) 75%,
      #000 100%
    ),
    url("../img/pexels-tima-miroshnichenko-6195125.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}
/*** background de about ***/
/******************************/

/******************************/
/*** background con opacidad ***/
.bg-opacity {
  position: relative;
  z-index: 5;
}

.bg-opacity::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0.75;
}
/*** background con opacidad ***/
/******************************/

/******************************/
/*** divider del sign up ***/
.divider-text {
  position: relative;
  text-align: center;
  margin-top: 15px;
  margin-bottom: 15px;
}

.divider-text span {
  padding: 0 1rem 0 1rem;
  font-weight: bold;
  position: relative;
  background-color: #fff;
  z-index: 2;
}

.divider-text:after {
  content: "";
  position: absolute;
  width: 100%;
  border-bottom: 1px solid;
  top: 55%;
  left: 0;
  z-index: 1;
}
/*** divider del sign up ***/
/******************************/

/******************************/
/*** background de los testimonios ***/
.testimonials-background {
  background: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0.3) 0%,
      rgba(0, 0, 0, 0.7) 75%,
      #000 100%
    ),
    url("../img/pexels-olly-789822.jpg");
    background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}
/*** background de los testimonios ***/
/******************************/

/******************************/
/*** Pricing card ***/
.price-item {
  position: relative;
  overflow: hidden;
  transition: 0.5s;
}

.price-item:hover {
  background: linear-gradient(
    rgba(239, 240, 240, 0.897),
    rgba(239, 240, 240, 0.897)
  );
}

.price-item .pice-item-offer {
  position: absolute;
  width: 200px;
  height: 110px;
  top: -45px;
  right: -80px;
  background: linear-gradient(rgba(249, 149, 5, 0.7), rgba(249, 149, 5, 0.7));
  color: var(--bs-white);
  transform: rotate(42deg);
  display: flex;
  align-items: end;
  justify-content: center;
  padding-bottom: 10px;
}
/*** Pricing card ***/
/******************************/

/******************************/
/*** Colores de iconos de tarjetas ***/
.bronze {
  color: rgba(205, 127, 50, 1) !important;
}

.silver {
  color: rgba(132, 132, 130, 1) !important;
}

.gold {
  color: rgba(255, 215, 0, 1) !important;
}

.platinum {
  color: rgba(0, 255, 255, 1) !important;
}
/*** Colores de iconos de tarjetas ***/
/******************************/

/******************************/
/*** Altura de 30px ***/
.h-30px {
  height: 30px;
}
/*** Altura de 30px ***/
/******************************/

/******************************/
/*** Alinear contenido de div en el centro ***/
.align-content-middle {
  display: grid;
  place-content: center;
}
/*** Alinear contenido de div en el centro ***/
/******************************/

/******************************/
/*** Navbar ***/
.navbar.sticky-top {
  top: -100px;
  transition: .5s;
}

.navbar .navbar-brand img {
  max-height: 60px;
}

.navbar .navbar-nav .nav-link {
  margin-left: 25px;
  padding: 10px 0;
  color: #fff !important;
  font-weight: 500;
  outline: none;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link:active,
.navbar .navbar-nav .nav-link.active {
  color: rgba(222, 226, 230, 0.75) !important
}

.navbar .dropdown-toggle::after {
  border: none;
  content: "\f107";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  vertical-align: middle;
  margin-left: 8px;
  border-color: #fff;
}

@media (max-width: 991.98px) {
  .navbar .navbar-brand img {
      max-height: 45px;
  }

  .navbar .navbar-nav {
      margin-top: 20px;
      margin-bottom: 15px;
  }

  .navbar .nav-item .dropdown-menu .dropdown-item:focus,
  .navbar .nav-item .dropdown-menu .dropdown-item:active,
  .navbar .nav-item .dropdown-menu .dropdown-item.active {
    background-color: rgba(25,135,84, 0.7);
    color: #fff;
  }
}

@media (min-width: 992px) {
  .navbar .nav-item .dropdown-menu {
      display: block;
      border: none;
      margin-top: 0;
      top: 150%;
      right: 0;
      opacity: 0;
      visibility: hidden;
      transition: .5s;
  }

  .navbar .nav-item .dropdown-menu .dropdown-item:focus,
  .navbar .nav-item .dropdown-menu .dropdown-item:active,
  .navbar .nav-item .dropdown-menu .dropdown-item.active {
    background-color: rgba(25,135,84, 0.7);
    color: #fff;
  }

  .navbar .nav-item:hover .dropdown-menu {
      top: 100%;
      visibility: visible;
      transition: .5s;
      opacity: 1;

  }
}
/*** Navbar ***/
/******************************/

/******************************/
/*** payments card hover ***/
.payments-card-hover {
  -webkit-transition: 0.3s ease;
}

.payments-card-hover:hover {
  border-width: 0.1rem;
  border-color: #198754;
  color: #198754;
}
/*** payments card hover ***/
/******************************/

/******************************/
/*** menu de settings personalizado ***/
.nav.nav-underline .nav-item .nav-link {
  padding: 1rem;
  color:#198754
}

.nav.nav-underline .nav-item .nav-link i {
  margin-right: 1rem;
}

.nav.nav-underline .nav-item .nav-link.active,
.nav.nav-underline .nav-item .nav-link:active,
.nav.nav-underline .nav-item .nav-link:hover {
  color: rgba(25,135,84, 0.7);
}

@media (max-width: 1025.98px) { 
  .fw-semibold {
    font-size: 1.25rem !important;
  }
}

@media (max-width: 991.98px) { 

  .fw-semibold {
    font-size: .75rem !important;
  }
  .nav.nav-underline > .nav-item {
    flex: 1 1 auto;
    text-align: center;
  }

  .nav.nav-underline .nav-item .nav-link i {
    margin:0% !important;
    }

  .nav.nav-underline .nav-item .nav-link span {
    display: none !important;
  }

}
/*** menu de settings personalizado ***/
/******************************/

/******************************/
/*** Foto de perfil ***/
.round-100{
  width:125px;
  height:125px
}
/*** Foto de perfil ***/
/******************************/

/******************************/
/*** Fuente gruesa para los botones ***/
.btn {
  font-weight: bold !important;
}
/*** Fuente gruesa para los botones ***/
/******************************/

/******************************/
/*** Fuente semi-gruesa para los encabezados del tipo facebook ***/
.fw-semibold {
  font-weight:600 !important
}
/*** Fuente semi-gruesa para los encabezados del tipo facebook ***/
/******************************/

.accordion .accordion-item .accordion-header {
  font-weight: bold !important;
}

/* ******************************************************************* */
/* ******************************************************************* */
.masthead {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 500px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.7) 75%, #000 100%), url("../img/10282049_l.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  place-content: center;
  display: grid
  ;

}
.masthead h1, .masthead .h1 {
  font-size: 2.5rem;
  line-height: 2.5rem;
  letter-spacing: 0.8rem;
  color: white;
}
.masthead h2, .masthead .h2 {
  max-width: 20rem;
  font-size: 1rem;
}

@media (min-width: 768px) {
  .masthead h1, .masthead .h1 {
    font-size: 4rem;
    line-height: 4rem;
  }
}
@media (min-width: 992px) {
  .masthead {
    padding: 0;
  }
  .masthead h1, .masthead .h1 {
    font-size: 6.5rem;
    line-height: 6.5rem;
    letter-spacing: 0.8rem;
  }
  .masthead h2, .masthead .h2 {
    max-width: 30rem;
    font-size: 1.25rem;
  }
}
/* ******************************************************************* */
/* ******************************************************************* */

/* ******************************************************************* */
/* ******************************************************************* */
.footer {
  background: rgba(25,135,84, 0.7)
}
/* ******************************************************************* */
/* ******************************************************************* */

/* ******************************************************************* */
/* ******************************************************************* */
.avatar {
  --bs-avatar-size:calc(2.8125rem + var(--bs-border-width)*2);
  --bs-avatar-border-radius:50rem;
  --bs-avatar-font-size:0.875rem;
  --bs-avatar-bg:var(--bs-tertiary-bg);
  --bs-avatar-color:var(--bs-body-color);
  --bs-avatar-group-offset:calc(var(--bs-avatar-size)/-5);
  --bs-avatar-group-outline-width:calc(var(--bs-avatar-size)/15);
  --bs-avatar-status-border-width:var(--bs-border-width);
  --bs-avatar-status-border-color:var(--bs-border-color);
  align-items:center;background-color:var(--bs-avatar-bg);border-radius:var(--bs-avatar-border-radius);
  color:var(--bs-avatar-color);
  display:inline-flex;
  font-size:var(--bs-avatar-font-size);
  height:var(--bs-avatar-size);
  justify-content:center;
  min-width:var(--bs-avatar-size);
  position:relative;
  text-transform:uppercase;
  width:var(--bs-avatar-size)
}

.avatar-lg {
  --bs-avatar-size:calc(3.5rem + var(--bs-border-width)*2);
  --bs-avatar-font-size:1rem
}

.bg-body{
  --bs-bg-opacity:1;
  background-color:rgba(var(--bs-body-bg-rgb),var(--bs-bg-opacity))!important
}
/* ******************************************************************* */
/* ******************************************************************* */

/* ******************************************************************* */
/* ******************************************************************* */
.calendar {
  width: 3.125rem;
  line-height: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: center;
  font-family: var(--falcon-font-sans-serif);
  border-radius: 0.375rem;
}
.calendar .calendar-month {
  background-color: var(--falcon-danger);
  color: #fff;
  border-radius: 0.375rem 0.375rem 0 0;
  padding: 0.25rem;
  font-weight: 600;
}
.calendar .calendar-day {
  font-size: 1.728rem;
  padding: 0.25rem;
  border: 0.125rem solid rgba(var(--falcon-danger-rgb), 0.3);
  border-top: 0;
  border-radius: 0 0 0.375rem 0.375rem;
  color: #9da9bb;
  font-weight: 700;
}
/* ******************************************************************* */
/* ******************************************************************* */

/* ******************************************************************* */
/* ******************************************************************* */
.bg-opacity-2 {
  background: linear-gradient(rgba(249, 149, 5,.9), rgba(249, 149, 5,.9)), url(../img/carousel-2.jpg) center center no-repeat fixed;
  background-size: cover;
  color: #fff;
}
/* ******************************************************************* */
/* ******************************************************************* */

/* ******************************************************************* */
/* ******************************************************************* */
i {
    color: rgb(249, 149, 5);
}
/* ******************************************************************* */
/* ******************************************************************* */