      @font-face {
        font-family: 'Raleway';
        src: url('../../../../../templates/cassiopeia/fonts/raleway-regular.ttf') format('ttf'), /* Reemplaza con la ruta correcta */
             url('../../../../../templates/cassiopeia/fonts/raleway-regular.ttf') format('ttf'); /* Reemplaza con la ruta correcta */
        font-weight: normal;
        font-style: normal;
      }
      
      @font-face {
        font-family: 'Raleway';
        src: url('../../../../../templates/cassiopeia/fonts/raleway-bold.ttf') format('ttf'), /* Reemplaza con la ruta correcta */
             url('../../../../../templates/cassiopeia/fonts/raleway-bold.ttf') format('ttf'); /* Reemplaza con la ruta correcta */
        font-weight: bold;
        font-style: normal;
      }

:root {
            --dark-color: #060504;
            --light-color: #fbfaf9;
            --main-background: #fbfaf9;
            --primary-background: #524714;
            --primary-textColor: #ffffff;
            --secondary-background: #523a14;
            --secondary-textColor: #ffffff;
            --secondary-color:  #fbfaf9;
            --accent-background: #3d9ff5;
            --accent-textColor: #000000;
            --primary-gradient: linear-gradient(180deg, #523114, #211408);
            --secondary-gradient: linear-gradient(180deg, #523a14, #211708);
        }
body {
  font-family: 'Raleway', sans-serif !important;
}
h1, h2, h3, h4, h5, h6 {
  font-family: 'Raleway', sans-serif !important;
}

.container-header { position: relative; z-index: 10; /*margin-bottom: 20px;*/ background-color: #0a7937; background-image: linear-gradient(135deg, #0a7937 0%, #0a7937 100%); box-shadow: 0 5px 5px rgba(0, 0, 0, 0.03) inset; }

nav ul li.active a {
  border: 2px solid #fff; /* Color del borde */
  border-radius: 10px;       /* Redondeo de esquinas */
  padding: 10px 15px;         /* Espaciado interno para que se vea mejor */
  /*background-color: #e6ffe6; /* Opcional: fondo para destacar */
}

.container-header .mod-menu {
  border-bottom-color: orange;
  border-bottom-style: solid;
}

.container-header .navbar-toggler {
  color: #939393;
  cursor: pointer;
  border: 1px solid #237b62;
}

.header.container-header.full-width {
    display: grid;
    grid-gap: 0 1em;
}
.metismenu.mod-menu .metismenu-item {
  font-size: 1.5rem;
  line-height: 1.5;
}
.left.item-image {
  float: inherit;
}

.container-header .grid-child:first-child {
    grid-column: 1/2;
}

.container-header .container-nav {
    grid-column: 3/4;
}

.container-header .mod-menu {
  color: #fff;
  list-style: none;
}
.container-header .mod-menu > li.active::after, .container-header .mod-menu > li:hover::after {
  background: #fff;
  left: 0;
  right: 2px;
}
.navbar-nav .nav-link {
    color: black; /* Color del texto del menú */
}
.navbar-nav .nav-link:hover {
    color: gray; /* Color del texto del menú al pasar el ratón */
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: var(--nav-pills-link-active-color);
  background-color: var(--nav-pills-link-active-bg)!important;
}

        .card {
            border: 1px solid var(--primary-background); /* border color of your cards */
	        border-radius: 0; /* border radius of your cards */
	        background-color: var(--primary-background); /* background color of your cards */
          color:var(--light-color);
        }

.metismenu.mod-menu .metismenu-item {
  padding: .5em .3em;
}

.container-header .metismenu > li > a:hover::after, .container-header .metismenu > li > button:hover::before, .container-header .metismenu > li.active > a::after, .container-header .metismenu > li.active > button::before {
  background: #fff;
  left: 0;
  right: 0;
}

body.wrapper-fluid .site-grid {
  grid-gap: 0 0px;
  }

#map {
    height: 100%;
    width: 100vw;
}

.img-thumbnail {
  background-color: #fff0;
  }

figcaption {
  color: #fff;
  font-size: 2em;
  margin-top: -100px;
  margin-left: 10px;
  background-color: #0F0;
  background-image: linear-gradient(90deg, #9fd3b0 0px, #9fd3b0 20px, #0a7937 20px, #0a7937 100%);
  position: absolute;
  width: 80%;
  padding-left: 25px;
}
figure {
  text-align: center;
}
.nav-tabs + .tab-content {
  padding: 0px;
}

.footer {
  color: #fff;
  background-image: linear-gradient(135deg,#0a7937 0%,#0a7937 100%);
  margin-top: 1em;
}

.footer .grid-child {
  display: block;
}

.container-component > :first-child, .container-sidebar-left > :first-child, .container-sidebar-right > :first-child, .container-component > * + *, .container-sidebar-left > * + *, .container-sidebar-right > * + * {
  margin-top: 0em;
}

.reglas_uso {
  background-color:#bce0c8;
}

.proceso {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  max-width: 800px;
  margin: auto;
}

.paso {
  background: #ffffff;
  padding: 1.5rem;
  border-left: 6px solid #4CAF50;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.paso h2 {
  margin-top: 0;
  color: #2e7d32;
}

.paso ul {
  padding-left: 1.2rem;
}
@media (width >= 992px) {
  .container-header .metismenu > li > a::after, .container-header .metismenu > li > button::before {
    content: "";
    opacity: 1;
    background: 0 0;
    height: 2px;
    margin: auto;
    transition: all .2s,background-color .2s;
    display: block;
    position: absolute;
    bottom: -1;
    left: 50%;
    right: 50%;
  }
figcaption {
  color: #fff;
  font-size: 2em;
  margin-top: -150px;
  margin-left: 10px;
  background-color: #0F0;
  background-image: linear-gradient(90deg, #9fd3b0 0px, #9fd3b0 20px, #0a7937 20px, #0a7937 100%);
  position: absolute;
  width: 80%;
  padding-left: 25px;
}  
}