/*
Theme Name: RecomendacionesDH Custom Theme
Theme URI: https://recomendacionesdh.mx/
Author: RecomendacionesDH Team
Author URI: https://recomendacionesdh.mx/
Description: RecomendacionesDH Custom Theme is a professional, responsive WordPress theme designed for human rights organizations, advocacy platforms, and community education. It features accessible layouts, resource integration, report archives, event calendars, and multilingual support to promote awareness and action.
Version: 1.0
Text Domain: recomendacionesdh
Tags: human-rights, advocacy, nonprofit, community, responsive, accessibility, custom-theme
*/



body{
	margin: 0;
	font: Arial, Helvetica, sans-serif;
}
* {
    box-sizing: border-box;
}

img.custom-logo {
    max-width: 300px;
    width: 100%;
    height: 80px;
}



ul#menu-footer-menu-1 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
    padding: 10px;
    box-sizing: border-box;
    list-style: none;
}
ul#menu-footer-menu-1 li a
{
	color:#000;
	text-decoration:none;
	font-size:18px;
}
ul#menu-footer-menu-1 li a:hover
{
	text-decoration:underline;
}

.ecomend-content-area {
    font-size: 16px;
    padding-top: 20px;
    padding-bottom: 20px;
    line-height: 24px;
}

.container
{
    max-width: 1200px;
    width: 100%;
    margin: auto;
    padding: 0 20px;
}

.ecomend-content-area h1 {
    font-size: 36px;
    font-weight: bold;
    text-align: center;
    line-height: 45px;
}

.ecomend-content-area h2 {
    font-size: 30px;
    font-weight: bold;
    line-height: 40px;
}

.ecomend-content-area h3 {
    font-size: 25px;
    font-weight: bold;
    line-height: 35px;
   
}

.ecomend-content-area h4 {
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
    
}

.ecomend-content-area h5 {
    font-size: 18px;
    font-weight: bold;
    line-height: 28px;
 }

.ecomend-content-area h6 {
    font-size: 16px;
    font-weight: bold;
    line-height: 25px;
   
}

.ecomend-content-area ol li {
    list-style: decimal;

}

.ecomend-content-area ul li {

    list-style: disc;
}

.ecomend-content-area ol,
.ecomend-content-area ul {
    box-sizing: border-box;
    padding-left: 30px;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 10px 0 !important;

}

.ecomend-content-area table {

    border-collapse: collapse;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
}

.ecomend-content-area td {
    border: 1px solid #ccc;
    padding: 8px;
    font-size: 16px;
}

.ecomend-content-area dl {
    margin: 20px;
    padding: 0;
    font-family: Arial, sans-serif;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
}

.ecomend-content-area dt {
    font-weight: bold;
    margin: 10px 0 5px;
    padding: 10px;
    background-color: #eee;
    border-bottom: 1px solid #ddd;
}

.ecomend-content-area dd {
    margin: 0 0 10px 20px;
    padding: 10px;
    border-left: 2px solid #ddd;
    background-color: #fff;
}


.ecomend-content-area li {
    line-height: 30px;
}

.ecomend-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;

}
.ecomend-main-header {
    padding: 20px 0;
}

/* Add FontAwesome arrow only to top-level menu items with children */
.menu-item-has-children>a::after {
    content: "\f078";
    font-family: "FontAwesome";
    margin-left: 5px;
    color: #000;
/*     position: absolute; */
    top: 0px;
    right: -18px;
    font-size: 10px;
}

/* Hide arrow for nested submenu items */
.sub-menu .menu-item-has-children>a::after {
    display: block;
    right: 0;
}

.ecomend-navigationcl {
    position: relative;
    left: auto;
    padding-top: 0;
    display: inline-block;
    width: 100%;
}

.ecomend-navigationcl a {
    display: block;
    position: relative;
    margin: 0;
    height: auto;
    font-size: 17px;
    line-height: 40px;
    color: #000;
    overflow: visible;
    text-decoration: none;

}

