/*******************************
             Grid
*******************************/

/* Inherited From Site */

// @mobileBreakpoint
// @tabletBreakpoint
// @computerBreakpoint
// @largeMonitorBreakpoint
// @widescreenMonitorBreakpoint

/*******************************
            Grid
*******************************/

@minWidth: 320px;

@gutterWidth: 2rem;
@rowSpacing: 2rem;

@columnMaxImageWidth: 100%;

@tableWidth: ~"calc(100% + "@gutterWidth~")";

/*******************************
           Variations
*******************************/

/*--------------
     Page
---------------*/

/* Column Gutters */
@mobileWidth: auto;
@mobileGutter: 1rem;

@tabletWidth: auto;
@tabletGutter: 8%;

@computerWidth: auto;
@computerGutter: 13%;

@largeMonitorWidth: auto;
@largeMonitorGutter: 18%;

@widescreenMonitorWidth: auto;
@widescreenMonitorGutter: 23%;


/*--------------
     Relaxed
---------------*/

@relaxedGutterWidth: 3rem;
@veryRelaxedGutterWidth: 4rem;

/*--------------
     Divided
---------------*/

@dividedBorder:
  -1px 0px 0px 0px rgba(0, 0, 0, 0.1),
  -2px 0px 0px 0px rgba(255, 255, 255, 0.3)
;
@verticallyDividedBorder:
  0px -1px 0px 0px rgba(0, 0, 0, 0.1),
  0px -2px 0px 0px rgba(255, 255, 255, 0.3)
;

@dividedInvertedBorder:
  -1px 0px 0px 0px rgba(0, 0, 0, 0.15),
  -2px 0px 0px 0px rgba(0, 0, 0, 0.15)
;
@verticallyDividedInvertedBorder:
  0px -1px 0px 0px rgba(0, 0, 0, 0.15),
  0px -2px 0px 0px rgba(0, 0, 0, 0.15)
;


/*--------------
    Celled
---------------*/

@celledMargin: 1em 0em;
@celledWidth: 1px;
@celledBorderColor: @solidBorderColor;


/*--------------
    Stackable
---------------*/

@stackableRowSpacing: @rowSpacing;
@stackableGutterWidth: 1.5em;
@stackableMobileBorder: 1px solid @borderColor;

@doublingRowSpacing: @rowSpacing;