@massds/mayflower-assets
Version:
Mayflower Assets
78 lines • 1.92 kB
CSS
.ma__decorative-link {
padding-right: 0.8em;
display: inline-block;
vertical-align: middle;
width: 100%;
}
.ma__decorative-link a {
text-decoration: none;
transition: all 0.4s ease;
border-bottom: 3px solid transparent;
padding-top: 3px;
padding-bottom: 1px;
transition: border 0.4s ease;
text-decoration: none;
display: inline;
}
.ma__decorative-link a:hover {
border-bottom-width: 3px;
border-bottom-style: solid;
text-decoration: none;
}
.ma__decorative-link a svg {
display: inline-block;
height: 0.6em;
margin-right: -0.8em;
width: 0.6em;
}
.ma__decorative-link a:hover {
border-bottom-color: #7299BC;
}
.ma__decorative-link a:focus {
border-bottom-color: #7299BC ;
}
.ma__decorative-link svg {
fill: #14558f;
}
.ma__decorative-link--inverse a {
color: white;
}
.ma__decorative-link--inverse a:hover {
border-bottom-color: rgba(255, 255, 255, 0.5);
}
.ma__decorative-link--inverse a:focus {
border-bottom-color: rgba(255, 255, 255, 0.5) ;
}
.ma__decorative-link--inverse svg {
fill: rgba(255, 255, 255, 0.5);
}
.ma__decorative-link.button-link {
outline: 1px solid rgba(20, 85, 143, 0.5);
display: inline-block;
width: auto;
padding: 0.5rem 1.8rem 0.5rem 0.8rem;
background-color: white;
}
.ma__decorative-link.button-link:hover, .ma__decorative-link.button-link:focus {
outline: 1px solid #14558f;
}
.ma__decorative-link.button-link:hover a, .ma__decorative-link.button-link:focus a {
border-bottom-color: transparent;
}
.ma__decorative-link.button-link:hover a svg, .ma__decorative-link.button-link:focus a svg {
fill: #14558f;
}
.ma__decorative-link__details {
font-weight: 400;
}
.ma__decorative-link a .ma__download-link--icon {
display: inline-flex;
align-self: center;
top: 0.3em;
position: relative;
}
.ma__decorative-link a .ma__download-link--icon svg {
margin-right: 0;
width: 29px;
height: 30px;
}