@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap'); $font-family: 'Open Sans', sans-serif; $color-black0: #000; $color-black: #292929; $color-black-tranparent: rgba(146, 146, 146, 0.48); $color-white: #fff; $color-gray: #6c6c6c; $color-gray2: #7d7d7d; $color-gray3: #f0f0f0; $color-gray4: #c4c4c4; $color-gray5: #e5e5e5; $color-gray6: #929292; $color-gray7: #575757; $color-gray8: rgba(185, 185, 185, 0.6); $color-gray9: #868686; $color-blue: #4267b2; $color-green: #4caf50; /* Grid breakpoints */ $grid-breakpoints: ( xs: 0, cstm: 400, sm: 576px, md: 768px, lg: 992px, xl: 1200px ) !default; $z-index: ( level1: 5, level2: 10, level3: 15, level4: 20, level5: 25 ) !default; //media-queries $mq-desktop: "(min-width: 1025px) and (max-width: 1920px)"; $mq-tablet: "(min-width: 769px) and (max-width: 1024px)"; $mq-mobile: "(min-width: 280px) and (max-width: 768px)";