@font-face {
    font-family: 'Poppins-Regular';
    src: url('fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

  body {
    font-family: 'Poppins-Regular', sans-serif;
}

/* POSSIBILITAT D'IMPORTAR FONTS DE GOOGLE */
/*@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@200..800&display=swap');*/
/* Use the imported font on the page: On Google you can also find the CSS instruction for using the font. If you put this in the body element then the font will be used on the whole website. */



h1 {
    font-family: 'Poppins-Regular', sans-serif; /* Reemplaza 'NombreDeLaFuente' por la tipografía deseada */
    font-size: 2.5em; /* Puedes ajustar el tamaño si es necesario */
    font-weight: bold; /* Ajusta el peso de la fuente */
}

h2 {
    font-family: 'Poppins-Regular', sans-serif; /* Reemplaza 'NombreDeLaFuente' por la tipografía deseada */
    font-size: 1.2rem; /* Ajusta según sea necesario */
    font-weight: bold;
}

h3 {
    font-family: 'Poppins-Regular', sans-serif; /* Reemplaza 'NombreDeLaFuente' por la tipografía deseada */
    font-size: 1.75em; /* Ajusta según sea necesario */
    font-weight: bold;
}

.container-header {
    position: relative;
    z-index: 10;
    margin-bottom: 5px;
    background-image: none; 
    background-color: transparent; /*asigna transparència a la capçalera*/
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.03) inset;
    justify-content: center;
}

/* Canvia el color del menu Burger */
.container-header .navbar-toggler { color: black; }
.mod-list li a {
    color: black;
    border-radius: 10px;
}
.container-footer{
/*   border-radius: 10px;*/
   background-color: white;

}
footer div.mod-footer {
  display: flex;
  flex: 1 1 0%;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.footer {
    margin-top: 1em;
    color: white;
    background-color: black;
    background-image: none;
}
@media (min-width: 768px) {
    footer div.mod-footer {
    flex-direction: row;
  }
}
.container-header .mod-menu {
justify-content: center;
  color: #000000; 
  flex-wrap: wrap;
}
padding: 0;

/* Canvia l'amplada dels panells dret i esquer */
  
body.wrapper-fluid .site-grid {
  grid-template-columns: [full-start] minmax(0,1fr) [main-start] minmax(0,20%) minmax(0,30%) minmax(0,50%) minmax(0,30%) [main-end] minmax(0,1fr) [full-end]
}

@supports (display: grid) {
  @media (min-width: 992px) {
    .site-grid {
      grid-template-columns: [full-start] minmax(0,1fr) [main-start] minmax(0,9.875rem) minmax(0,29.875rem) minmax(0,29.875rem) minmax(0,9.875rem) [main-end] minmax(0,1fr) [full-end]
    }
  }
}
  
/*color de fons del topbar*/
  
.container-topbar{
  background-color: black;
}
  
:root {
  --body-font-size: 1rem;
	/*1. color de fons*/
     --body-bg: white; 
	/*2. color del text*/
	--body-color: black;
  	/*3. Adjust Cassiopeia Color Scheme*/
    --cassiopeia-color-primary: black;
    --cassiopeia-color-hover: blue;
/*    --border-radius: 15px;*/
    .float-center.item-image {
/*     text-align: right;*/
  

}
  
/* Elimina el borde de los módulos */
.card {
    border: none;
    box-shadow: none;
}

/* Elimina el borde de los artículos */
article {
    border: none;
    box-shadow: none;
}

l
/* Cambiar la tipografía de los títulos de los artículos */
.item-title, .page-header, .blog-item h2 {
    font-family: 'Poppins-Regular', sans-serif;
    font-size: 24px; /* Puedes ajustar el tamaño */
 /*   font-weight: bold; /* Opcional: ajusta el peso */
    color: #333; /* Opcional: ajusta el color */
}
/* canviar tamany titols dels articles */
  
.article-title, .article-header h1{
font-size: 0.8em;
}

.page-title, .page-header h1 {
font-size: 0.8em;
}
h1.article-title {
    font-family: 'Poppins-Regular', serif;
    font-size: 28px;
}

h2.article-title {
    font-family: 'Poppins-Regular', sans-serif;
    font-size:48px;
}
/* aplica color gris clar a la trnsparència de la capçalera*/
  
.container-nav{background-color: rgba(240,240,240, 0.8);
justify-content: right !important;
}
.navbar-brand {
margin: auto;
}
.container-header .mod-menu {
justify-content: right;
padding: 0;
}
  

/* ++++++++++++++++++++++++ menu ++++++++ */
 .navbar {
/*            background-color: #333;*/
            padding: 1px;
        }
        
        .nav.menu {
            list-style-type: none;
            margin: 0;
            padding: 0;
            display: flex;
        }

        .nav-item {
            position: relative;
        }

        .nav-link {
            display: block;
            color: black;
            padding: 5px 1px !important;
            text-decoration: none;
            font-size: 16px;
        }

        .nav-link:hover {
            background-color: red;
        }

        .active .nav-link {
            background-color: #007bff;
            font-weight: bold;
        }


.metismenu.mod-menu .metismenu-item {
  font-size: 0.8rem;
  line-height: 1.5;
  text-align: right;
}
  /* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.metismenu > li > a {
    font-size: 1 !important;
    color: #333 !important;
   text-decoration: none;
}

/* dona color al fons d'un article concret (itemd) */  
.itemid-86 .article {
    text-color: grey;
}
/* Cambiar el fondo de los artículos 
.item-page {
    background-color: orange;
    padding: 20px; /* Opcional: agrega un poco de padding si es necesario 
} */

/* Estilos para READMORE */
.readmore a {
    background-color: #ffefbf; /* Cambia este valor al color de fondo deseado */
    text-decoration: none; /* Elimina el subrayado */
    font-size: 0.8em;
    padding: 2px; /* Opcional: agrega un poco de espacio alrededor del enlace */
    border-radius: 5px; /* Opcional: redondea las esquinas */
}

.readmore a:hover {
    background-color: #ffe599; /* Cambia este valor al color de fondo deseado para el hover */
    text-decoration: none;
}

/* Estils pel mòdul de login */
  
.mod-login {
    max-width: 700px; /* Ajusta el valor según el ancho deseado */
    margin: 0 auto; /* Para centrar el módulo horizontalmente */
}

  @media (max-width: 768px) {
    .mod-login {
        max-width: 100%; /* Ajusta según sea necesario para pantallas pequeñas */
    }
  }
  @media (max-width: 768px) { /* Aplica solo en pantallas pequeñas */
  header.site-header {
    position: relative; /* Cambia de sticky a relative en pantallas pequeñas */
  }
}
/*   .custom-module-container {
    height: 50vh; /* O ajusta según sea necesario */
    min-height: 50%;
}
*/