/**
* Base Settings
*/

// Minimal footer height:
$footerHeight: 100px !default;

// maximum site width (before staying centered layout)
$overallMaxWidth: 1200px !default;

// a base padding, used by various components
$overallPadding: 10px !default;
$overallPaddingTopBottom: 25px !default;
$overallPaddingTopBottomDesktop: 30px !default;
$overallPaddingLarge: 50px !default;
// padding when in desktop state
$paddingRightLeftDesktop: 20px !default;

// paragraphs:
$paragraphMargin: 0 0 1rem 0;
// some layout globals:
$baseFontFamily: 'Open Sans', Arial, sans-serif !default;
$baseFontSize: 14px !default;
$baseColor: #262626 !default;
$baseLineHeight: 1.3 !default;

// grid columns
$columns: one, two, three, four, five, six, seven, eight, nine, ten, eleven, twelve;

// A Base gray color where other gray tones are inhered from
$grayColor: #999 !default;
$lighterGrayColor: #ccc !default;

// A base light gray color for surfaces
$lightGrayColor: #f1f1f1 !default;
$globalHoverColor: #f8f8f8 !default;

$smallFontSize: 12px !default;
$smallFontSizeLineHeight: 1.5 !default;
$extraSmallFontSize: $smallFontSize !default;

$globalShortEaseTime: .2s !default;
$globalMediumEaseTime: .35s !default;
$globalLongEaseTime: .8s !default;
$globalMenuEasing: ease !default;

$h1FontSize: 18px !default;
$h2FontSize: $h1FontSize - 1px !default;
$h3FontSize: $h1FontSize - 3px !default;

$h1DesktopFontSize: 20px !default;
$h1Color: $baseColor !default;
$headingMargin: 0 0 1rem 0 !default;

$primaryColor: #258db8 !default;
$secondaryColor: #e6007e !default;
$actionColor: #83ba5e !default;
$alertColor: #d84c3d !default;
$dangerColor: #f08201 !default;
$successColor: #43A047 !default;
$globalRadius: 3px !default;

// breakpoints

$breakpointLarge: 1000px !default;
$breakpointInBetween: 900px !default;
$breakpointDesktop: 768px !default;

$mediaDesktop: "all and (min-width: #{$breakpointDesktop})";
$mediaLarge: "all and (min-width: #{$breakpointLarge})";
$mediaInBetween: "all and (min-width: #{$breakpointInBetween})";
$mediaSmall: "all and (max-width:  #{$breakpointDesktop - 1px})";
$mediaLandscape: "only screen and (orientation: landscape)" !default;
$mediaPortrait: "only screen and (orientation: portrait)" !default;

// sidebar
$sidebarWidthLarge: 273px !default;
$sidebarWidthDesktop: 220px !default;
$sidebarBackground: #fafafa !default;

// Navigation and Sidebar when in mobile state (left + right)
$MainNavigationWidth: 250px !default;
$MainSidebarWidth: 265px !default;
$MainNavigationBg: #4a4a4a !default;

// topbar
$topbarHeight: 43px !default;
$topbarHeightDesktop: 43px !default;
$tabHeight: 40px !default;
$topbarBg: #333333 !default;
$topbarBgDesktop: #333 !default;
$topbarColor: #aaa !default;
$topbarActionColor: $topbarColor !default;
$topbarActionColorHover: #fff !default;
$navigationTogglerColor:#fff !default;

$topBarFontSize: 18px !default;

$topbarActionFontWeight: bold !default;
$topbarNavActiveFontWeight: bold !default;
$topbarNavActiveColor: #fff !default;
$topbarNavHoverColor: $topbarNavActiveColor !default;

// wide topbar
$topbarNavActiveColorWide: $topbarNavActiveColor !default;
$topbarNavHoverColorWide: $topbarNavHoverColor !default;
$topbarColorWide: #aaa !default;



// z-indexes:
$indexModalContainer: 22 !default;
$indexDarkener: 21 !default;
$indexDropdown: 3 !default;
$indexFixedDropdown: 22 !default;
$indexTooltip: 31 !default;
$indexMainNavigation: $indexDarkener + 1 !default;
$indexSidebar: $indexDarkener + 1 !default;
$indexModalCurrent: 10 !default;