.sub-menu li a {
    line-height: 24px;
    margin: 5px 0;
    Color: #000;

}

.ecomend-navigationcl li {
    position: relative;
    display: inline-block;
    padding: 0 20px;
}

.ecomend-nav-select {
    display: inline-block;
    visibility: visible;
    width: 100%;
    text-align: right;
}

.ecomend-navigationcl a:hover,
.ecomend-navigationcl a:focus {
    color: #000;
}

.ecomend-navbar-togglecl {
    display: none;
}

.sub-menu {
    display: none;
    position: absolute;
    left: 0px;
    background: #fff;
    width: 180px;
    text-align: left;
    padding: 10px 0;
    box-shadow: 0 0 6px #ddd;
    top: 39px;
    word-break: break-word;
    z-index: 999;
}

.menu-item:hover .sub-menu {
    display: block;
}

.sub-menu li {
    width: 100%;
}

.sub-menu .sub-menu {
    left: auto;
    right: 100%;
    top: -10px;

}

.ecomend-nav-select .sub-menu>li>.sub-menu {
    display: none;
    position: absolute;

}

.ecomend-nav-select .menu__list>li:hover>.sub-menu,
.ecomend-nav-select .sub-menu>li:hover>.sub-menu {
    display: block;
}

.campaign-list-item_key-features ul li {
    list-style: none;

}

.campaign-list-item_key-features ul {
    padding-left: 0;
}


.aligncenter {

    display: block;
    margin: auto;
}

.ecomend-content-area table {
    margin: 25px 0;
    border-collapse: collapse;
    width: 100%;
}

th {
    border: 1px solid #ccc;
}

.ecomend-footer {
    text-align: center;
}
.nav-menu li.menu-item-has-children:hover>a::after {
    transform: rotate(-180deg);
    color:#cc0201!important;
}
.box-image img {
    width: 100%;
}
.accordionButton h3 {
    font-weight: 900 !important;
}

 .recomendacionesdh-author-container {
        border-radius: 8px;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 8px;
        margin: 20px 0;
        background: transparent;
        border-radius: 16px;
        border: 1px solid #d4d4d496;
    }

    .author-img-con img {
        height: 65px;
        width: 65px;
        object-fit: contain;
        border-radius: 50px;
    }

    .author-img-con {
        border: 2px dotted #568187;
        border-radius: 64px;
        padding: 4px 4px 1px;
    }

    .author-img-con {
        position: relative;
        border: 2px dashed transparent;
        border-radius: 64px;
        padding: 4px 4px 1px;
    }

    .date-container {
        height: 50px;
    }

    .date-author-cl span {
        font-size: 18px;
        color: #000;
    }

    span.posttim.posdate a {
        color: #000;
    }

    .last_updated_date p {
        font-size: 18px;
        color: #000;
    }
    section.main-content {
        padding: 60px 0 0;
        position: relative;
        z-index: 1;
    }

    .profile-header-container {
        display: flex;
        align-items: center;
        gap: 20px;
        margin-bottom: 25px;
        padding: 10px 20px;

        
        border-bottom: 1px solid #d4d4d4;
        z-index: 999;
        position: relative;
        margin: 10px auto;
        width: 96%;
        border-radius: 12px;
        border: 1px solid #d2d2d2;
    }

    .header-avatar-container img {
        border-radius: 50%;
        width: 90px;
        height: 90px;
        object-fit: cover;
    }

    .header-name-container h2 {
        font-size: 28px;
        font-weight: 700;
        color: #222;
    }

    .profile-fields-group {
        padding: 10px 20px;
        border-bottom: 1px solid #d4d4d4;
        z-index: 999;
        position: relative;
        margin: 10px auto;
        width: 96%;
        border-radius: 12px;
        border: 1px solid #d2d2d2;

    }

    h2.group-title {
        font-size: 28px;
        border-bottom: 2px solid #000000;
        display: inline-block;
        margin-bottom: 20px;
        padding-bottom: 5px;
    }

    .author-f-name,
    .author-description-name {
        display: flex;
        gap: 10px;
    }

    .author-f-name .label,
    .author-description-name .label {
        font-weight: 700;
        font-size: 18px;
    }

    .author-f-name .data,
    .author-description-name .data {
        font-size: 17px;
        line-height: 1.6;
    }


    .data p {
        font-size: 17px;
        margin: 0;
    }
      ul#menu-footer-menu {
        border-bottom: 1px solid
    }

    ul#menu-footer-menu {
        display: flex;
        justify-content: center;
        gap: 12px 20px;
        list-style: none;
        flex-wrap: wrap;
        padding: 5px 10px;
        margin: 0;
    }

    ul#menu-footer-menu li a {
        text-decoration: none;
        color: #000;
    }

    ul#menu-footer-menu li a {
        font-size: large;
    }

    ul#menu-footer-menu li:hover a {
        color: #292323;
    }

