/*----------- ABOUT US -----------*/

.bg-about{
    width: 100%;
    padding: 255px 0 95px;
    /* background-size: cover;
    background-position: left; */
    /* background-image: url(../img/home/BG-HUELLA-LEFT.svg); */
}

.content_about_us{
    width: 81%;
    max-width: 1300px;
    margin: 0 auto;
}

.desc_about{
    width: 100%;
    margin-bottom: 35px;
}

.desc_about h2{
    font-size: 29px;
    font-weight: 500;
    margin-bottom: 25px;
    color: var(--title-color);
    font-family: var(--primary-font);
}

.desc_about h3{
    font-size: 29px;
    font-weight: 500;
    margin-bottom: 25px;
    color: var(--title-color);
    font-family: var(--primary-font);
}

.desc_about p{
    font-size: 16px;
    line-height: 17px;
    color: #666666;
    margin-bottom: 11px;
    text-align: justify;
}

.btn_about_us{
    width: fit-content;
    display: flex;
    align-items: center;
    color: #FFFFFF;
    font-size: 14px;
    padding: 14px 25px;
    margin: 37px auto 0;
    font-weight: 700;
    transition: 0.3s;
    border-radius: 50px;
    text-decoration: none;
    border: 1px solid transparent;
    background-color: #f28b2f;
}

.btn_about_us:hover{
    color:#f28b2f;
    border: 1px solid #f28b2f;
    background-color: transparent;
}

.btn_about_us:hover i{
    color: #f28b2f;
}

.btn_about_us i{
    color: #FFFFFF;
    font-size: 23px;
    margin-left: 7px;
    transition: 0.3s;
    transform: rotate(23deg);
}

.desc_about a{
    display: none;
}

.img_about{
    width: 100%;
}

.img_about img{
    display: block;
    width: 100%;
}

/*----------- ABOUT US -----------*/

/*----------- ADOPTAME -----------*/

.bg_adoptame{
    width: 100%;
    padding: 55px 0;
    /* background-size: cover;
    background-position: center;
    background-size: cover;
    background-position: left; */
    /* background-color: #fff7ef; */
    background-color: #FFFFFF;
    /* background-image: url(../img/home/BG-HUELLA-HUESO.svg); */
}

.content_adoptame{
    width: 81%;
    max-width: 1300px;
    margin: 0 auto;
}

.title_adop{
    width: 100%;
    margin: 0 auto 55px;
}

.title_adop h2{
    font-size: 29px;
    color: var(--title-color);
    line-height: 41px;
    text-align: center;
    font-weight: 500;
    font-family: var(--primary-font);
}

.item__adoptame p{
    font-size: 16px;
    text-align: justify;
    color: #666666;
}

.item__adoptame h2{
    font-size: 29px;
    line-height: 41px;
    text-align: center;
    font-weight: 500;
    margin-bottom: 35px;
    font-family: var(--primary-font);
}

.item__adoptame h3{
    font-size: 21px;
    font-weight: 500;
    color: #000000;
    text-align: center;
    margin: 41px 0 33px;
    font-family: var(--second-font);
    /* font-family: var(--primary-font); */
}

.item__adoptame img{
    display: block;
    width: 100%;
}

.btn__adoptame{
}

.info-boxes-adoptame{
    width: 89%;
    margin: 0 auto 51px;
}

.info-boxes-adoptame .info-box{
    padding: 17px 23px;
}

/* .btn__adoptame a{
    position: relative;
    display: block;
    width: 100%;
    padding: 37px 30px 23px 30px;
    margin-top: 47px;
    font-size: 19px;
    color: #FFFFFF;
    font-weight: 700;
    border-radius: 8px;
    text-align: center;
    border: 2px solid #f28b2f38;
    text-decoration: none;
    transition: 0.3s;
    background-color: #f28b2f;
}

.btn__adoptame a:hover{
    color: #f28b2f;
    background-color: #FFFFFF;
    border: 2px solid #f28b2f;
}

.btn__adoptame a:hover .icon__adoptame{
    background-color: #f28b2f;
}

.btn__adoptame a:hover .icon__adoptame i{
    color: #FFFFFF;
} */

