/* Helpers

=============== */

// Classic clearfix .clearfix::before, .clearfix::after {

content: " ";
display: block;

}

.clearfix:after {

clear: both;

}

// Text alignment .text-left {

text-align: left;

}

.text-right {

text-align: right;

}

.text-center {

text-align: center;

}

.text-justify {

text-align: justify;

}

// Display .block {

display: block;

}

.inline-block {

display: inline-block;

}

.inline {

display: inline;

}

// Vertical center .vertical-center {

display: flex;
align-items: center;
justify-content: center;

}

// Responsive images .responsive-image {

max-width: 100%;
height: auto;

}

// Thumbnail images .thumbnail-image {

max-width: 100%;
width: 100%;
height: 250px;
object-position: center;
object-fit: cover;

}

// Display State .show {

display: block !important;

}

.hide {

display: none !important;

}

.invisible {

visibility: hidden;

}

// Floats .float-left {

float: left;

}

.float-right {

float: right;

}

// Padding .no-padding-top {

padding-top: 0;

}

.no-padding-bottom {

padding-bottom: 0;

}

.no-side-padding {

padding-left: 0;
padding-right: 0;

}

.padding-top {

padding-top: 2rem;

}

.padding-bottom {

padding-bottom: 2rem;

}

// Margins .no-margin-top {

margin-top: 0;

}

.no-margin-bottom {

margin-bottom: 0;

}

.margin-top {

margin-top: 2rem;

}

.margin-bottom {

margin-bottom: 2rem;

}

// Backgrounds .alternate-background {

background: $alternate-background;
color: $alternate-color;

}

// Screen reader text for accessibility .screen-reader-text {

clip: rect(1px, 1px, 1px, 1px);
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;

}

// Overlap element with a header or something .overlap {

margin-top: -$margins;
z-index: 2;
position: relative;

}