@media only screen and (max-width: 579px) {
	   .ecomend-content-area table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}
@media only screen and (max-width: 1599px) {
.sub-menu {
    left: -94px;
}
}
/*—-------------------------------------------------------*/
@media only screen and (max-width: 991px) {

    .menu-item-has-children>a::after,
    .sub-menu .menu-item-has-children>a::after {
        display: none;
    }

    .table-auto {
        overflow-x: scroll;
        width: 100%;
    }


    *:not(.simulator) {
        scrollbar-width: thin;
    }

    .ecomend-navigationcl {
        position: absolute;
        right: 0;
        top: 100%;
        width: 100%;
        cursor: pointer;
        text-align: left;
        background: #fff;
        left: auto;
        box-shadow: 0 0 4px #ddd;
        display: none;
        padding: 14px;
        Z-index:999;
    }

    .ecomend-navbar-togglecl {
        display: block !important;
    }

    .ecomend-navbar-togglecl {
       background-color: #050104;
        width: 40px;
        height: 40px;
        position: absolute;
        top: 20px;
        right: 15px;
        text-align: center;
        cursor: pointer;
        border-radius: 3px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: transparent;
    }

    .ecomend-navbar-togglecl span {
        width: 20px;
        height: 2px;
        background-color: #fff;
        display: inline-block;
        position: relative;
        top: 7px;
        right: 0;
    }

    .ecomend-navbar-togglecl span::before,
    .ecomend-navbar-togglecl span::after {
        content: "";
        position: absolute;
        background-color: #fff;
        width: 100%;
        height: 2px;
        left: 0;
        top: -7px;
    }

    .ecomend-navbar-togglecl span::after {
        top: 7px;
    }

    .ecomend-navigationcl li {
        position: relative;
        display: inline-block;
        Padding: 0 20px;
        margin: 0;
        width: 100%;
        box-sizing: border-box;

    }


    .ecomend-navigationcl a {
        font-size: 15px;
        color: #000;
        height: auto;
        padding: 5px 10px;
        margin: 0;
        line-height: 36px;
        text-align: center;
    }

    .ecomend-navigationcl ul {
        visibility: visible;
        position: relative;
        display: block;
        left: 0;
        top: 0;
        margin: 0 !important;
        width: 100%;
        padding: 0 !important;
    }

    .ecomend-navigationcl ul a {
        height: auto;
        width: 100%;
        overflow: visible;
        line-height: 26px;
        background-image: none;
        border-width: 0;
        text-align: left;
    }

    .ecomend-navigationcl li:hover>ul {
        visibility: visible;
        top: auto;
    }

    .ecomend-toggle-menu {
        position: absolute;
        right: -7px;
        width: 40px;
        height: 30px;
        font-size: 15px;
        transform: rotate(0deg);
        text-align: center;
        top: 7px;
        cursor: pointer;
        z-index: 999;
        display: block;
        color: #000;
    }
    .ecomend-toggle-menu i {
        transition: transform 0.3s ease;
    }
 
    .ecomend-toggle-menu.on i {
        transform: rotate(180deg);
        color:#cc0201!important;
    }
    .sub-menu .ecomend-toggle-menu {
        top: 10px;
    }

    .ecomend-nav-select {
        display: inline-block;
        visibility: visible;
        width: 100%;
        text-align: left;
        margin: 0;
    }

    .sub-menu {
        display: block;
        position: relative;
        left: 0;
        background: transparent;
        width: 100%;
        text-align: left;
        padding: 0 !important;
        box-shadow: none;
        top: auto;
    }

    .sub-menu .sub-menu {
        left: 0;
        right: 0;
        top: 0;
    }

    .ecomend-nav-select .sub-menu>li>.sub-menu {
        display: block;
        position: relative;

    }

    .ecomend-nav-select .menu__list>li:hover>.sub-menu,
    .ecomend-nav-select .sub-menu>li:hover>.sub-menu {
        display: block;
    }
    img.custom-logo {
	    
	    height: 60px;
	}
	.ecomend-navbar-togglecl {
	    top: 8px;
	}


}
/* custom css */
.ecomend-navigationcl li:hover li a{
    color:#000!important;
}
.ecomend-navigationcl li:hover li a:hover{
    color:#cc0201!important;
}
.ecomend-content-area li a{
     color:#cc0201!important;
}
.ecomend-content-area li a b{
     color:#cc0201!important;
}
.su-button{
    background-color: #000!important;
    border-color: #000!important;
}
.ecomend-content-area p a{
color:#cc0201!important;
}

