310 lines
9.0 KiB
SCSS
310 lines
9.0 KiB
SCSS
//
|
|
// Typography
|
|
//
|
|
|
|
// Font Families
|
|
$m-font-primary: "Open Sans", Helvetica, Arial, sans-serif !default;
|
|
|
|
// Font Sizes
|
|
$m-font-primary-size: 16px !default;
|
|
|
|
$text-slider-title:#797979;
|
|
|
|
//
|
|
// Breakpoints
|
|
//
|
|
|
|
$m-2xs: 446px !default; // Double extra small devices (<=445px)
|
|
// Extra small devices (portrait phones, <=575px)
|
|
$m-sm: 576px !default; // Small devices (landscape phones, >=576 & <=767)
|
|
$m-md: 768px !default; // Medium devices (tablets, >=768 & <=991)
|
|
$m-lg: 992px !default; // Large devices (desktops, >=992 & <=1199)
|
|
$m-xl: 1200px !default; // Extra large devices (large desktops, >=1200)
|
|
// If you want to use "max-width" than var-1. For exmaple: @media (max-width: #{$m-lg}-1) {...}
|
|
|
|
|
|
|
|
|
|
//
|
|
// Colors
|
|
//
|
|
|
|
// Primary Color
|
|
$m-color-primary: #47BAC1 !default;
|
|
$m-color-primary-dark-v1: darken($m-color-primary, 2%) !default;
|
|
$m-color-primary-dark-v2: darken($m-color-primary, 5%) !default;
|
|
$m-color-primary-dark-v3: darken($m-color-primary, 10%) !default;
|
|
$m-color-primary-light-v1: rgba($m-color-primary, .2) !default;
|
|
$m-color-primary-light-v2: rgba($m-color-primary, .8) !default;
|
|
|
|
// Main Colors
|
|
$m-color-main: #555 !default;
|
|
$m-bg-color-main: #fff !default;
|
|
|
|
// Main Secondary
|
|
$m-bg-color-secondary: #fafafa !default;
|
|
|
|
// Color Black
|
|
$m-color-black: #000;
|
|
|
|
// Color White
|
|
$m-color-white: #fff;
|
|
|
|
// Color Gray
|
|
$m-color-gray-light-v1: #bbb !default;
|
|
$m-color-gray-light-v2: #ccc !default;
|
|
$m-color-gray-light-v3: #ddd !default;
|
|
$m-color-gray-light-v4: #eee !default;
|
|
$m-color-gray-light-v5: #f7f7f7 !default;
|
|
|
|
$m-color-gray-dark-v1: #111 !default;
|
|
$m-color-gray-dark-v2: #333 !default;
|
|
$m-color-gray-dark-v3: #555 !default;
|
|
$m-color-gray-dark-v4: #777 !default;
|
|
$m-color-gray-dark-v5: #999 !default;
|
|
|
|
$border-gray: #d0d0d0;
|
|
|
|
|
|
// Color light
|
|
$m-color-light: #f0f0f0;
|
|
|
|
$m-color-secondary: #252525;
|
|
$m-color-primary: #47bac1;
|
|
$m-color-primary-light: #4dc8cf;
|
|
$m-border-light: #e4e4e4;
|
|
|
|
$primary-color-light:#4dc8cf;
|
|
//
|
|
// Status Colors
|
|
|
|
// Color Green
|
|
$m-color-success: #5cb85c !default;
|
|
$m-color-success-dark-v1: darken($m-color-success, 2%) !default;
|
|
$m-color-success-dark-v2: darken($m-color-success, 5%) !default;
|
|
|
|
// Color Green
|
|
$m-color-info: #5bc0de !default;
|
|
$m-color-info-dark-v1: darken($m-color-info, 2%) !default;
|
|
$m-color-info-dark-v2: darken($m-color-info, 5%) !default;
|
|
|
|
// Color Green
|
|
$m-color-warning: #f0ad4e !default;
|
|
$m-color-warning-dark-v1: darken($m-color-warning, 2%) !default;
|
|
$m-color-warning-dark-v2: darken($m-color-warning, 5%) !default;
|
|
|
|
// Color Green
|
|
$m-color-danger: #d9534f !default;
|
|
$m-color-danger-dark-v1: darken($m-color-danger, 2%) !default;
|
|
$m-color-danger-dark-v2: darken($m-color-danger, 5%) !default;
|
|
|
|
//colors
|
|
$white: #fff;
|
|
$black_5: rgba(0,0,0,0.05);
|
|
$black_10: rgba(0,0,0,.1);
|
|
$color_storm_dust_approx: #666;
|
|
$color_mine_shaft_approx: #333;
|
|
|
|
//
|
|
// Colors
|
|
//
|
|
|
|
|
|
// Primary Color
|
|
$g-color-primary: #72c02c !default;
|
|
$g-color-primary-dark-v1: darken($g-color-primary, 2%) !default;
|
|
$g-color-primary-dark-v2: darken($g-color-primary, 5%) !default;
|
|
$g-color-primary-dark-v3: darken($g-color-primary, 10%) !default;
|
|
$g-color-primary-light-v1: rgba($g-color-primary, .2) !default;
|
|
$g-color-primary-light-v2: rgba($g-color-primary, .8) !default; // R
|
|
|
|
// Main Colors
|
|
$m-color-main: #555 !default;
|
|
// $m-color-main: #6f7885 !default;
|
|
$g-bg-color-main: #fff !default;
|
|
|
|
// Main Secondary
|
|
$g-bg-color-secondary: #fafafa !default;
|
|
|
|
// Color Black
|
|
$m-color-black: #000;
|
|
|
|
// Color White
|
|
$m-color-white: #fff;
|
|
|
|
// Color Gray
|
|
$g-color-gray-light-v1: #bbb !default; // $g-color-gray-light-v3
|
|
$g-color-gray-light-v2: #ccc !default; // $g-color-gray-light-v4
|
|
$g-color-gray-light-v3: #ddd !default; // $g-color-gray-light-v6
|
|
$g-color-gray-light-v4: #eee !default; // $g-color-gray-light-v7
|
|
$g-color-gray-light-v5: #f7f7f7 !default; // $g-color-gray-light-v9
|
|
|
|
$g-color-gray-dark-v1: #111 !default; // $g-color-gray-dark-v4:
|
|
$g-color-gray-dark-v2: #333 !default; // $g-color-gray-dark-v2:
|
|
$g-color-gray-dark-v3: #555 !default; // $g-color-gray-dark-v1:
|
|
$g-color-gray-dark-v4: #777 !default; // $g-color-gray:
|
|
$g-color-gray-dark-v5: #999 !default; // $g-color-gray-light-v1:
|
|
|
|
|
|
//
|
|
// Status Colors
|
|
|
|
// Color Green
|
|
$g-color-success: #5cb85c !default;
|
|
$g-color-success-dark-v1: darken($g-color-success, 2%) !default;
|
|
$g-color-success-dark-v2: darken($g-color-success, 5%) !default;
|
|
|
|
// Color Green
|
|
$g-color-info: #5bc0de !default;
|
|
$g-color-info-dark-v1: darken($g-color-info, 2%) !default;
|
|
$g-color-info-dark-v2: darken($g-color-info, 5%) !default;
|
|
|
|
// Color Green
|
|
$g-color-warning: #f0ad4e !default;
|
|
$g-color-warning-dark-v1: darken($g-color-warning, 2%) !default;
|
|
$g-color-warning-dark-v2: darken($g-color-warning, 5%) !default;
|
|
|
|
// Color Green
|
|
$g-color-danger: #d9534f !default;
|
|
$g-color-danger-dark-v1: darken($g-color-danger, 2%) !default;
|
|
$g-color-danger-dark-v2: darken($g-color-danger, 5%) !default;
|
|
|
|
|
|
//
|
|
// Complementary Colors
|
|
|
|
// Color Green
|
|
$g-color-green: #72c02c !default;
|
|
|
|
// Color Blue
|
|
$g-color-blue: #3398dc !default;
|
|
$g-color-blue-dark-v1: darken($g-color-blue, 22%) !default;
|
|
|
|
// Color Light Blue
|
|
$g-color-lightblue: #edf2f8 !default;
|
|
$g-color-lightblue-v1: #d6e2ee !default;
|
|
|
|
// Color Dark Blue
|
|
$g-color-darkblue: #009 !default;
|
|
|
|
// Color Indigo
|
|
$g-color-indigo: #4263a3 !default;
|
|
|
|
// Color Red
|
|
$g-color-red: #f00 !default;
|
|
|
|
// Color Light Red
|
|
$g-color-lightred: #e64b3b !default;
|
|
|
|
// Color Dark Red
|
|
$g-color-darkred: #a10f2b !default;
|
|
|
|
// Color Purple
|
|
$g-color-purple: #9a69cb !default;
|
|
|
|
// Color Dark Purple
|
|
$g-color-darkpurple: #6639b6 !default;
|
|
$g-color-purple-dark-v1: darken($g-color-purple, 27%) !default;
|
|
|
|
// Color Pink
|
|
$g-color-pink: #e81c62 !default;
|
|
$g-color-pink-dark-v1: darken($g-color-pink, 27%) !default;
|
|
|
|
// Color Orange
|
|
$g-color-orange: #e57d20 !default;
|
|
|
|
// Color Deep Orange
|
|
$g-color-deeporange: #fe541e !default;
|
|
|
|
// Color Yellow
|
|
$g-color-yellow: #ebc71d !default;
|
|
|
|
// Color Aqua
|
|
$g-color-aqua: #29d6e6 !default;
|
|
$g-color-aqua-dark-v1: darken($g-color-aqua, 22%) !default;
|
|
|
|
// Color Cyan
|
|
$g-color-cyan: #00bed6 !default;
|
|
|
|
// Color Teal
|
|
$g-color-teal: #18ba9b !default;
|
|
|
|
// Color Brown
|
|
$g-color-brown: #9c8061 !default;
|
|
|
|
// Color Blue Gray
|
|
$g-color-bluegray: #585f69 !default;
|
|
|
|
// Color Beige
|
|
$g-color-beige: #e5e1de !default;
|
|
|
|
|
|
//
|
|
// Social Colors
|
|
|
|
// Facebook Color
|
|
$g-color-facebook: #3b5998 !default;
|
|
$g-color-facebook-dark-v1: darken($g-color-facebook, 5%) !default;
|
|
$g-color-facebook-dark-v2: darken($g-color-facebook, 10%) !default;
|
|
$g-color-facebook-light-v1: lighten($g-color-facebook, 5%) !default;
|
|
|
|
// Twitter Color
|
|
$g-color-twitter: #00acee !default;
|
|
$g-color-twitter-dark-v1: darken($g-color-twitter, 5%) !default;
|
|
$g-color-twitter-dark-v2: darken($g-color-twitter, 10%) !default;
|
|
$g-color-twitter-light-v1: lighten($g-color-twitter, 5%) !default;
|
|
|
|
// Skype Color
|
|
$g-color-skype: #00aff0 !default;
|
|
$g-color-skype-dark-v1: darken($g-color-skype, 5%) !default;
|
|
$g-color-skype-dark-v2: darken($g-color-skype, 10%) !default;
|
|
$g-color-skype-light-v1: lighten($g-color-skype, 5%) !default;
|
|
|
|
// Pinterest Color
|
|
$g-color-pinterest: #c8232c !default;
|
|
$g-color-pinterest-dark-v1: darken($g-color-pinterest, 5%) !default;
|
|
$g-color-pinterest-dark-v2: darken($g-color-pinterest, 10%) !default;
|
|
$g-color-pinterest-light-v1: lighten($g-color-pinterest, 5%) !default;
|
|
|
|
// Vine Color
|
|
$g-color-vine: #00bf8f !default;
|
|
$g-color-vine-dark-v1: darken($g-color-vine, 5%) !default;
|
|
$g-color-vine-dark-v2: darken($g-color-vine, 10%) !default;
|
|
$g-color-vine-light-v1: lighten($g-color-vine, 5%) !default;
|
|
|
|
// Youtube Color
|
|
$g-color-youtube: #c4302b !default;
|
|
$g-color-youtube-dark-v1: darken($g-color-youtube, 5%) !default;
|
|
$g-color-youtube-dark-v2: darken($g-color-youtube, 10%) !default;
|
|
$g-color-youtube-light-v1: lighten($g-color-youtube, 5%) !default;
|
|
|
|
// Google Plus Color
|
|
$g-color-google-plus: #dd4b39 !default;
|
|
$g-color-google-plus-dark-v1: darken($g-color-google-plus, 5%) !default;
|
|
$g-color-google-plus-dark-v2: darken($g-color-google-plus, 10%) !default;
|
|
$g-color-google-plus-light-v1: lighten($g-color-google-plus, 5%) !default;
|
|
|
|
// Dribbble Color
|
|
$g-color-dribbble: #ea4c89 !default;
|
|
$g-color-dribbble-dark-v1: darken($g-color-dribbble, 5%) !default;
|
|
$g-color-dribbble-dark-v2: darken($g-color-dribbble, 10%) !default;
|
|
$g-color-dribbble-light-v1: lighten($g-color-dribbble, 5%) !default;
|
|
|
|
// VK Color
|
|
$g-color-vk: #2b587a !default;
|
|
$g-color-vk-dark-v1: darken($g-color-vk, 5%) !default;
|
|
$g-color-vk-dark-v2: darken($g-color-vk, 10%) !default;
|
|
$g-color-vk-light-v1: lighten($g-color-vk, 5%) !default;
|
|
|
|
// Linkedin Color
|
|
$g-color-linkedin: #0e76a8 !default;
|
|
$g-color-linkedin-dark-v1: darken($g-color-linkedin, 5%) !default;
|
|
$g-color-linkedin-dark-v2: darken($g-color-linkedin, 10%) !default;
|
|
$g-color-linkedin-light-v1: lighten($g-color-linkedin, 5%) !default;
|
|
|
|
// Instagram Color
|
|
$g-color-instagram: #3f729b !default;
|
|
$g-color-instagram-dark-v1: darken($g-color-instagram, 5%) !default;
|
|
$g-color-instagram-dark-v2: darken($g-color-instagram, 10%) !default;
|
|
$g-color-instagram-light-v1: lighten($g-color-instagram, 5%) !default;
|