.icon__adoptame{
    position: absolute;
    top: -25px;
    left: 0;
    right: 0;
    display: table;
    padding: 12px;
    border-radius: 50%;
    margin: 0 auto;
    transition: 0.3s;
    background-color: #FFFFFF;
}

.icon__adoptame i{
    font-size: 23px;
    color: #f28b2f;
    transition: 0.3s;
}

.content_adoptame .info-box{
    background-color: #5b150fd9;
}

.content_adoptame .info-box .info-title{
    color: #FFFFFF;
}

/*----------- ADOPTAME -----------*/

/*----------- IMG LOVE -----------*/

.bg-love{
    width: 100%;
    padding: 55px 0 0;
    background-color: #FFFFFF;
}

.content__love{
    width: 85%;
    max-width: 1700px;
    margin: 0 auto;
}

.content__love img{
    display: block;
    width: 100%;
}

/*----------- IMG LOVE -----------*/


/*----------- AYUDADOS -----------*/

.bg_content_ayudados{
    width: 100%;
    padding: 77px 0px;
    position: relative;
    background-size: cover;
    background-position: center;
    background-image: url(../img/ayudados/BG_AYUDADOS.jpg);
}

.content_ayudados{
    width: 85%;
    max-width: 1700px;
    margin: 0 auto;
    position: relative;
}

.overlay_ayudados{
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    background-color: #333333;
    opacity: 0.85;
}

.title_ayuda{
    width: 100%;
    font-size: 29px;
    color: #fff7ef;
    font-weight: 100;
    line-height: 1.1em;
    margin-bottom: 25px;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--second-font);
}

.title_ayuda b{
    color: #f28b2f;
    font-weight: 500;
    font-family: var(--second-font);
}

.item_ayudados{
    margin-top: 35px;
    text-align: center;
    padding: 0 73px;
}

.item_ayudados h3{
    font-size: 45px;
    margin-bottom: 9px;
    color: #fff7ef;
    font-family: var(--second-font);
}

.item_ayudados p{
    font-size: 18px;
    color: #fff7ef;
}


/*----------- AYUDADOS -----------*/

/*----------- EVENTOS -----------*/

.bg_content_eventos{
    padding: 55px 0;
    background-color: #40956b;
}

.content_eventos{
    width: 81%;
    max-width: 1700px;
    margin: 0 auto;
}

.title_eventos h2{
    width: 100%;
    font-size: 29px;
    font-weight: 500;
    text-transform: uppercase;
    color: #fff7ef;
    font-family: var(--second-font);
}

.title_eventos h2 span{
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 29px;
    margin-top: 9px;
    font-weight: 500;
    text-transform: initial;
    color: #fff7ef;
    font-family: var(--primary-font);
}

.btn_eventos a{
    display: inline-block;
    color: #40956b;
    font-size: 16px;
    padding: 18px 25px;
    margin-top: 35px;
    font-weight: 500;
    transition: 0.3s;
    border-radius: 50px;
    border: 1px solid transparent;
    text-decoration: none;
    text-transform: uppercase;
    background-color: #fff7ef;
    font-family: var(--second-font);
}

.btn_eventos i {
    color: #40956b;
    font-size: 23px;
    margin-left: 7px;
    transition: 0.3s;
    transform: rotate(23deg);
}

.btn_eventos a:hover{
    color: #fff7ef;
    border: 1px solid #fff7ef;
    background-color: transparent;
}

.btn_eventos a:hover i{
    color: #fff7ef;
}

/* GALLERY */

.content_gallery_eventos{
    width: 100%;
}

.item_gallery_eventos{
    width: 100%;
    position: relative;
}

.item_gallery_eventos img{
    display: block;
    width: 100%;
}

.info_gallery_eventos{
    width: 85%;
    position: absolute;
    bottom: 29px;
    left: 25px;
    z-index: 9;
}

