@charset "UTF-8";

/*
Theme Name: Twenty Twenty-One QuePasaRapaza
Theme URI: https://www.quepasarapaza.com
Author: Alberto
Author URI: https://www.quepasarapaza.com
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 5.7
Requires PHP: 5.6
Version: 1.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: twentytwentyonequepasarapaza
Template: twentytwentyone
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/**
 * Table of Contents
 *
 * 4.0 - Elements
 * 5.0 - Forms
 * 6.0 - Navigation
 *   6.1 - Links
 *   6.2 - Menus
 * 11.0 - Content
 *    11.1 - Header
 *    11.2 - Posts and pages
 *    11.3 - Post Formats
 *    11.4 - Comments
 *    11.5 - widget area / widgets
 *    11.6 - Footer
 * 12.0 - Media
 *    12.2 - Galleries
 * 14.0 - Media Queries
 *    14.1 - >= 710px
 *    14.2 - >= 783px
 *    14.3 - >= 910px
 *    14.4 - >= 985px
 *    14.5 - >= 1200px
 * 16  -  Plugins
 * 16.1 - Menú Flexible - plugin
 * 16.2 - Polylang plugin
 * 16.3 - ReCaptcha v3 
 * 17.0 Varios
 */

/*añadido para twentytwentyone-quepasarapaza*/
/**
 * 4.0 - Elements
 */
body {
	background-color: #1a1a1a;
	/* Fallback for when there is no custom background color defined. */
}

/**
* 5.0 Forms
*/
/*button,*//*Comentado porque hacia que ños botones + del menu principal salieran con color #a53903*/
.button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
      background-color: #a53903 !important;
      border: 1px solid #333333 !important;
      border-radius: 3px !important;
      color: #e1d7b7;
      margin: 2px;
      padding: 4px 14px 4px;/*padding: 8px 28px 9px;*/
}

/*button,*//*Comentado porque hacia que ños botones + del menu principal salieran con color #007acc*/
.button,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
      background-color: #007acc !important;
      border: 1px solid #333333 !important;
      border-radius: 3px !important;
      color: #e1d7b7;
      margin: 2px;
      padding: 4px 14px 4px;/*padding: 8px 28px 9px;*/
}

/**
 * 6.1 - Links
 */
/*cambiar el color de los enlaces*/
a {
	color: #333333;/*color: #007acc;*/
}

a:link {
	color: #333333;
	/*box-shadow: none;*//* no link underline */
}

a:visited {
	color: #333333;
	/*box-shadow: none;*/
}

a:hover,
a:active {
	color: #a53903;
        /*box-shadow: none;*/
}

/* Color de hover y focus en menu principal */
.primary-navigation a:hover,
.primary-navigation a:focus {
	color: #a53903 !important;
}

/* Quitar el subrrayado del menu item de la pagina en la que estamos, cambiar el color a negro y dar un poco mas de grosor */
.primary-navigation .current-menu-item > a:first-child, .primary-navigation .current_page_item > a:first-child {
    text-decoration: none;
    color: #000000;
    font-weight: 500;
}

.site-footer a:hover,
.site-footer a:focus {
	color: #a53903 !important;
}

