/*   
Theme Name: Converses
Description: Un tema desarrollado para ACAF
Author: Gmno
Version: 1.70
*/


body {margin: 0; padding: 0; font-family: 'Inter', sans-serif;}
#content {width: 90%; margin: 0 auto; max-width: 1060px;}
h1 {color: #0079b4;  font-weight: 700; font-size: 28px; line-height: 120%; padding:0; margin: 0;}
h5 {color: #0079b4;  font-weight: 600; font-size: 20px; line-height: 120%; padding:0; margin: 50px 0 0 0;}
p {color: #0079b4;  font-weight: 500; font-size: 20px; line-height: 140%; }
.footer p {color: #0079b4;  font-weight: 500; font-size: 16px; line-height: 120%;}
a {color: inherit;}
.header {display: grid; grid-template-columns: 8fr 5fr; column-gap: 20px; padding-top: 72px;}
.header > div:last-of-type {justify-content: flex-end; display: grid; margin-top: 6px;}
.header > div:first-of-type {display: grid; grid-template-columns: min-content min-content max-content;}
.header > div > div:last-of-type {display: grid; grid-template-columns: max-content max-content; column-gap: 20px; ; }
.header > div > div:last-of-type a { text-decoration: none; color: #CD1719;  font-weight: 600; font-size: 16px; line-height: 120%; text-transform: uppercase; }
.logo { margin-top: -10px;}
.logo img {width: 225px;}
.barra {margin-top: -14px; padding-left: 5px; padding-right: 5px;}
.barra img {width: 21px;}
.tagname{ font-size: 24px; line-height: 120%; color: #CD1719; font-weight: 600;}
.subheader {display: grid; grid-template-columns: 8fr 5fr; column-gap: 20px; padding-top: 98px;}
.subheader > div:first-of-type > div {display: grid; grid-template-columns: max-content max-content max-content; column-gap: 72px;}
.subheader > div:first-of-type >div  a { text-decoration: none; color: #CD1719;  font-weight: 600; font-size: 16px; line-height: 120%; text-transform: uppercase; }
.search {display: grid; grid-template-columns: max-content auto;}
.search img { width:16px;}
.search > div:last-of-type {border-bottom: 2px solid #CD1719;}
.wp-block-image figcaption {color: #0079b4;}
ul {}
li {font-weight: 500; font-size: 20px; line-height: 120%; color: #0079b4; padding-bottom: 16px;}
div.etiquetes {
    box-sizing: border-box;
    list-style: none;
    padding-top: 35px;

    padding-left: 0;
    color: #0079b4;  font-weight: 600; font-size: 16px; line-height: 120%; text-transform: uppercase;

}
div.etiquetes div {padding-right: 20px; float: left; font-size: 16px; line-height: 120%; text-transform: uppercase; }
div.etiquetes div a {text-decoration: none;}
.content {padding-top: 90px;}
.single_cap {display: grid; grid-template-columns: 8fr 5fr; column-gap: 20px; padding-top: 36px; padding-bottom: 25px; clear: both;}
.single_cap > div:first-of-type > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.social {display: flex; column-gap: 36px; align-self: flex-end;}
.social img, .compartir img {height: 30px;}
.compartir  {display: flex; column-gap: 24px;}
.compartir p { padding: 0; color: #0079b4;  font-weight: 600; font-size: 16px; line-height: 120%;}
p.comment-reply-title {margin: 0; padding: 0;}

.single_cap > div:last-of-type {border: 4px solid #0079b4; padding: 20px 32px 32px 32px; display: grid; grid-template-rows: max-content max-content max-content auto;}
.single_cap > div:last-of-type > div:nth-of-type(2) p {color: #0079b4;  font-weight: 500; font-size: 24px; line-height: 120%; padding:0; margin: 10px 0 0 0;}
 .post_data {margin-top: 60px;}
.peu_post {display: grid; grid-template-columns: 5fr 8fr; column-gap: 20px; padding-top: 85px;}
.footer {display: grid; grid-template-columns: 8fr 5fr; column-gap: 20px; row-gap: 20px; padding-top: 100px; padding-bottom: 50px; align-items: flex-end;}
.footer > div:last-of-type {justify-self: flex-end;}
.footer p {color: #0079b4;  font-weight: 500; font-size: 16px; line-height: 140%;}
.footer p a {text-decoration: none; color: inherit;}

.comment-notes {display: none;}
.comment-form-comment label {display: none;}
.comment-form-author, .comment-form-email {font-weight: 500; font-size: 16px; line-height: 120%;}
textarea {-webkit-appearance: textarea;
    color: text;
    background-color: -webkit-control-background;
    border-top-width: 0;
    border-right-width: 0;
    border-bottom-width: 2px;
    border-left-width: 0;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: initial;
    border-right-color: initial;
    border-bottom-color: #0079b4;
    border-left-color: initial;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
    -webkit-rtl-ordering: logical;
    -webkit-user-select: text;
    padding-top: 2px;
    flex-direction: column;
    resize: auto;
    cursor: auto;
    white-space: pre-wrap;
    word-wrap: break-word;
width: 100%;}
.logged-in-as {display: none;}
h3.comment-reply-title::after {content: url(https://converses.centreacaf.org/wp-content/themes/converses/imatges/comentar.png); padding-left: 8px;
}

input:is([type="button"], [type="submit"], [type="reset"]), input[type="file"]::file-selector-button, button {
    align-items: flex-start;
    text-align: center;
    cursor: default;
    color: buttontext;
    padding-top: 16px;
    padding-right: 32px;
    padding-bottom: 16px;
    padding-left: 32px;
    border-top-width: 2px;
    border-right-width: 2px;
    border-bottom-width: 2px;
    border-left-width: 2px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: #0079b4;;
    border-right-color: #0079b4;;
    border-bottom-color: #0079b4;;
    border-left-color: #0079b4;;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
    background-color: #fff;
    box-sizing: border-box;
    font-weight: 500; font-size: 20px; line-height: 120%;
    color:#0079b4;
    cursor: pointer;
}
#comment {color: #0079b4;     font-weight: 500; font-size: 16px; line-height: 120%;}
h3.comment-reply-title, h3#comments {color: #0079b4;     font-weight: 500; font-size: 20px; line-height: 120%; padding: 0; margin: 0;}
ol.commentlist {display: block; text-transform: unset; padding-left: 0; list-style: none;}
ol.commentlist a {text-decoration: none; color: inherit;}
ol.commentlist li {padding-left: 0;}
ol.commentlist li.comment {margin-bottom: 40px; border-top: 1px solid #0079b4; padding-top: 20px;}
ul.children{padding-left: 20px; text-transform: unset;}
ul.children  li.comment {margin-top: 20px; border-top: 0;}
.comment-author img { display: none;}
.comment-author, .comment-meta {font-weight: 400;}
.comment-respond a {text-decoration: none; color: #0079b4;}
a#cancel-comment-reply-link{ text-decoration: underline;}
a.comment-reply-link{ text-decoration: underline !important;}

ol.commentlist li:last-of-type.comment {
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-top: 1px solid #0079b4;
    border-bottom: 1px solid #0079b4;
    padding-top: 20px;
    list-style: none;
}
ol.commentlist ul.children li {

    padding-bottom: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;

}

input#author, input#email {
border-bottom: 1px solid #0079b4 !important;
border-top: 0; border-left: 0; border-right: 0;
font-weight: 500; font-size: 16px; line-height: 120%;
color:#0079b4;
width: 100%;
margin-top: 20px;
}
.footer > div:first-of-type{display: flex; column-gap: 36px; }
.footer > div:first-of-type img {height: 125px;}
.footer > div:first-of-type img:last-of-type {height: 110px; margin-top: 15px;}


.articles {display: grid; grid-template-columns:repeat(13,1fr); column-gap: 20px; row-gap: 20px; padding-top: 36px; clear: both;}
.articles > div {border: 4px solid #0079b4;

    display: grid;
    grid-template-rows: max-content max-content 1fr auto;}
    .articles > div > div:first-of-type {padding: 20px 32px 0 32px;}
.articles > div > div {padding: 0 32px 0 32px;}
.articles > div > div:last-of-type {padding: 0;}
.articles > div:nth-child(5n+1) {grid-column: 1 / 9; }
.articles > div:nth-child(5n+2) {grid-column: 9 / 14; }
.articles > div:nth-child(5n+3) {grid-column: 1 / 6; }
.articles > div:nth-child(5n+4) {grid-column: 6 / 14; }
.articles > div:nth-child(5n) {grid-column: 1 / 14; }

.articles-modul img { height: 30px;}
.articles-modul {display: flex; column-gap: 36px; align-items: center; align-self: flex-end; margin-bottom: 18px; margin-top: 18px;}
.articles-modul p {font-weight: 600; font-size: 16px; line-height: 120%;}
.articles-modul p a {text-decoration: none; color: inherit;}
.articles-ft {align-self: flex-end;}
.articles-ft img {width: 100%; height: 140px; object-fit: cover; object-position: center center; display: block;}
.articles > div > div > p {margin: 0; padding: 0;}
.articles > div > div > h1 {font-weight: 700; font-size: 28px; line-height: 120%;}
.articles > div > div > h1 a {text-decoration: none; color: inherit;}
.articles > div > div:nth-of-type(2) > p {font-weight: 400; font-size: 24px; line-height: 120%; margin-top: 16px;}

ul li a {text-decoration: none; color: inherit;}

.eti-post { margin-top: 30px; text-transform: uppercase;}
.eti-post > div {margin-bottom: 72px;}
.eti-post h1 a {text-decoration: none;}
.eti-post p {margin: 0; padding: 0; font-weight: 500; font-size: 16px; line-height: 140%;}
.eti-post > p:first-of-type {font-weight: 600; margin-bottom: 36px;}

.search-field {
    font-weight: 500;
    font-size: 16px;
    line-height: 120%;
    border: none;
    width: 100%;
    padding-left: 16px;
    color: #CD1719;
}
textarea:focus, input:focus{
    outline: none;
}
*:focus {
    outline: none;
}


@media only screen and (max-width: 1400px) {

    .header > div > div:last-of-type a, .subheader > div:first-of-type >div a,  div.etiquetes, .articles-modul p, .footer p, div.etiquetes div, .compartir p, .comment-form-author, .comment-form-email {

        font-size: calc(14px + 0.139vw);

    }

    .tagname  {
        font-size: calc(18px + 0.278vw);
    }
    input:is([type="button"], [type="submit"], [type="reset"]), input[type="file"]::file-selector-button, button {
        font-size: calc(16px + 0.278vw);
    }
    p, li, h5, h3.comment-reply-title, h3#comments{ font-size: calc(16px + 0.278vw);}

    .logo img {
        width: calc(175px + 3.472vw);
    }

    .articles > div > div > h1, h1 {
        font-size: calc(24px + 0.278vw);
    }

    .articles > div > div:nth-of-type(2) > p {
        font-size: calc(20px + 0.278vw);
    }
    .articles-modul img {
        height: calc(24px + 0.278vw);
    }
}

@media only screen and (max-width: 890px) {

    .header,  .subheader > div:first-of-type > div, .subheader {
        grid-template-columns: 1fr;
    }
    .header > div:last-of-type {
        justify-content: flex-start;

    }
    .search {

        padding-top: 36px;
    }
    .articles {

        grid-template-columns: 1fr;

    }
    .articles > div:nth-child(5n+1) {grid-column: unset; }
.articles > div:nth-child(5n+2) {grid-column: unset; }
.articles > div:nth-child(5n+3) {grid-column: unset; }
.articles > div:nth-child(5n+4) {grid-column: unset; }
.articles > div:nth-child(5n) {grid-column: unset; }

.footer {

    grid-template-columns: 1fr;

}
.footer > div:last-of-type {
    justify-self: flex-start;
}
.subheader {



    padding-top: 0;
}
.header > div > div:last-of-type {

    grid-template-columns: 1fr;

}
.single_cap {

    grid-template-columns: 1fr;


}.single_cap > div:last-of-type {

    margin-top: 20px;
}
.social {
margin-top: 36px;
}
.peu_post {

    grid-template-columns: 1fr;

}
h3.comment-reply-title::after {display: none;}
h3.comment-reply-title::before {
    content: url(https://converses.centreacaf.org/wp-content/themes/converses/imatges/comentar.png);
    padding-right: 18px;
}
.comentar {margin-top: 36px;}
}
@media only screen and (max-width: 550px) {

    .footer > div:first-of-type img:last-of-type {
        height: 80px;
        margin-top: 10px;
    }
    .footer > div:first-of-type img {
        height: 90px;
    }
    .header {

        padding-top: 48px;
    }
    .header > div:first-of-type {
        display: grid;
        grid-template-columns: 1fr;
    }
    .barra img {
        padding-top: 20px;

    }
    .single_cap {

        grid-template-columns: 1fr;


    }

}

@media only screen and (max-width: 380px) {

    .footer > div:first-of-type {
        display: grid;

    }
    .barra img {
        width: 16px;
    }
    .header > div:last-of-type {

        margin-top: 16px;
    }
}