/* Agenda Urbana Española  - Objetivos*/

ul.listaBotones {
    display: flow-root;
    /* padding: 0; */
    padding:20px;
    background-color: white;
    border-radius: 10px;
    
}

ul.listaBotones li {
    display: block;
    padding: 5px 0;

    /* width: 100%; */

    width: 48%;
    margin-right: 2%;
    position: relative;
    float: left;
}

@media (max-width: 992px){
    ul.listaBotones li {
        width: 100%;
        margin-right: 0%;
        display: block;
        position: relative;
        padding: 5px 0;
        float: left;
    }
}



.listaBotones span {
    margin-left: 25px;
    position: relative;
    display: flex;
    padding: 5px 0 5px 38px;
    background: rgba(64,64,64,0.2);
    border: 0;
    /* font-family: encode_sansregular; */
    background: rgba(65,65,65,0.2);
    font-size: 14px;
    width: 90%;
    text-align: left;
    height: 54px;
    align-items: center;
    transition: all .2s ease;
}

.listaBotones span:after {
    content: "";
    position: absolute;
    display: block;
    bottom: 0px;
    right: -35px;
    width: 0;
    height: 0;
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(64,64,64,0.2);
    transition: all .2s ease;
}

.listaBotones span:before {
    content: "";
    width: 54px;
    height: 54px;
    position: absolute;
    background-image: url(/sites/aue/themes/aue/images/pdf.svg);
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left: -24px;
    transition: all .2s ease;
}

.listaBotones span:hover:before {
    width: 63px;
    height: 63px;
    top: -4px;
    left: -32px;
}

.listaBotones span:hover {
    background: rgba(65,65,65,0.3);
    color: white;
}

.listaBotones span:hover:after {
    border-bottom: 54px solid rgba(65,65,65,0.3);
}

.listaBotones span a {
    color: black;
    text-decoration: none;
}

.listaBotones span:hover a {
    font-weight: normal;
}

ul.listaBotones li:before,ul.listaBotones li:after {
    display: none;
}

ul.listaBotones li a:hover:before {
    display: none;
}

.listaBotones .territorio span {
    background: rgba(148,193,30,0.2);
}

.listaBotones .territorio span:hover {
    background: rgba(148,193,30,0.3);
}

.listaBotones .territorio span:before {
    background-image: url(../img/aue/territorio.svg);
}

.listaBotones .territorio span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(148,193,30,0.2);
}

.listaBotones .territorio span:hover:after {
    border-bottom: 54px solid rgba(148,193,30,0.3);
}

.listaBotones .dispersion span {
    background: rgba(0,105,179,0.2);
}

.listaBotones .dispersion span:hover {
    background: rgba(0,105,179,0.3);
    color: white;
}

.listaBotones .dispersion span:before {
    background-image: url(../img/aue/dispersion.svg);
}

.listaBotones .dispersion span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(0,105,179,0.2);
}

.listaBotones .dispersion span:hover:after {
    border-bottom: 54px solid rgba(0,105,179,0.3);
}

.listaBotones .cambioclimatico span {
    background: rgba(0,153,151,0.2);
}

.listaBotones .cambioclimatico span:hover {
    background: rgba(0,153,151,0.3);
    color: white;
}

.listaBotones .cambioclimatico span:before {
    background-image: url(../img/aue/cambioclimatico.svg);
}

.listaBotones .cambioclimatico span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(0,153,151,0.2);
}

.listaBotones .cambioclimatico span:hover:after {
    border-bottom: 54px solid rgba(0,153,151,0.3);
}

.listaBotones .recursos span {
    background: rgba(129,41,79,0.2);
}

.listaBotones .recursos span:hover {
    background: rgba(129,41,79,0.3);
    color: white;
}

.listaBotones .recursos span:before {
    background-image: url(../img/aue/recursos.svg);
}

.listaBotones .recursos span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(129,41,79,0.2);
}

.listaBotones .recursos span:hover:after {
    border-bottom: 54px solid rgba(129,41,79,0.3);
}

.listaBotones .movilidad span {
    background: rgba(242,146,1,0.2);
}

.listaBotones .movilidad span:hover {
    background: rgba(242,146,1,0.3);
    color: white;
}

.listaBotones .movilidad span:before {
    background-image: url(../img/aue/movilidad.svg);
}

.listaBotones .movilidad span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(242,146,1,0.2);
}

.listaBotones .movilidad span:hover:after {
    border-bottom: 54px solid rgba(242,146,1,0.3);
}

.listaBotones .cohesion span {
    background: rgba(253,195,0,0.2);
}

.listaBotones .cohesion span:hover {
    background: rgba(253,195,0,0.3);
    color: white;
}

.listaBotones .cohesion span:before {
    background-image: url(../img/aue/cohesion.svg);
}

.listaBotones .cohesion span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(253,195,0,0.2);
}

.listaBotones .cohesion span:hover:after {
    border-bottom: 54px solid rgba(253,195,0,0.3);
}

.listaBotones .economia span {
    background: rgba(236,109,166,0.2);
}

.listaBotones .economia span:hover {
    background: rgba(236,109,166,0.3);
    color: white;
}

.listaBotones .economia span:before {
    background-image: url(../img/aue/economia.svg);
}

.listaBotones .economia span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(236,109,166,0.2);
}

.listaBotones .economia span:hover:after {
    border-bottom: 54px solid rgba(236,109,166,0.3);
}

.listaBotones .vivienda span {
    background: rgba(149,124,41,0.2);
}

.listaBotones .vivienda span:hover {
    background: rgba(149,124,41,0.3);
    color: white;
}

.listaBotones .vivienda span:before {
    background-image: url(../img/aue/vivienda.svg);
}

.listaBotones .vivienda span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(149,124,41,0.2);
}

.listaBotones .vivienda span:hover:after {
    border-bottom: 54px solid rgba(149,124,41,0.3);
}

.listaBotones .innovacion span {
    background: rgba(206,23,25,0.2);
    ;}

.listaBotones .innovacion span:hover {
    background: rgba(206,23,25,0.3);
    color: white;
}

.listaBotones .innovacion span:before {
    background-image: url(../img/aue/innovacion.svg);
}

.listaBotones .innovacion span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(206,23,25,0.2);
}

.listaBotones .innovacion span:hover:after {
    border-bottom: 54px solid rgba(206,23,25,0.3);
}

.listaBotones .gobernanza span {
    background: rgba(155,26,129,0.2);
}

.listaBotones .gobernanza span:hover {
    background: rgba(155,26,129,0.3);
    color: white;
}

.listaBotones .gobernanza span:before {
    background-image: url(../img/aue/gobernanza.svg);
}

.listaBotones .gobernanza span:after {
    border-right: 35px solid transparent;
    border-bottom: 54px solid rgba(155,26,129,0.2);
}

.listaBotones .gobernanza span:hover:after {
    border-bottom: 54px solid rgba(155,26,129,0.3);
}