/* Títulos destacados: negro, en negrita y algo más grandes que el texto (1rem)
   y que los párrafos .lead del tema (1.25rem).
   Se usa como <span class="color-title"> dentro de h1 o como clase de un h2. */
.color-title{
    color: #1e2022 !important;
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: 0 !important;
}

/* El h1/h2 que contiene el span toma el mismo tamaño, para no dejar
   el interlineado de un h1 grande alrededor de un texto pequeño. */
h1:has(> .color-title),
h2:has(> .color-title){
    font-size: 1.3rem !important;
    line-height: 1.45 !important;
    margin-bottom: 12px;
}

.border-shadown-box{
    box-shadow: 1px 3px 8px 0px #dddddd73;
}

h2.color-subtitle{
    color:#000;
    font-weight:500;
    font-size: 20px;
    text-transform: uppercase;
    margin-top: -20px;
}

#mainMenu nav>ul>li>a{
    color: #000;
}

.mega-menu-title.gad-menu-title{
    border-bottom: 2px solid #FFEE32;
}

ul.dropdown-menu.menu-gad{
    width: 40% !important;
}

#mainMenu nav > ul > li .dropdown-submenu.sub-menu-gad:before {
    right: -55px !important;
}

#mainMenu nav > ul > li .dropdown-submenu.sub-menu-gad > .dropdown-menu {
    left: 140%;
}

#mainMenu nav > ul > li > a{
    font-size: 14px !important;
}

.table .thead-dark th{
    color: #fff;
    background-color: #E7E9E7;
    border-color: #E7E9E7;
    color: #000;
    text-align: center;
}

.link-table{
    color: #000;
    font-size: 12px;
    text-align: center;
}

.button-attachment{
    padding: 5px;
    font-weight: bold;
    border: 1px solid #000;
}

#datatable_wrapper{
    width: 100%;
}

div.dataTables_wrapper div.dataTables_filter input{
    width: 200% !important;
}

div.dataTables_wrapper div.dataTables_filter{
    text-align: left !important;
}

table.dataTable #datatable_responsive{
    width: 100%;
}

.pdf-style{
    border: 1px solid #ddd;
    box-shadow: 4px 5px 10px 0px #ddd;
}

.message-authority{
    font-size:25px;
    font-style: italic;
}

.position-authority{
    padding: 0px;
    margin-top: -20px !important;
    font-size: 14px;
    font-style: italic;
    text-decoration: underline;
}

.option-cifra{
    cursor:pointer;
}

.option-cifra:hover{
    box-shadow: 3px 3px 18px 0px #e1e1e1;
}

h4.tag-cifras{
    font-size:1em;
    margin-bottom:20px;
}

.section-contacto{
    padding: 10px;
    border-radius: 5px;
    box-shadow: 1px 4px 12px 0px #ddd;
}

.logo-default{
       height: 80% !important;
}

#header.dark .header-inner #logo span .logo-default{
    display: none;
}

.list-group-item{
    border: 0px;
    border-bottom: 1px dashed #ddd;
}

.information-values{
    border:1px solid #ddd;
    border-radius:5px;
    padding:10px 20px;
}


/*Rooms*/
.room {
	margin-bottom: 100px;
}

.room-image {
	border-radius: 4px;
	margin-bottom: 10px;
	position: relative;
}

.room-image img {
	border-radius: 4px;
	width: 100%;
	opacity: 1;
	transition: all ease 0.3s;
	cursor: pointer;
}

.room-image:hover img {
	opacity: 0.7;
}

.room-image .room-title {
	background: rgba(0, 0, 0, 0) linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 1) 100%) repeat scroll 0 0;
	bottom: 0px;
	color: #fff;
	font-weight: 600;
	padding: 10px 10px 30px;
	position: absolute;
	text-align: center;
	width: 100%;
	font-size: 18px;
	border-radius: 0 0 4px 4px;
	float: left;
}

.room-badge {
	background: #e01a33 none repeat scroll 0 0;
	border-radius: 50%;
	color: #fff;
	font-size: 0.8333em;
	font-weight: bold;
	height: 42px;
	line-height: 1.0833em;
	margin: 0;
	padding: 10px 0 0;
	position: absolute;
	right: 10px;
	text-align: center;
	text-transform: uppercase;
	top: 10px;
	width: 42px;
	z-index: 1;
}

.room-details>p {
	border-bottom: 1px solid #f5f5f5;
	margin-bottom: 12px;
	padding-bottom: 10px;
}


/* HOME NOTICIAS PARROQUIALES*/

.badge-parroquial{
    background: #e01a33 none repeat scroll 0 0;
    /* border-radius: 50%; */
    color: #fff;
    font-size: 0.8333em;
    font-weight: bold;
    /* height: 42px; */
    line-height: 1.0833em;
    margin: 0;
    padding: 5px;
    position: absolute;
    right: 10px;
    text-align: center;
    text-transform: uppercase;
    top: 10px;
    /* width: 42px; */
    z-index: 1;
}

