$color1: #f7931d; // Default color: orange $color2: #00aa00; // Default color: green $defaultColor1: $color1; $defaultColor2: $color2; $onymWhite: #fff; $onymTextColor: #222; $onymTextColorLight: rgba(#000, .90); $onymTextColorLighter: rgba(#000, .20); $onymTextColorTint1: lighten($onymTextColor, 20%); $onymHeadlineColor: #000; $onymBgColorLight: #f3f3f3; $onymBgColorDark: darken(#f3f3f3, 10%); $onymBgColorDarker: darken(#f3f3f3, 20%); $onymGreenColor: $color2; $onymGreenColorLight: rgba($color2, .90); $onymFooterBg: #2f2f2f; $onymFooterBgTint1: lighten($onymFooterBg, .90); $onymFooterBgTint2: lighten($onymFooterBg, .80); $onymFooterBgTint3: lighten($onymFooterBg, 3%); $onymFooterTextColor: #f2f2f2; $onymFooterTitleColor: darken(#f2f2f2, 40%); $onymFooterColor1: rgba($onymFooterTextColor, .90); $onymFooterColor2: rgba($onymFooterTextColor, .75); $onymBgColorTint1: rgba(#fff, .05%); $onymBgColorTint2: rgba(#fff, .1%); $onymBgColorTint3: rgba(#fff, .85%); $onymBgColorTint4: lighten(#2f2f2f, 75%); $onymBgColorTint5: lighten(#2f2f2f, 60%); $navbar-close-button-color: lighten($onymTextColor, 75%); $defaultBorderWidth: 3px; /// Media Query breakpoints $mqBodyMinWidth: 300px; // Body min width $mqMobileWidth: 480px; // Mobile width $mqLandscapeMobileWidth: 640px; // Landscape mobile width $mqTabletWidth: 768px; // Tablet width $mqDesktopWidth: 1024px; // Desktop width $mqLargeDesktopWidth: 1296px; // Large desktop width $mqWideDesktopWidth: 1366px; // Wide desktop width $mqXWideDesktopWidth: 1600px; // Extra wide desktop width $mqMaxWidth: 1400px; // Max width $transitionDuration: 0.5s; // Transition duration $mq-breakpoints: ( mobile: $mqMobileWidth, // Mobile view lmobile: $mqLandscapeMobileWidth, // Landscape mobile view tablet: $mqTabletWidth, // Tablet view desktop: $mqDesktopWidth, // Desktop view large: $mqLargeDesktopWidth, // Large desktop view wide: $mqWideDesktopWidth, // Wide desktop view xwide: $mqXWideDesktopWidth // Extra wide desktop view ) !default; $screen-md: $mqDesktopWidth !default; $screen-lg: $mqLargeDesktopWidth !default; $borderVisibility: 0.85; $backgroundTransparency: 1; $borderLightenActive: 15%; $borderLighten: 10%; $navbarBorderWidth: $defaultBorderWidth; // Navigation border default width $navbarBorderColor: $onymBgColorLight !default; // Navigation border default color $navbar-height-mobile: 64px; $navbar-height-tablet: 64px; $navbar-button-width: 48px; $navbar-height: 64px; $navbar-button-font-size: 1.5rem; $navbar-button-font-size-xl: 2.5rem; $navbar-toggle-font-size: 2rem; $navbar-close-button-font-size: 3rem; $footer-line-height: 38px; $footer-menu-border-color: rgba($onymFooterTextColor, .50); $footer-sections-spacing: 3rem; $footer-sections-spacing-small: 2rem; $footer-search-max-width: 360px; $footer-menu-spacing: 1.5rem; /// Variables $headerHeightMobile: 480px; $headerHeightTablet: 480px; $headerHeightDesktop: 480px; $headerHeightLarge: 480px; $headerHeightXWide: 640px; $callToActionMinWidth: 240px; $max-page-width: 1280px; $max-narrow-page-width: 1280px; $navbar-menu-active-bg: rgba($onymGreenColor, $borderVisibility); $navbar-menu-inactive-bg: rgba($onymWhite, $borderVisibility); $navbar-menu-active-color: $onymWhite; $navbar-menu-hover-color: $onymGreenColorLight; $navbar-menu-inactive-color: $onymGreenColor; $navbar-menu-max-width: 460px; $navbar-menu-hover-bg-transparency: 0.2; $footer-nav-max-width: 460px; $primary-nav-menu-height-desktop: 40px; $content-wrapper-min-height: 560px; $navbar-logo-size: 48px; $footer-logo-size: $footer-line-height; $content-box-max-width: 320px; $content-img-max-height: 320px; $inputHeight: 48px; $blogContainerHeight: 342px; $blogContainerHeightSm: 292px; $blogContainerHeightList: 128px; $blog-section-max-width: 360px; $other-post-img-height: 250px;