//
// Component:       Variables
// Description:     Defines all color and style related values as variables
//                  to allow easy customization for the most common cases.
//
// ========================================================================


// Global variables
// ========================================================================

//
// Breakpoints
//
@breakpoint-small:                              480px;
@breakpoint-medium:                             768px;
@breakpoint-large:                              960px;
@breakpoint-xlarge:                             1220px;

@breakpoint-mini-max:                           (@breakpoint-small - 1);
@breakpoint-small-max:                          (@breakpoint-medium - 1);
@breakpoint-medium-max:                         (@breakpoint-large - 1);
@breakpoint-large-max:                          (@breakpoint-xlarge - 1);