|
|
|
|
// Bootstrap Settings
|
|
|
|
|
|
|
|
|
|
$spacer: 20px;
|
|
|
|
|
$spacers: (
|
|
|
|
|
0: 0,
|
|
|
|
|
1: ($spacer * .25), // 5px
|
|
|
|
|
2: ($spacer * .5), // 10px
|
|
|
|
|
3: $spacer, // 20px
|
|
|
|
|
4: ($spacer * 1.5), // 30px
|
|
|
|
|
5: ($spacer * 3), // 60px
|
|
|
|
|
6: ($spacer * 6), // 120px
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
$grid-columns: 12;
|
|
|
|
|
$grid-gutter-width: 20px;
|
|
|
|
|
$grid-gutter-width-mobile: 5px;
|
|
|
|
|
|
|
|
|
|
$grid-breakpoints: (
|
|
|
|
|
xs: 0, // Mobile Portrait
|
|
|
|
|
sm: 768px, // Tablet Portrait
|
|
|
|
|
md: 1024px, // Tablet landscape/Small desktop
|
|
|
|
|
lg: 1280px, // Desktop
|
|
|
|
|
xl: 1600px, // Large desktop
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
$container-max-widths: (
|
|
|
|
|
sm: 708px,
|
|
|
|
|
md: 984px,
|
|
|
|
|
lg: 1200px,
|
|
|
|
|
xl: 1560px
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
$font-serif: 'DM Serif Display';
|
|
|
|
|
$font-sans: 'Open Sans';
|
|
|
|
|
$icon: 'icomoon';
|
|
|
|
|
|
|
|
|
|
$black: #000;
|
|
|
|
|
$white: #fff;
|
|
|
|
|
$gray: #808080;
|
|
|
|
|
$light-gray: #F5F2F0;
|
|
|
|
|
$dark-gray: #393939;
|
|
|
|
|
|
|
|
|
|
$olive: #86876f;
|
|
|
|
|
$olive-dark: #383920;
|
|
|
|
|
$orange: #ddb279;
|
|
|
|
|
$brown: #92704F;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$white-alpha: rgba(255, 255, 255, 0.5);
|
|
|
|
|
$black-alpha: rgba(0, 0, 0, 0.2);
|
|
|
|
|
|
|
|
|
|
//Hamburgers settings
|
|
|
|
|
$hamburger-padding-x : 0;
|
|
|
|
|
$hamburger-padding-y : 6px;
|
|
|
|
|
$hamburger-layer-width : 30px;
|
|
|
|
|
$hamburger-layer-height : 3px;
|
|
|
|
|
$hamburger-layer-spacing : 8px;
|
|
|
|
|
$hamburger-layer-color : $olive-dark;
|
|
|
|
|
$hamburger-layer-border-radius : 0;
|
|
|
|
|
$hamburger-hover-opacity : 1;
|
|
|
|
|
$hamburger-active-layer-color : $olive-dark;
|
|
|
|
|
$hamburger-active-hover-opacity: $olive-dark;
|
|
|
|
|
|
|
|
|
|
// Slick settings
|
|
|
|
|
$slick-font-path: "../fonts/";
|
|
|
|
|
$slick-font-family: $icon;
|
|
|
|
|
$slick-loader-path: "/images/";
|
|
|
|
|
$slick-arrow-color: $brown;
|
|
|
|
|
$slick-dot-color: $brown;
|
|
|
|
|
$slick-dot-color-active: $slick-dot-color;
|
|
|
|
|
$slick-prev-character: "\e906";
|
|
|
|
|
$slick-next-character: "\e905";
|
|
|
|
|
$slick-dot-character: " ";
|
|
|
|
|
$slick-dot-size: 6px;
|
|
|
|
|
$slick-opacity-default: 0.75;
|
|
|
|
|
$slick-opacity-on-hover: 1;
|
|
|
|
|
$slick-opacity-not-active: 0.25;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$header-height: 200px;
|
|
|
|
|
$header-height-mobile: 110px;
|
|
|
|
|
$header-height-sticky: 60px;
|
|
|
|
|
$header-height-mobile-sticky: 60px;
|
|
|
|
|
$footer-height: 250px;
|
|
|
|
|
|
|
|
|
|
/* Font-size variables */
|
|
|
|
|
$font-6: 0.375rem; /* 6px */
|
|
|
|
|
$font-8: 0.5rem; /* 8px */
|
|
|
|
|
$font-10: 0.625rem; /* 10px */
|
|
|
|
|
$font-11: 0.687rem; /* 11px */
|
|
|
|
|
$font-12: 0.75rem; /* 12px */
|
|
|
|
|
$font-13: 0.812rem; /* 13px */
|
|
|
|
|
$font-14: 0.875rem; /* 14px */
|
|
|
|
|
$font-15: 0.937rem; /* 15px */
|
|
|
|
|
$font-16: 1rem; /* 16px */
|
|
|
|
|
$font-18: 1.125rem; /* 18px */
|
|
|
|
|
$font-20: 1.25rem; /* 20px */
|
|
|
|
|
$font-22: 1.375rem; /* 22px */
|
|
|
|
|
$font-24: 1.5rem; /* 24px */
|
|
|
|
|
$font-25: 1.56rem; /* 24px */
|
|
|
|
|
$font-26: 1.625rem; /* 26px */
|
|
|
|
|
$font-28: 1.75rem; /* 28px */
|
|
|
|
|
$font-30: 1.875rem; /* 30px */
|
|
|
|
|
$font-32: 2rem; /* 32px */
|
|
|
|
|
$font-34: 2.125rem; /* 34px */
|
|
|
|
|
$font-36: 2.25rem; /* 36px */
|
|
|
|
|
$font-38: 2.375rem; /* 38px */
|
|
|
|
|
$font-40: 2.5rem; /* 40px */
|
|
|
|
|
$font-42: 2.625rem; /* 42px */
|
|
|
|
|
$font-44: 2.75rem; /* 44px */
|
|
|
|
|
$font-46: 2.875rem; /* 46px */
|
|
|
|
|
$font-48: 3rem; /* 48px */
|
|
|
|
|
$font-50: 3.125rem; /* 50px */
|
|
|
|
|
$font-52: 3.25rem; /* 52px */
|
|
|
|
|
$font-54: 3.375rem; /* 54px */
|
|
|
|
|
$font-60: 3.75rem; /* 60px */
|
|
|
|
|
$font-72: 4.5rem; /* 72px */
|