a.link-de-contenido {color: #a53903 !important;}

a.link-de-contenido:link {color: #a53903 !important;}

a.link-de-contenido:visited {color: #333333 !important;}

a.link-de-contenido:hover {color: #333333 !important; text-decoration: none;}

a.link-de-contenido:active {color: #333333 !important;}

a.link-de-contenido:focus {color: #333333 !important;}

/*FIN cambiar el color de los enlaces*/


/**
 * 6.2 - Menus
 */

/*para bajar el menu principal, estaba centrado verticalmente*/

.primary-navigation > div > .menu-wrapper {
     margin: 0;
    height: 35px;
}
.primary-navigation > div > .menu-wrapper li {
    height: 35px;
}

.primary-navigation a {
    padding: 0 2rem 0.2rem 0 !important;
    text-decoration: none;
    color: #222 !important;
    line-height: 2 !important;
}

/*FIN para bajar el menu principal, estaba centrado verticalmente*/

/*Cambiar el color del borde de las cajas de submenus*/
.primary-navigation .sub-menu {
    /*margin: 0;
    padding: 0;
        padding-top: 0px;
    list-style: none;
    margin-left: var(--primary-nav--padding);
    border: 1px solid var(--primary-nav--border-color);*/ /*lo que esta en la hoja de estilos del tema padre*/
    border: 1px solid #a53903; /*añadido*/
}
/*FIN Cambiar el color del borde de las cajas de submenus*/

/*Cambiar el color de fondo de las cajas de submenus*/
.primary-navigation > div > .menu-wrapper > li > .sub-menu li {
    /*background: var(--global--color-background);*//*el del tema padre*/
    background: #e1d7b7;/*añadido*/  
}
/*FIN Cambiar el color de fondo de las cajas de submenus*/

/*post navigation*/
.post-navigation {border-bottom: 0;border-top: 0;clear: both;}
.post-navigation .post-title {font-size: 15px !important; font-weight: 100;}
.post-navigation a {color: #a53903;}
.post-navigation a:hover .post-title, .post-navigation a:focus .post-title {color: #333333;}
.post-navigation .meta-nav {color: #a53903;}
.post-navigation div + div {border-top: 1px dotted #a53903;}
.comments-title, .comment-reply-title {border-top: 1px dotted #a53903; font-size: 1.3rem; font-weight: 400; line-height: 1.2; padding-top: 1em;}

/* Quitar la fecha y autor de: footer / div class posted-by / span class posted-on y span class byline y footer / div class post-taxonomies / span class cat-links y span class tags-links */
.single .site-main > article > .entry-footer .posted-on, .single .site-main > article > .entry-footer .byline, .single .site-main > article > .entry-footer .cat-links/*, .single .site-main > article > .entry-footer .tags-links**esto comentado pertenece al tema padre*/ {
    display: none;/*display: block;*//*cambiado el valor del tema padre*/
}
/*FIN post navigation*/

.pagination {
	min-height: 32px;/*antes 56px*/
        padding: 0 0 0 20px;/*añadido*/
        margin: 0 0 0 0;/*añadido*/
        font-size: 1em;
}

.pagination:before,
.pagination:after {
        background-color: #e1d7b7;
        height: 32px;
        width: 32px;
}

.pagination a:hover,
.pagination a:focus {
        color: #ffffff;/*color: #333333;*/
}

.pagination .nav-links:before,
.pagination .nav-links:after {
	font-size: 22px;/*era 32px*/
	line-height: 31px;/*era 51px*/
	width: 32px;/*era 52px*/
}

.pagination .nav-links:before {
        right: 10px;/*mueve horizontalmente la flecha -> no activa*/
}

.pagination .nav-links:after {
        right: 45px;/*mueve horizontalmente la flecha <- no activa*/
}

/* reset screen-reader-text */  
.pagination .current .screen-reader-text {
        position: absolute !important;/*del media query para >= 710px*/
}

.pagination .page-numbers {
        display: inline-block;/*del media query para >= 710px*/
        letter-spacing: 1em;
        margin: 0 0 0 0;
        padding: 0 0 0 0;
}

.pagination .current {
	font-size: 1em;/*añadido*/
}

.pagination .prev,
.pagination .next {
        background-color: #e1d7b7; /*background-color: #333333;*/
        height: 32px;
        width: 32px;
        padding: 0 50px 0 0;/*añadido*/
}

.pagination .prev:before,
.pagination .next:before {
        font-size: 22px;
        height: 33px;
        line-height: 32px;
        width: 33px;
        right: -10px;/*añadido para mover a la dech la flecha -> activa*/
}

.pagination .prev:hover,
.pagination .prev:focus,
.pagination .next:hover,
.pagination .next:focus {
        background-color: #e1d7b7;
}

.pagination .prev {
        right: 34px;
}

.pagination .prev:before {
        left: 12px;
}

.paging-navigation .page-numbers.current {
	border-top: 5px solid #063f2d !important;/*border-top: 5px solid #24890d;*/
}


/**
 * 11.0 - Content
 */
.site {
	background-color: #1a1a1a;
}

.site-main {
      background-color: #e1d7b7;
      margin-bottom: 0;
      padding-bottom: 5px;
}
.site-content {
      margin: 0 auto;
      padding: 0;
      background-color: #e1d7b7;
}

.site-content .entry-content, .site-content .entry-summary, .page-content {
    background-color: #e1d7b7;
    color: #333333;
}

.content-area {
      margin-right: 0;
      width: 100%;
      background-color: #e1d7b7;
}
.entry-content {
      background-color: #e1d7b7;
      /*float: left;*/
      min-width: 100%;
      padding: 0 5% 0 5%;
      margin: 0 !important;
}

/**
 * 11.1 - Header
 */
.site-header {
       padding: 0.3% 0 0 0; /*es un acolchado para que el logo no quede pegado arriba*/
       height: 100%; /*altura para que no se desborde el contenido*/
    border-width: 0 0 1px 0; /*anchura del borde. 0 superior, 0 derecha, 1pixel inferior, 0 izquierda*/
    border-style: dotted; /*estilo del borde, puede ser solid (linea continua), dotted (puntitos) y otros*/
    border-color: #a53903; /*color del borde, el marroncito*/
    margin: 0 0 0 0; /*sin margen (los valores siempre van en este orden: arriba, derecha, inferior e izquierda)*/
    background-color: #e1d7b7; /*color del fondo*/
    min-width: 100%; /*ancho mínimo*/
}

.site-branding {
   margin-left: 0;
}

.primary-navigation {
    height: 35px;
}

.site-header-main {
       padding: 0 10px 0 0;
       height: 70px;
}

.site-description {
      display: none;
}

.menu-toggle {
     display: none;
}

.custom-logo {
    margin: 0 !important;
}

.site-logo {
    margin: 0;
    padding: 0 !important;
    border-bottom: 0 !important;
}

/**
 * 11.2 - Posts and pages
 */
/*quitar el titulo de paginas*/
.entry-header {
    display: none;
}

.entry-footer {
    display: none;
}

.entry-summary {margin-left: 2%;} /*resultados de las busquedas con algo de margen a la izquierda*/

.post-thumbnail {
      display: none;
}

.page-header {
display: none;/*para que no salga el nombre de las categorias, por ejemplo: Categoria: Taller*/
margin: 0;
padding-top: 0;
}

/**
 * 11.4 - Comments
 */
.comments-area {
      width: 90%;
      margin: 0 5% 0 5% !important;
}

/**
* 11.5 - Widget Area
*/

/* From parent theme */
.widget-area {
    margin-top: calc(.05 * var(--global--spacing-vertical));
    padding-bottom: calc(var(--global--spacing-vertical) / 3);
    color: var(--footer--color-text);
    font-size: var(--footer--font-size);
    font-family: var(--footer--font-family);
    background-color: #e1d7b7; /* Añadido */
    max-width: none; /* Añadido */
}
.widget-area, .site-footer {
padding: calc(var(--global--spacing-vertical) / 2) 1rem calc(var(--global--spacing-vertical) / 2) 2.5rem;
}


@only screen and (min-width: 1024px) {
.widget-area { grid-template-columns: repeat(3, 1fr); }
}

@only screen and (min-width: 652px) {
.widget-area { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: calc(2 * var(--global--spacing-horizontal)); }
}

/*cambiar la posicion relativa de los widgets y cambiar el color y poner borde*/
.widget {
color: #333333;
/*margin: 0 1rem 0 1rem !important;*/
/*margin-top: 4px;
margin-bottom: 12px;*/
margin-bottom: 4px !important;
border:1px dotted #a53903;
background-color: #e1d7b7;
padding: 4px;
/*margin-left: 1rem;
margin-right: 1rem;*/
width: 94%;/*NO FUNCIONO CON PANTALLA >= 1100px*/ /* Para que no se desbordara el widget por la izquierda debido a la hoja css inyectada (section {width: 100%}*//*tambien vale el 94%  /  35.2rem*/
}

.widget-area a:link, .widget-area a:visited, .widget-area a:active {
    /*color: var(--footer--color-link);*/
    font-size: 1rem !important;
}

.widget ul {
list-style: outside none none;/*el ultimo parametro "none" es el valor del bullet - antes era "disc"*/
}

/*cambiar el color de los titulos de los widgets*/
.widget-title {
color: #333333;
margin-bottom: 2px !important;
}

/*cambiar el color de los items/links de los widgets*/
.widget a:link {
color: #a53903;
}

.widget a:visited {
color: #a53903;
}

.widget a:hover {
color: #333333;
}

.widget a:active {
color: #333333;
}

/*cambiar el widget de buscar*/
.widget input, .widget textarea {
  border-color:rgba(0, 0, 0, 0.498039);
  color:#333333;
}

/**
* 11.6 -Footer
*/
/*.site-footer .site-title::after, */.site-footer .site-title::after {
	content: "\002d";
        color: #222222;
}

.site-title, .site-title a {
display: none;
}*/

.site-title-no, .site-title-no a {color: #222222 !important; text-transform: none; font-size: 1rem; text-decoration: none; /*line-height: var(--global--line-height-heading);*/}

.site-title a:visited {color: #ffffff;}/*.site-info a:visited {color: #ffffff;}*/

.site-title a:hover {color: #a53903;}/*.site-info a:hover {color: #a53903;}*/

/*cuando se quiere quitar el guion de separacion entre los elementos del footer <span class="site-title-no"> en footer.php*/
.site-footer .site-title-no::after, .site-footer .site-title-no::after {
	/*content: "\002d";*/
}
/*FIN cuando se quiere quitar el guion de separacion entre los elementos del footer <span class="site-title-no"> en footer.php*/

/* Mueve el social nav dentro del footer */
.site-footer > *, .widget-area > * {
    margin-top: 0;/*margin-top: calc(0.666 * var(--global--spacing-vertical));*/
    margin-bottom: 0;/*margin-bottom: calc(0.666 * var(--global--spacing-vertical));*/
}

/* contenedor de menu social se añade color de fondo de la pagina. antes era transparente */
.footer-navigation-wrapper {
    /***display: flex;
    justify-content: center;
    flex-wrap: wrap;
    list-style: none;
    padding-left: 0;***//*codigo del tema padre*/
    background-color: #e1d7b7;/*Añadido*/
}

.site-footer > .site-info {
    /*padding-top: var(--global--spacing-vertical);
    color: var(--footer--color-text);
    font-family: var(--footer--font-family);
    font-size: var(--footer--font-size);
    line-height: var(--global--line-height-body);*/
    border: 1px dotted #a53903;/*border-top: 3px solid var(--global--color-border);*/
    width: 100%; /* Añadido */
    margin: 0; /* Añadido */
    padding: 0; /* Añadido */
    background-color: #e1d7b7; /* Añadido */
    height: 40px; /* Añadido */
}

/* Quitar el logo del footer */
.site-footer > .site-info .site-name {
    /*text-transform: var(--branding--title--text-transform);
    font-size: var(--branding--title--font-size);*/
    display: none !important; /* Añadido */
}

/*cambiar el color del background footer y añadir borde*/
.site-footer {
        margin: 0 auto;
        max-width: none; /*max-width: 3840px;*//*max-width: 2000px;*//*max-width: 1320px;*/
        background-color: #e1d7b7;
        border-top: 1px dotted #a53903;
        border-right: 0;
        border-left: 0;
        border-bottom: 0;
        height: 40px;
        padding: 0.15em 0 1.75em !important;
}
/*FIN cambiar el color del background footer y añadir borde*/

/*cambiar el alto de la barra inferior del footer cambiando el padding centrar la informacion del footer*/
.site-info {
        height: 30px;
        /*margin: 3em auto 0.538462em 0;*/
        order: 1;
        padding: 2px;
        text-align: center;
}
/*FIN cambiar el alto de la barra inferior del footer cambiando el padding centrar la informacion del footer*/


/**
*17.0 Varios
**/
/*cambiar color y fondo de textos selecionados*/
::selection {
	background: #999999;
	color: #000;
	text-shadow: none;
}

::-moz-selection {
	background: #999999;
	color: #000;
	text-shadow: none;
}
/*FIN cambiar color y fondo de textos selecionados*/



/*ampliar el area de comentarios*/
.comments-area {
 /* margin:48px auto;*/
  max-width:90%;
  /*padding:0 10px;*/
}

/*cambiar el color del titulo de paginas y pagina de archivos-categorias*/
.archive-title, .page-title {
    color: #95805b !important;
    /*font-size: 16px;
    font-weight: 900;
    line-height: 1.5;
    margin: 0;*/
}
/*FIN cambiar el color del titulo de paginas y pagina de archivos-categorias*/


/*Centrar las flechas de navegacion en single post de uno a otro dentro de la misma categoria*/
.same-cat-post-nav a {
    text-align: center !important;
    padding-left: 10% !important;
    padding-right: 10% !important;
    width: 10% !important;
    margin: 0 10% 0 10% !important;
}


div .wp-caption {
/*width: 610px !important;*/
width: 95% !important;
float:left !important;
margin-left:0px !important;
border: 1px solid rgba(0, 0, 0, 0.9);
}

.wp-caption img {
width: 44% !important;
height: 44% !important;
padding: 3% !important;
}


.wp-caption-text {
    float: left !important;
    /*box-sizing: border-box;
    font-size: 12px;
    font-style: italic;
    line-height: 1.5;*/
    margin: 0% auto 2% auto !important;
    width: 98% !important;
    text-align: center !important;
    /*height: 20% !important;*/
}

/**
 * 14.0 - Media Queries
 */