@media(max-width:768px){
    .date-container{
        height: 74px;
    }
}

.ecomend-navigationcl li {
    padding: 0 10px;
	 
}
ul#menu-footer-menu li a {
    font-size: 16px;
}
ul#menu-footer-menu {
    gap: 12px 10px;
/* 	  justify-content: end; */
}
ul#menu-footer-menu li.current-menu-item {
    background: #F37955;
	  border-radius: 20px;
}
ul#menu-footer-menu li:hover {
    background: #F37955;
	  border-radius: 20px;
}
.ecomend-main-header img.custom-logo {
    max-width: 180px;
    width: auto;
    height: auto;
}
ul#menu-footer-menu {
    border-bottom: none;
}
.ecomend-main-header {
    padding: 15px 0;
    box-shadow: 0 0 6px 0;
}
.ecomend-main-header a.custom-logo-link {
    line-height: 0;
    display: inline-block;
}
.ecomend-main-header div#ecomend-logo {
    line-height: 0;
    display: inline-block;
}


@media only screen and (max-width: 991px) {
    .ecomend-navbar-togglecl {
        top: 25px;
    }
	 .ecomend-navbar-togglecl {
		 background-color: transparent; 
	}
.ecomend-navbar-togglecl span::before, .ecomend-navbar-togglecl span::after, .ecomend-navbar-togglecl span {
				background-color: #000; }
.ecomend-main-header .container {
    padding: 0px;
}
.ecomend-main-header div#ecomend-logo {
    margin-left: 15px;
}
ul#menu-footer-menu {
	display: block; 
}
.ecomend-navigationcl a {
	padding: 5px 0px;
}
ul#menu-footer-menu li.current-menu-item {
    background: #F37955;
    border-radius: 20px;
    width: auto;
	  padding: 0px 15px;
}

ul#menu-footer-menu li.current-menu-item:hover {
    background: #F37955;
    border-radius: 20px;
    width: auto;
	 padding: 0px 15px;
}
.ecomend-navigationcl li {
    padding: 0px;
}
ul#menu-footer-menu li:hover {
    background: transparent;
	  border-radius: 20px;
}	
.ecomend-navigationcl {
    box-shadow: none;	
	  padding: 20px;
}	
ul#menu-footer-menu li a {
    font-size: 18px;
}	
ul#menu-footer-menu li {
    margin: 10px 0px;
}	
	
}