// Box Shadows:
$globalBoxShadow: 0px 0px 3px rgba(#000, .7) !default;
$globalBorderColor: $lightGrayColor !default;
$globalBorder:1px solid $globalBorderColor !default;

// subnav
$subnavColor: #616161 !default;
$subnavActiveColor: #616161 !default;
$subnavHoverColor: lighten($subnavColor, 20%) !default;
$subnavTriggerColor:$baseColor !default;
// subnav
$subnavBg: $lightGrayColor !default;
$subnavBgDesktop: $subnavBg !default;
$subnavActiveFontWeight: bold !default;
$subnavBorderTop: false !default;
$subnavBorderBottom: true !default;
$subnavHeightDesktop: 43px !default;
$subnavHeight: 43px !default;
$subnavBorderTopBorder:$globalBorder !default;
$subnavSlideBorder:$globalBorder !default;

// Modal Settings:
$modalAlertWidthDesktop: 320px !default;
$modalWidthSmall: 360px !default;
$modalAnimateName: bounceIn !default;
$modalAnimateDuration: .3s !default;
$modalBackground: #fff !default;
$modalBoxShadow: $globalBoxShadow !default;
$minWidthModalDesktop: 640px !default;
$modalCloseHoverColor: lighten($baseColor, 40%) !default;
$modalCloseHoverBackground: lighten($grayColor, 35%) !default;
$modalCloseActiveColor: lighten($baseColor, 10%) !default;
$modalCloseActiveBackground: lighten($grayColor, 30%) !default;

//forms
$inputBackground: $lightGrayColor !default;
$inputColor: #616161 !default;
$inputBorder: none !default;
$inputBorderInvalid: none !default;
$inputBackgroundInvalid: lighten($alertColor, 40%) !default;
$inputDisabledBg: #fafafa !default;
$inputDisabledColor: #bababa !default;
$inputDisabledBorder: #e0e0e0 !default;
$inputFocusColor: darken($inputBackground, 5%) !default;
$inputFocusBorderColor: none !default;
$inputFocusBoxShadow: none !default;
$labelWidthDesktop: calc(25% + .375rem) !default;
$labelMinWidth: 0 !default;
$labelColor: $baseColor !default;
$labelFontSize: $smallFontSize !default;
$labelFontWeight:normal !default;
$labelPaddingDesktop: 5px 1rem 0 0 !default;
$inputHeight: 35px !default;
$formMargin: 30px !default;
$formMarginDesktop: 30px !default;
$formActionsPadding: 40px !default;
$formActionsPaddingDesktop: 60px !default;
$formMinWidthControls: 330px !default;
$appendMargin: 20px !default;
// append Margins for different states (last-child etc.)
$appendMarginTopNegative: -10px !default;
$appendMarginTopPositive: 10px !default;
$thirdColumnPaddingOffsetInBetween: $labelWidthDesktop !default;
$inputMultiFormSpacing: 10px !default;
$controlMargin: 20px !default;
$formWidthControlsBetween: calc(50% - .75rem) !default;
$formWidthControls: calc(75% - .5rem) !default;
$inputPadding: 8px 10px !default;
$textareaPadding: 10px !default;
$legendMargin: $formMargin !default;
$legendMarginDesktop: $formMarginDesktop !default;
$uneditableInputPadding: 8px 10px !default;
$inputBoxShadow: none !default;
$legendFontSize: $baseFontSize !default;
$legendFontWeight: bold !default;
$legendColor: $baseColor !default;
$placeholderColor: lighten($grayColor, 10%) !default;
$selectPickerColor: #a6a6a6 !default;
$selectChooseBackgroundColor: transparent !default;
$labelMargin: 3px !default;
$formParagraphMargin: $appendMarginTopPositive !default;
$checkboxAndOptionHeight: 20px !default;
$checkRadioColor: $primaryColor !default;
$labelTextAlign: right !default;
$copyTextFormsFontSize: $smallFontSize !default;
$copyTextFormsLineHeight: $smallFontSizeLineHeight !default;
$copyTextFormsMultipleMarginTop: .5rem !default;
$inputFontSize: $baseFontSize !default;
$inputTransitions: background .5s ease !default;
$checkboxMargin: 0px 0 0 28px;
$disabledThumbColor: lighten($lighterGrayColor, 10%);
$inputBorderRadius: $globalRadius !default;
// buttons
$buttonColor: #fff !default;
$btnPrimaryColor: $actionColor !default;
$btnSecondaryColor: #c3c3c3 !default;
$btnDangerColor: $dangerColor !default;
$btnAlternativeColor: $primaryColor !default;
$btnFontSize: $baseFontSize !default;
$btnPadding: 11px 45px 10px !default;
$btnBackgroundSize: 40px 40px !default;
$btnSmallPadding: 7px 30px 7px !default;
$btnFontWeight: bold !default;
$btnRadius: $globalRadius !default;
// tabs
$tabBottomLineHeight: 2px !default;
$tabsSmallPadding: 5px !default;
$tabsSmallLineHeight: 1px !default;

// loader

$loaderSize: 40px !default;
$loaderColor: lighten(#ccc, 5%) !default;
$loaderColorBackground: #fff !default;
$loaderBorder: 4px !default;
$smallLoaderSize: 20px !default;
$smallLoaderBorder: 2px !default;
$loaderAlternate: false !default;
$loaderAlternateColor: #ccc !default;
// fonts
$includeFontello: true !default;
$fontelloFontPath: '../fonts/fontello' !default;
$iconFontName: 'fontello';

// Effects:
$darkenerFadeOpacity: .35 !default;
$darkenerColor: #000 !default;

// darkener when using background-color (e.g. in modals)
$backgroundDarkenerFadeOpacity: .35 !default;
$backgroundDarkenerColor: #000 !default;

// dropdowns:
$dropdownBorderColor: lighten($grayColor, 20%) !default;
$dropdownMaxHeight: 300px !default;

// lightbox
$lightboxImageBackground: black !default;
$lightBoxMinHeightDesktop: 300px !default;
$lightBoxWidthLarge: 60% !default;
$lightBoxMinHeightLarge: calc(80vh - 40px) !default;

// tooltips
$tooltipBg: #333 !default;
$tooltipFontSize: $smallFontSize !default;
$alertTooltipColor: $tooltipBg !default;
$tooltipFontWeight: 600 !default;
$defaultTooltipArrowSize: 5px !default;

// breadcrumbs
$breadcrumbFontSize: $baseFontSize !default;
$breadcrumbFontSizeLarge: 18px !default;
$breadcrumbColor: #ccc !default;
$breadcrumbSeparatorIcon: " \00B7 ";

// labeled
$labeledSpacing: 1rem !default;
$labeledBorder: 1px solid $globalBorderColor !default;
$labeledPaddingTopDesktop: 0 !default;

// icons:
$iconSpacingButton: .3rem !default;
$iconSpacing: .1rem !default;

// table
$tableBorder: $globalBorder !default;
$tableSpacing: 10px 1rem 10px 0 !default;
$tableSpacingBreak: 6px 1rem 6px 0 !default;
$tableSpacingLastAndFirst: 5px !default;
$tableTransition: background .1s ease !default;
$tableHeaderColor:$primaryColor !default;

// listings:
$listingMinHeight: 105px !default;
$listingAvatarRowLarge: 84px !default;
$listingAvatarRow: 84px !default;
$listingAvatarRowSmall: 36px !default;
$listingOuterPadding: 10px !default;
$listingSpaceRight: 30px !default;
$listingSmallWidth: 30% !default;

// panel
$panelBackground: $lightGrayColor !default;

// links:
$linkFontWeight: 600 !default;
$linkHoverColor: lighten($primaryColor, 10%) !default;

// code:
$codeBackgroundColor: lighten($grayColor, 35%) !default;
$codeBorderColor: lighten($grayColor, 20%) !default;

// badge:
$badgePadding: 0 5px !default;
$badgeBackground: $secondaryColor !default;

// selection
$selectionBackground: lighten($primaryColor, 25%) !default;
$selectionColor: #fff !default;

// breadcrumbs
$breadcrumbShortenPortrait: true !default;


// Execute component mixins
$executeDefaultMixins: true !default;