// —————————————————————————– // Helper classes. // —————————————————————————–
.alignleft {
float: left; margin: 0.5em 1em 0.5em 0;
}
.aligncentre {
display: block; margin-left: auto !important; margin-right: auto !important; text-align: center !important;
}
.alignright {
float: right; margin: 0.5em 0 0.5em 1em;
}
.clearfix {
@extend %clearfix;
}
.hidden {
display: none !important; visibility: hidden;
}
.invisible {
visibility: hidden;
}
.ir {
background-color: transparent; border: 0; overflow: hidden; *text-indent: -9999px; &:before { content: ""; display: block; width: 0; height: 150%; }
}
.visuallyhidden {
border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; &.focusable:active, &.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
}
%bg-white {
background-color: white;
}
%button {
padding: 0.25em; &:hover { @include rounded(0.25em); background: $colour-base; border: none; color: white; }
}
%central {
margin: 0 auto;
}
%clearfix {
&:before, &:after { content: " "; display: block; } &:after { clear: both; } *zoom: 1;
}
%divider-gradient {
@extend %central; content: ' '; display: block; height: 1px; max-width: 80%;
}
%divider-gradient-top {
@extend %divider-gradient; background: $colour-lightgrey; @include linear-gradient(#ffffff, $colour-base, #ffffff);
}
%divider-gradient-bottom {
@extend %divider-gradient; background: #ffffff; @include linear-gradient(#ffffff, $colour-lightgrey, #ffffff);
}
%text-centre {
text-align: center;
}