// -----------------------------------------------------------------------------
// Containers
// -----------------------------------------------------------------------------

// -----------------------------------------------------------------------------
// Visual Styles
// -----------------------------------------------------------------------------
.container-fluid {
    @media(min-width: $screen-sm) {
        padding-left: $outside-gutter-width + $grid-gutter-width/2;
        padding-right: $outside-gutter-width + $grid-gutter-width/2;
    }
}
.container-bordered {
    border-top: 1px solid $gray-lighter;
    border-bottom: 1px solid $gray-lighter;
}

.container-bordered-top {
    border-top: 1px solid $gray-lighter;
}

.container-bordered-bottom {
    border-bottom: 1px solid $gray-lighter;
}

// shadows that make the container looked indented
@mixin indent($direction) {
    content: "";
    position: absolute;
    height: 44px;
    left: 0;
    width: 100%;
    z-index: 9000;
    background: linear-gradient(to $direction, rgba(0, 0, 0, 0.09) 0, transparent 100%); 
}

.container-indented {
    position: relative;

    &:before {
        top: 0;
        @include indent(bottom);
    }

    &:after {
        bottom: 0;
        @include indent(top);
    }
}

.container-indented-top {
    position: relative;

    &:before {
        top: 0;
        @include indent(bottom);
    }
}

.container-bottom {
    position: relative;

    &:after {
        bottom: 0;
        @include indent(top);
    }
}

.container-bg-image {
  background-size: cover;
  background-position: left top;
  position: relative;
  @media(min-width: $grid-float-breakpoint) {
    background-position: center top;
  }
}

.container-hero-image {
    display: inline-block;
    max-width: 100%;
    background-image: url($image-url + 'hero-placeholder.png');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
    @media(min-width: $screen-lg-min) {
        img {
            max-height: calc(80vh - 96px);
        }   
    }
}