//
 // Grid system
 // --------------------------------------------------
 
 
 // Container widths
 //
 // Set the container width, and override it for fixed navbars in media queries.
 
 .container {
   .container-fixed();
 
   @media (min-width: @screen-sm-min) {
     width: @container-sm;
   }
   @media (min-width: @screen-md-min) {
     width: @container-md;
   }
   @media (min-width: @screen-lg-min) {
     width: @container-lg;
   }
 }
 
 
 // Fluid container
 //
 // Utilizes the mixin meant for fixed width containers, but without any defined
 // width for fluid, full width layouts.
 
 .container-fluid {
   .container-fixed();
 }
 
 
 // Row
 //
 // Rows contain and clear the floats of your columns.
 
 .row {
   .make-row();
 }
 
 
 // Columns
 //
 // Common styles for small and large grid columns
 
 .make-grid-columns();
 
 
 // Extra small grid
 //
 // Columns, offsets, pushes, and pulls for extra small devices like
 // smartphones.
 
 .make-grid(xs);
 
 
 // Small grid
 //
 // Columns, offsets, pushes, and pulls for the small device range, from phones
 // to tablets.
 
 @media (min-width: @screen-sm-min) {
   .make-grid(sm);
 }
 
 
 // Medium grid
 //
 // Columns, offsets, pushes, and pulls for the desktop device range.
 
 @media (min-width: @screen-md-min) {
   .make-grid(md);
 }
 
 
 // Large grid
 //
 // Columns, offsets, pushes, and pulls for the large desktop device range.
 
 @media (min-width: @screen-lg-min) {
   .make-grid(lg);
 }