#translate1 a,
.pageheader .txt>p:not(.cta)>a,
.highlight_banner :is(p,li):not(.cta):not(.download) a:not(.fn),
#main .bodytext :is(p,li):not(.cta):not(.download) a:not(.fn){
    transition: all 0.2s ease; cursor: pointer;
    text-decoration: none; font-weight: 600;
    padding: 0 0;
    color: var(--dark-purple);
    background-image: linear-gradient(currentColor, currentColor), linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
    background-position: 0 100%, 0 100%;
    background-repeat: no-repeat, no-repeat;
    background-size: 0 1px, 100% 1px; background-size: 100% 1px, 100% 1px;
    transition: background-size .2s;

}
.pageheader .txt>p:not(.cta)>a { background-size: 100% 1.5px, 100% 1.5px; }

#main .bodytext :is(p,li):not(.cta):not(.download) a[href*="//"]:not([href*="//ria.newgraphic.ie"]):not([href*="//ria.ie"]):not([href*="//www.ria.ie"]):not([href^="mailto:"])::after {
    content: '\E808';  font-family: 'social'; font-weight: normal !important;
    speak: none;
    font-size: 12px;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
    top: -0.5em; margin-left:4px;

}

#translate1 a:hover,
.highlight_banner :is(p,li):not(.cta):not(.download) a:not(.fn):hover,
.pageheader .txt>p:not(.cta)>a:hover,
#main .bodytext :is(p,li):not(.cta):not(.download) a:not(.fn):hover {
    background-size: 100% 100%, 100% 100%; color: white; background-image: linear-gradient(var(--dark-purple), var(--dark-purple)), linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));

}
#translate1 a:focus-visible,
.pageheader .txt>p:not(.cta)>a:focus-visible,
#main .bodytext :is(p,li):not(.cta):not(.download) a:not(.fn):focus-visible {box-shadow: 0 0 0 1px var(--dark-purple), 0 0 0 3px var(--orange); border-radius: 2px; }

.highlight_banner :is(p,li):not(.cta):not(.download) a:not(.fn):focus-visible  {box-shadow:  0 0 0 3px var(--orange); border-radius: 2px; }

#main .section[class*="dark"] .bodytext :is(p,li):not(.cta) a{
    color: inherit; background-image: linear-gradient(currentColor, currentColor), linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
}
#main .section[class*="dark"] .bodytext :is(p,li):not(.cta) a:hover {
    background-image: linear-gradient(white, white), linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
    color: var(--black);
}
#main .section[class*="dark"] .bodytext :is(p,li):not(.cta) a:focus-visible {
 box-shadow: 0 0 0 1px var(--dark-purple), 0 0 0 3px var(--orange); border-radius: 2px;
}

#article_filter h2 button strong,
.bodytext h2 a,
.underline a, .underline span, #bottom button span{
    transition: all 0.2s ease; cursor: pointer;
    text-decoration: none;
    padding: 2px 0;
    background-image: linear-gradient(currentColor, currentColor), linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
    background-position: 0 100%, 0 100%;
    background-repeat: no-repeat, no-repeat;
    background-size: 0 1px, 100% 1px;
    transition: background-size .5s;

}

.bodytext h2 a {

    background-image: linear-gradient(var(--purple), var(--purple)), linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
    background-size: 0 4px, 100% 4px;
    transition: background-size .333s;
}



#homeslides .slidetext a p span, 
#homeslides .slidetext a h2 span{
	padding: 0;
	background-size: 0 2px, 100% 2px;
}


#article_filter h2 button:hover strong,
.underline a:hover,
.underline span:hover, #bottom button span:hover {
    background-size: 100% 1px, 100% 1px

}
#homeslides .slidetext a:hover p span,
#homeslides .slidetext a:hover h2 span {
    background-size: 100% 2px, 100% 2px

}
.bodytext h2 a:is(:focus-visible,:hover)  {
    background-size: 100% 4px, 100% 4px

}
@media all and (max-width: 899px) {
	#homeslides .slidetext a p span, 
#homeslides .slidetext a h2 span{
 
	background-size: 0 1px, 100% 1px;
}
	#homeslides .slidetext a:hover p span,
#homeslides .slidetext a:hover h2 span {
    background-size: 100% 1px, 100% 1px

}
}