//== gee
@import (optional) "../node_modules/gee.less/gee";
@import (optional) "../../../node_modules/gee.less/gee";

@gee-unit-font-family: @hdeng-base-font-family;

//== Layout
.hdeng-container() {
    position: relative;
    max-width: @hdeng-container-max-width + @hdeng-content-padding + @hdeng-content-padding;
    margin-left: auto;
    margin-right: auto;
}

.hdeng-content-padding() {
    padding-left: @hdeng-content-padding;
    padding-right: @hdeng-content-padding;

    @media (max-width: @hdeng-breakpoint-mobile) {
        padding-left: @hdeng-content-padding-mobile;
        padding-right: @hdeng-content-padding-mobile;
    }
}

.hdeng-pull-top() {
    // Mixin for BC
}

.hdeng-pull-bottom() {
    // Mixin for BC
}

//== Headlines

.hdeng-h1() {
    font-size: 32px;
    line-height: 1.2;

    @media (max-width: @hdeng-breakpoint-mobile) {
        font-size: 7.5vw;
    }
}

.hdeng-h2() {
    font-size: 24px;

    @media (max-width: @hdeng-breakpoint-mobile) {
        font-size: 6vw;
    }
}

.hdeng-h3() {
    font-size: 20px;
    margin-bottom: floor(@hdeng-spacing / 2);

    @media (max-width: @hdeng-breakpoint-mobile) {
        font-size: 5.5vw;
    }
}

.hdeng-h4() {
    font-size: 16px;
    margin-bottom: floor(@hdeng-spacing / 2);
    font-weight: 700;
}

.hdeng-h5() {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: floor(@hdeng-spacing / 4);
}

.hdeng-h6() {
    font-size: 12px;
    font-weight: 700;
    margin-bottom: floor(@hdeng-spacing / 4);
}

// Clearfix
// Source: http://nicolasgallagher.com/micro-clearfix-hack/
//
// For modern browsers
// 1. The space content is one way to avoid an Opera bug when the
// contenteditable attribute is included anywhere else in the document.
// Otherwise it causes space to appear at the top and bottom of elements
// that are clearfixed.
// 2. The use of `table` rather than `block` is only necessary if using
// `:before` to contain the top-margins of child elements.
.hdeng-clearfix() {
    zoom: 1;
    &:before,
    &:after {
        content: " "; // 1
        display: table; // 2
    }
    &:after {
        clear: both;
    }
}

@hdeng-ease-out-function: cubic-bezier(0.23, 1, 0.32, 1);
.hdeng-ease-out(@property: all; @duration: 450ms; @delay: 0ms) {
    transition: @property @duration @hdeng-ease-out-function @delay;
}

.hdeng-img-responsive(@display: block;) {
    display: @display;
    width: auto; // for ie 8
    max-width: 100%; // Part 1: Set a maximum relative to the parent
    height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
}

.hdeng-visuallyhidden() {
    position: absolute !important;
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0 !important;
    border: 0 !important;
    height: 1px !important;
    width: 1px !important;
    overflow: hidden;
}
