/*
Custom Vars
*/

//** website colors
@magenta: #ff5959;
@cyan: #63dfd2;
//@cyan: #2ea397;
@aqua: #49cabe;
//@aqua: #2ea397;
@green: #63db98;
@yellow: #f7e700;
@orange: #ec6348;
@black: #000000;
@80gray: #333333;
@70gray: #444444;
@60gray: #666666;
@40gray: #999999;
@30gray: #bbbbbb;
@10gray: #dddddd;
@5gray: #f0f0f0;
@white: #ffffff;

/**header margins**/
@header-margin: 20px 0 15px 0;
/**types, not included p tags**/
@type-margin: 10px 0 15px 0;
/**custom border radius**/
@border-radius-top: 4px 4px 0 0;
@border-radius-bottom: 0 0 4px 4px;
@border-radius-left: 4px 0 0 4px;
@border-radius-right: 0 4px 4px 0;
/**custom border**/
@border-light-gray: 1px solid @10gray;

@border-radius-no-top-right: 4px 0 4px 4px;

/*
Bootstrap variable overrides
*/

//== Scaffolding
//
//** Global textual link color.
@link-color:            @80gray;

// Extra small screen / phone
@screen-xs-min:              480px;
@screen-xxs-max:             (@screen-xs-min - 1);

//** Number of columns in the grid.
@grid-columns:              24;
//** Padding between columns. Gets divided in half for the left and right.
@grid-gutter-width:         15px;

//== Typography
//
//## Font, line-height, and color for body text, headings, and more.
@font-family-sans-serif: 'Open Sans', Helvetica, Arial, sans-serif;

@font-size-h1:            floor((@font-size-base * 1.3)); // ~18px
@font-size-h2:            floor((@font-size-base * 1.3)); // ~18px
@font-size-h5:            ceil((@font-size-base * 1.10)); // ~16px

@headings-font-weight:    600;
@headings-line-height:    1.25;

//== Components
//
//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
@border-radius-large:       4px;

//== Tables
//
//## Customizes the `.table` component with basic values, each used across all table variations.

//** Background color used for `.table-striped`.
@table-bg-accent:               @5gray;

//== Type
//
//##
//** Blockquote font size
@blockquote-font-size:        @font-size-base;
//** Blockquote border color
@blockquote-border-color:     @10gray;

//== Buttons
//
//## For each of Bootstrap's buttons, define text, background and border color.

@btn-primary-bg:                 @70gray;

//== Navbar
//
//##

// Basics of a navbar
@navbar-margin-bottom:             @line-height-computed * 2;
@navbar-border-radius:             0;
@navbar-default-bg:                @white;
@navbar-default-border:            @10gray;

//== Navs
//
//##

//=== Shared nav styles
@nav-link-hover-bg:                         transparent;

//== Form states and alerts
//
//## Define colors for form feedback states and, by default, alerts.

@state-danger-text:              @magenta;

//custom vars
@normal: 400;
@semibold: 600;
@bold: 700;

/**Mixins**/
.border-radius (@radius: @border-radius-base) {
    -webkit-border-radius: @radius;
    -moz-border-radius:    @radius;
    border-radius:         @radius;

    -moz-background-clip:    padding;
    -webkit-background-clip: padding-box;
    background-clip:         padding-box;
}

// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons

.button-variant(@color; @background; @border) {
    color: @color;
    background-color: @background;
    border-color: @border;

    &:hover,
        &:focus,
        &:active,
        &.active,
        .open > .dropdown-toggle& {
        color: @lightHighlight;
        background-color: darken(@background, 10%);
        border-color: darken(@border, 12%);
    }
    &:active,
        &.active,
        .open > .dropdown-toggle& {
        background-image: none;
    }
    &.disabled,
    &[disabled],
    fieldset[disabled] & {
        &,
        &:hover,
            &:focus,
            &:active,
            &.active {
            background-color: @background;
            border-color: @border;
        }
    }

    .badge {
        color: @background;
        background-color: @color;
    }
}