#mainMenu nav > ul > li > a {
    font-size: 12px !important;
}

.header-modal-capacitacion{
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 10px;
}

.erinyen .tp-thumb.selected .tp-thumb-over, .erinyen .tp-thumb:hover .tp-thumb-over {
    background: #ffffffb0 !important;
}

.message-information {
    background: #fff !important;
    color: #000 !important;
    border-radius: 10px;
    border: 1px dashed;
}

#mainMenu nav > ul > li .dropdown-menu.section-menu {
    min-width: 250px !important;
}

#page-title {
    clear: both;
    padding: 80px 0;
    background-color: #dddddd29;
    position: relative;
}


.ultimas-noticias .post-image a img {
    max-height: 240px !important;
}

.team-members.team-members-shadow .team-member .team-image > img {
    border-radius: 0 !important;
    max-height: 145px !important;
    width: 100%  !important;
}

.portfolio-item .portfolio-image img {
    width: auto !important;
    max-height: 245px !important;
}

.grid-articles.noticias-section .post-entry:first-child {
    width: 50% !important;
    margin-bottom:20px;
}

.banner-home h2 span.title-banner{
    font-size:0.7em !important;
    background:#81818185;
    color:#fff !important;
}

.banner-home span{
    background:#81818185;
    color:#fff !important;
    margin-bottom:10px;
}

img.services-icon {
    width: 35px !important;
}

.item-service {
    border: 1px solid #ddd;
    padding: 17px;
    border-radius: 5px;
}

.icon-box.small > h3, .icon-box.small > h5 {
    font-size: 12px !important;
    text-transform:UPPERCASE;
    font-weight:500;
}

.item-service .icon-box{
    margin-bottom:5px;
}

@media (max-width: 991.98px) {
    img.img-news {
        width: 100% !important;
    }
}


h2.text-medium.section-parr{
    font-size:31px !important;
}



@media (max-width: 991.98px){
    .banner-home .grid-articles:not(.post-carousel) .post-entry:first-child {
        width: 50% !important;
    }

    .grid-articles.noticias-section .post-entry:first-child {
        width: 100% !important;
        margin-bottom: 20px;
    }
}

/* ----------------------------------------------------------------
   Header: logo y menú siempre en una misma línea (escritorio)
   El menú móvil del tema se activa por debajo de 992px.
-----------------------------------------------------------------*/
@media (min-width: 992px) {
    #header .header-inner > .container {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        height: 100%;
    }

    #header .header-inner #logo {
        float: none;
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        max-width: 24%;
        height: 100%;
        margin-right: 20px;
    }

    #header .header-inner #logo a,
    #header .header-inner #logo a span {
        display: flex;
        align-items: center;
        height: 100%;
        line-height: 1.1;
        white-space: nowrap;
    }

    #header .header-inner #logo a span.logo-default {
        display: flex !important;
        height: 100% !important;
    }

    #header .header-inner #logo img {
        display: block;
        width: auto !important;
        height: auto !important;
        max-width: 100%;
        max-height: 64px;
        object-fit: contain;
    }

    #header.sticky-active .header-inner #logo img {
        max-height: 50px;
    }

    /* El menú ocupa el espacio que deja el logo y es contenedor de referencia
       para que su letra y espaciado se calculen según ese ancho (unidades cqi). */
    #header .header-inner #mainMenu {
        flex: 1 1 auto;
        min-width: 0;
        float: none;
        container-type: inline-size;
    }

    #header .header-inner #mainMenu nav {
        float: none;
        display: flex;
        justify-content: flex-end;
    }

    #header .header-inner #mainMenu nav > ul {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
    }

    #header .header-inner #mainMenu nav > ul > li {
        float: none;
        flex: 0 0 auto;
        margin-left: 0;
    }

    #header .header-inner #mainMenu nav > ul > li > a {
        white-space: nowrap;
        letter-spacing: 0.3px;
        /* Respaldo para navegadores sin container queries */
        padding: 10px clamp(4px, 0.6vw, 12px);
        font-size: clamp(9px, calc(4px + 0.6vw), 13px) !important;
        /* Proporcional al ancho disponible del menú */
        padding: 10px clamp(4px, 0.9cqi, 12px);
        font-size: clamp(8px, 1.25cqi, 13px) !important;
    }
}

/* ----------------------------------------------------------------
   Secciones que alternan fondo gris / blanco.
   Las secciones que no se renderizan (sin datos) no existen en el HTML,
   así que la alternancia se recalcula sola y nunca quedan dos grises juntos.
   La primera sección del grupo es gris (la anterior, fuera del grupo, es blanca).
-----------------------------------------------------------------*/
.secciones-alternas > section:nth-of-type(odd) {
    background-color: #f4f5f7 !important;
    border-top: 1px solid #e9ebee;
    border-bottom: 1px solid #e9ebee;
}

.secciones-alternas > section:nth-of-type(even) {
    background-color: #fff !important;
}