.info_gallery_eventos h2{
    font-size: 29px;
    color: #fff7ef;
    font-weight: 500;
    margin-bottom: 10px;
    line-height: 25px;
    font-family: var(--second-font);
    text-shadow: 5px 4px 10px #000000b8;
}

.info_gallery_eventos p{
    position: relative;
    font-size: 16px;
    color: #FFFFFF;
    margin-bottom: 5px;
    padding-left: 21px;
}

.info_gallery_eventos p img{
    position: absolute;
    left: 0;
    top: 1px;
    width: 13px;    
}

/*----------- EVENTOS -----------*/

/*----------- CAUSAS -----------*/

.content_causas{
    width: 85%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 55px 0;
}

.title_causas{
    width: 100%;
    font-size: 29px;    
    line-height: 1.1em;
    text-align: center;
    font-weight: 500;
    color: var(--title-color);
    font-family: var(--primary-font);
}

.item_causas {
    width: 89%;
    text-align: center;
    margin: 55px auto 0;
    padding: 31px 33px;
    transition: 0.3s;
    border-radius: 10px;
    background-color: #FFFFFF;
    /* border: 1px solid #f28b2f38; */
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1);
}

/* .item_causas:hover{
    border: 1px solid #f28b2f;
} */

.item_causas:hover h2{
    color: #f28b2f;
}

/* .item_causas:hover .icon_causa{
    background-color: #f28b2f;
} */

/* .item_causas:hover .icon_causa i{
    color: #FFFFFF;
} */

.icon_causa{
    width: 61px;
    margin: 0 auto 15px;
}

.icon_causa img{
    display: block;
    width: 100%;
}

.item_causas h2{
    font-size: 24px;
    margin-bottom: 25px;
    font-weight: 500;
    transition: 0.3s;
    font-family: var(--second-font);
}

.item_causas p{
    font-size: 16px;
    color: #666666;
}

/*----------- CAUSAS -----------*/

