// Container widths
//
// Set the container width, and override it for fixed navbars in media queries.

.app-container {
  display: flex;
  justify-content: left;

  .content-container {
    padding-top: 15px;
    position: relative;
    height: 100%;
    width: 100%;
    max-height: 100vh;
    overflow-x: hidden;

    &.logged-out {
      background-size: cover;
      background-repeat: no-repeat;
      object-fit: none;
      object-position: center;
    }
  }
}

.card {
  background: linear-gradient($white, $gray-200);
  border-radius: 30px;
  padding: 30px;
}

.container {
  @include make-container();
  @include make-container-max-widths();
}

// Fluid container
//
// Utilizes the mixin meant for fixed width containers, but with 100% width for
// fluid, full width layouts.

.container-fluid {
  @include make-container();
}

// Row
//
// Rows contain and clear the floats of your columns.

.row {
  @include make-row();
}

// Remove the negative margin from default .row, then the horizontal padding
// from all immediate children columns (to prevent runaway style inheritance).
.no-gutters {
  margin-right: 0;
  margin-left: 0;

  > .col,
  > [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
  }
}

// Columns
//
// Common styles for small and large grid columns

@include make-grid-columns();