@media screen and (min-width: 768px){

/*----------- ABOUT US -----------*/

    .desc_about h2 {
        font-size: 43px;
    }

    .bg-about {
        width: 100%;
        padding: 93px 0 95px;
    }

/*----------- ABOUT US -----------*/

/*----------- ADOPTAME -----------*/

    .title_adop{
        margin: 0 auto 49px;
    }

    .title_adop h2{
        font-size: 43px;
        line-height: 67px;
    }

    .content_adoptame{
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }

    .item__adoptame h2{
        font-size: 43px;
        line-height: 67px;
    }

    .btn__adoptame{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .item__adoptame h3 {
        width: 100%;
        margin: 41px 0 11px;
    }

    .btn__adoptame a {
        width: 32%;
    }

    .info-boxes-adoptame{
        width: 100%;
        display: flex;
        justify-content: space-between;
    }



/*----------- ADOPTAME -----------*/


/*----------- AYUDADOS -----------*/

    .title_ayuda{
        font-size: 43px;
    }

    .medidas_ayudados{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .item_ayudados{
        width: 23%;
        padding: 0;
        margin: 0;
    }

/*----------- AYUDADOS -----------*/

/*----------- EVENTOS -----------*/

    .bg_content_eventos {
        padding: 87px 0;
    }

    .content_eventos{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .title_eventos{
        width: 59%;
        max-width: 697px;
    }

    .title_eventos h2{
        font-size: 35px;
    }

    .btn_eventos a{
        margin: 0;
    }

    /* GALLERY */

    .content_gallery_eventos{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .item_gallery_eventos{
        width: 50%;
        position: relative;
    }    

/*----------- EVENTOS -----------*/

/*----------- CAUSAS -----------*/    

    .content_causas{
        padding: 109px 0;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .item_causas{
        width: 48%;
        margin: 35px 0 0;
    }

    .title_causas{
        font-size: 43px;
        margin-bottom: 35px;
    }

/*----------- CAUSAS -----------*/

}


@media screen and (min-width: 1024px){

/*----------- ABOUT US -----------*/

    .bg-about {
        padding: 155px 0 55px;
        background-position: left;
    }

    .content_about_us{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .desc_about{
        width: 47%;
        order: 2;
    }

    .img_about{
        width: 47%;
        order: 1;
    }
    
    .col-2__about{
        margin-top: 49px;
        display: flex;
        justify-content: space-between;
    }

    .item__about{
        width: 48%;
    }

    .desc_about a{
        display: flex;
        font-size: 16px;
    }

    .img_about a{
        display: none;
    }

/*----------- ABOUT US -----------*/

/*----------- ADOPTAME -----------*/

    .bg_adoptame{
        padding: 115px 0 55px;
    }

   .item__adoptame{ width: 48%; }

   .btn__adoptame {
        padding: 0 11px;
        margin-bottom: 0;
    }

    .info-boxes-adoptame .info-box{
        height: initial;
        text-align: center;
        flex-direction: column;
        justify-content: center;
    }
    
    .info-boxes-adoptame .info-box img{
        width: 47px;
        margin: 0 0 7px 0;
    }

    .item__adoptame p{
        font-size: 18px;
    }

/*----------- ADOPTAME -----------*/

/*----------- IMG LOVE -----------*/

    .bg-love{
        padding: 115px 0 0;
    }

/*----------- IMG LOVE -----------*/

/*----------- AYUDADOS -----------*/

    .content_ayudados{
        width: 91%;
    }

    .title_ayuda b{
        display: block;
    }

    .medidas_ayudados{
        margin-top: 37px;
    }

    .item_ayudados{
        width: 23%;
        text-align: center;
    }

    .item_ayudados h3{
        font-size: 89px;
    }

/*----------- AYUDADOS -----------*/

/*----------- EVENTOS -----------*/

    .content_eventos{
        width: 91%;
    }    

    .title_eventos h2{
        font-size: 41px;
    }

    .title_eventos h2 span {
        font-size: 39px;
        margin-top: 13px;
    }

    .btn_eventos a {
        font-size: 18px;
    }

/*----------- EVENTOS -----------*/

/*----------- CAUSAS -----------*/

    .content_causas {
        padding: 115px 0;
    }

    .title_causas {
        margin-bottom: 87px;
    }

    .item_causas {
        width: 31%;  
        padding: 25px 21px;
        margin: 0 0 35px 0;
        border-radius: 33px;
    }

    .item_causas h2 {
        font-size: 21px;
    }

    .item_causas p {
        font-size: 14px;
    }

/*----------- CAUSAS -----------*/

}

@media screen and (min-width: 1100px){

/*----------- EVENTOS -----------*/

    /* GALLERY */

    .item_gallery_eventos{
        width: 25%;
        position: relative;
    }

/*----------- EVENTOS -----------*/

}



@media screen and (min-width: 1200px){

    /* TITLE */

    .title_slider_home {
        margin: 0 auto 151px;
    }

    /*----------- ABOUT US -----------*/

    .content_about_us {
        width: 91%;
    }

    .desc_about h2 {
        font-size: 49px;
    }

    /*----------- ABOUT US -----------*/

    /*----------- ADOPTAME -----------*/

    .content_adoptame {
        width: 91%;
    }

    .content_adoptame .item__adoptame:nth-child(1){
        padding: 0 46px;
    }

    /* .item__adoptame h3 {
        font-size: 29px;
    } */

    /*----------- ADOPTAME -----------*/

    /*----------- AYUDADOS -----------*/

    .content_ayudados{
        width: 91%;
    }

    /*----------- AYUDADOS -----------*/

    /*----------- EVENTOS -----------*/

    /* .content_eventos{
        width: 100%;
    } */

    /*----------- EVENTOS -----------*/

}

@media screen and (min-width: 1360px){

/*----------- SLIDER -----------*/
    /* TITLE */

    .title_slider_home h2{
        font-size: 63px;
    }

/*----------- SLIDER -----------*/

}

@media screen and (min-width: 1500px){

}