/* THEME COLORs ========================================================================== */ /* Looks good on chrome default color profile */ /* We will manually convert these primary colors to rgb for the dark mode option of the theme */ /* looks good in sRGB but washed up on chrome default $color-primary: #826bb0; $color-success: #31cb55; $color-info: #5e93ec; $color-warning: #eec559; $color-danger: #dc4b92; $color-fusion: darken(desaturate(adjust-hue($color-primary, 5), 80%), 25%); */ /* Color Polarity ========================================================================== */ /* PAINTBUCKET MIXER ========================================================================== */ /* the grays */ /* the sapphires */ /* the emeralds */ /* the amethyths */ /* the topaz */ /* the rubies */ /* the graphites */ /* Define universal border difition (div outlines, etc) ========================================================================== */ /* MOBILE BREAKPOINT & GUTTERS (contains some bootstrap responsive overrides) ========================================================================== */ /* define when mobile menu activates, here we are declearing (lg) so it targets the one after it */ /* bootstrap reference xs: 0, sm: 544px, md: 768px, lg: 992px, xl: 1200px*/ /* global var used for spacing*/ /* Uniform Padding variable */ /* Heads up! This is a global scoped variable - changing may impact the whole template */ /* BOOTSTRAP OVERRIDES (bootstrap variables) ========================================================================== */ /* usage: theme-colors("primary"); */ /* forms */ /*$input-height: calc(2.25rem + 1px); //I had to add this because the input gruops was having improper height for some reason... */ /* links */ /* checkbox */ /*$custom-file-height-inner: calc(2.25rem - 1px);*/ /* not part of bootstrap variable */ /* custom checkbox */ /* custom range */ /* custom file */ /* badge */ /* cards */ /*border radius*/ /* alert */ /* toast */ /* breadcrumb */ /* input button */ /* nav link */ /* nav, tabs, pills */ /* tables */ /* dropdowns */ /* dropdowns sizes */ /* popovers */ /* tooltips */ /* modal */ /* reference guide http://www.standardista.com/px-to-rem-conversion-if-root-font-size-is-16px/ 8px = 0.5rem 9px = 0.5625rem 10px = 0.625rem 11px = 0.6875rem 12px = 0.75rem 13px = 0.8125rem 14px = 0.875rem 15px = 0.9375rem 16px = 1rem (base) 17px = 1.0625rem 18px = 1.125rem 19px = 1.1875rem 20px = 1.25rem 21px = 1.3125rem 22px = 1.375rem 24px = 1.5rem 25px = 1.5625rem 26px = 1.625rem 28px = 1.75rem 30px = 1.875rem 32px = 2rem 34px = 2.125rem 36px = 2.25rem 38px = 2.375rem 40px = 2.5rem */ /* Fonts */ /* carousel */ /* BASE VARS ========================================================================== */ /* font vars below will auto change to rem values using function rem($value)*/ /* 11px */ /* 12px */ /* 12.5px */ /* 14px */ /* 15px */ /* 16px */ /* 28px */ /* Font Family ========================================================================== */ /*hint: you can also try the font called 'Poppins' by replacing the font 'Roboto' */ /* ANIMATIONS ========================================================================== */ /* this addresses all animation related to nav hide to nav minify */ /* Z-INDEX declearation ========================================================================== */ /* we adjust bootstrap z-index to be higher than our higest z-index*/ /* CUSTOM ICON PREFIX ========================================================================== */ /* PRINT CSS (landscape or portrait) ========================================================================== */ /* landscape or portrait */ /* auto, letter */ /* Common Element Variables ========================================================================== */ /* Z-index decleartion "birds eye view" ========================================================================== */ /* Components ========================================================================== */ /* PAGE HEADER STUFF ========================================================================== */ /* colors */ /* height */ /* logo */ /* try not to go beywond the width of $main_nav_width value */ /* you may need to change this depending on your logo design */ /* adjust this as you see fit : left, right, center */ /* icon font size (not button) */ /* search input box */ /* suggestion: #ccced0*/ /* btn */ /* dropdown: app list */ /* badge */ /* COMPONENTS & MODS */ /* NAVIGATION STUFF Guide: aside.page-sidebar ($nav-width, $nav-background) .page-logo .primary-nav .info-card ul.nav-menu li a (parent level-0..., $nav-link-color, $nav-link-hover-color, $nav-link-hover-bg-color, $nav-link-hover-left-border-color) icon span collapse-sign ul.nav-menu-sub-one li a ($nav-level-1... $nav-sub-link-height) span collapse-sign ul.nav-menu-sub-two li a ($nav-level-2... $nav-sub-link-height) span p.nav-title ($nav-title-*...) ========================================================================== */ /* main navigation */ /* left panel */ /* nav footer */ /* nav parent level-0 */ /* nav link level-1 */ /* nav level-1 bg */ /* nav icon sizes */ /* badge default */ /* all child */ /* nav title */ /* nav Minify */ /* when the menu pops on hover */ /* navigation Width */ /* partial visibility of the menu */ /* top navigation */ /* nav Info Card (appears below the logo) */ /* width is auto */ /* nav DL labels for all child */ /* will be pulled to left as a negative value */ /* MISC Settings ========================================================================== */ /* List Table */ /* PAGE SETTINGS ========================================================================== */ /* PAGE BREADCRUMB ========================================================================== */ /* PAGE COMPONENT PANELS ========================================================================== */ /* PAGE COMPONENT PROGRESSBARS ========================================================================== */ /* PAGE COMPONENT MESSENGER ========================================================================== */ /* FOOTER ========================================================================== */ /* GLOBALS ========================================================================== */ /* ACCESSIBILITIES */ /* SHORTCUT BUTTON (appears on bottom right of the page) */ /* GULP WARNINGS */ /*// Container ratio $ct-container-ratio: (1/1.618) !default; // Text styles for labels $ct-text-color: rgba(0, 0, 0, 0.4) !default; $ct-text-size: 0.75rem !default; $ct-text-align: flex-start !default; $ct-text-justify: flex-start !default; $ct-text-line-height: 1; // Grid styles $ct-grid-color: rgba(0, 0, 0, 0.2) !default; $ct-grid-dasharray: 2px !default; $ct-grid-width: 1px !default; $ct-grid-background-fill: none !default; // Line chart properties $ct-line-width: 4px !default; $ct-line-dasharray: false !default; // Line chart point, can be either round or square $ct-point-shape: round !default; // Area fill transparency between 0 and 1 $ct-area-opacity: 0.1 !default; // Bar chart bar width $ct-bar-width: 10px !default; // Donut width (If donut width is to big it can cause issues where the shape gets distorted) $ct-donut-width: 60px !default; */ .ct-label { fill: rgba(0, 0, 0, 0.4); color: rgba(0, 0, 0, 0.4); font-size: 0.75rem; line-height: 1; } .ct-chart-line .ct-label, .ct-chart-bar .ct-label { display: block; display: -webkit-box; display: -ms-flexbox; display: flex; } .ct-chart-pie .ct-label, .ct-chart-donut .ct-label { dominant-baseline: central; } .ct-label.ct-horizontal.ct-start { -webkit-box-align: flex-end; -ms-flex-align: flex-end; align-items: flex-end; -webkit-box-pack: flex-start; -ms-flex-pack: flex-start; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-label.ct-horizontal.ct-end { -webkit-box-align: flex-start; -ms-flex-align: flex-start; align-items: flex-start; -webkit-box-pack: flex-start; -ms-flex-pack: flex-start; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-label.ct-vertical.ct-start { -webkit-box-align: flex-end; -ms-flex-align: flex-end; align-items: flex-end; -webkit-box-pack: flex-end; -ms-flex-pack: flex-end; justify-content: flex-end; text-align: right; text-anchor: end; } .ct-label.ct-vertical.ct-end { -webkit-box-align: flex-end; -ms-flex-align: flex-end; align-items: flex-end; -webkit-box-pack: flex-start; -ms-flex-pack: flex-start; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-chart-bar .ct-label.ct-horizontal.ct-start { -webkit-box-align: flex-end; -ms-flex-align: flex-end; align-items: flex-end; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; text-anchor: start; } .ct-chart-bar .ct-label.ct-horizontal.ct-end { -webkit-box-align: flex-start; -ms-flex-align: flex-start; align-items: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; text-anchor: start; } .ct-chart-bar.ct-horizontal-bars .ct-label.ct-horizontal.ct-start { -webkit-box-align: flex-end; -ms-flex-align: flex-end; align-items: flex-end; -webkit-box-pack: flex-start; -ms-flex-pack: flex-start; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-chart-bar.ct-horizontal-bars .ct-label.ct-horizontal.ct-end { -webkit-box-align: flex-start; -ms-flex-align: flex-start; align-items: flex-start; -webkit-box-pack: flex-start; -ms-flex-pack: flex-start; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-chart-bar.ct-horizontal-bars .ct-label.ct-vertical.ct-start { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: flex-end; -ms-flex-pack: flex-end; justify-content: flex-end; text-align: right; text-anchor: end; } .ct-chart-bar.ct-horizontal-bars .ct-label.ct-vertical.ct-end { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: flex-start; -ms-flex-pack: flex-start; justify-content: flex-start; text-align: left; text-anchor: end; } .ct-grid { stroke: rgba(0, 0, 0, 0.2); stroke-width: 1px; stroke-dasharray: 2px; } .ct-grid-background { fill: none; } .ct-point { stroke-width: 7px; stroke-linecap: round; } .ct-line { fill: none; stroke-width: 4px; } .ct-area { stroke: none; fill-opacity: 0.1; } .ct-bar { fill: none; stroke-width: 10px; } .ct-slice-donut { fill: none; stroke-width: 60px; } .ct-series-a .ct-point, .ct-series-a .ct-line, .ct-series-a .ct-bar, .ct-series-a .ct-slice-donut { stroke: #886ab5; } .ct-series-a .ct-slice-pie, .ct-series-a .ct-slice-donut-solid, .ct-series-a .ct-area { fill: #886ab5; } .ct-series-b .ct-point, .ct-series-b .ct-line, .ct-series-b .ct-bar, .ct-series-b .ct-slice-donut { stroke: #fd3995; } .ct-series-b .ct-slice-pie, .ct-series-b .ct-slice-donut-solid, .ct-series-b .ct-area { fill: #fd3995; } .ct-series-c .ct-point, .ct-series-c .ct-line, .ct-series-c .ct-bar, .ct-series-c .ct-slice-donut { stroke: #ffc241; } .ct-series-c .ct-slice-pie, .ct-series-c .ct-slice-donut-solid, .ct-series-c .ct-area { fill: #ffc241; } .ct-series-d .ct-point, .ct-series-d .ct-line, .ct-series-d .ct-bar, .ct-series-d .ct-slice-donut { stroke: #2196F3; } .ct-series-d .ct-slice-pie, .ct-series-d .ct-slice-donut-solid, .ct-series-d .ct-area { fill: #2196F3; } .ct-series-e .ct-point, .ct-series-e .ct-line, .ct-series-e .ct-bar, .ct-series-e .ct-slice-donut { stroke: #505050; } .ct-series-e .ct-slice-pie, .ct-series-e .ct-slice-donut-solid, .ct-series-e .ct-area { fill: #505050; } .ct-series-f .ct-point, .ct-series-f .ct-line, .ct-series-f .ct-bar, .ct-series-f .ct-slice-donut { stroke: #1dc9b7; } .ct-series-f .ct-slice-pie, .ct-series-f .ct-slice-donut-solid, .ct-series-f .ct-area { fill: #1dc9b7; } .ct-series-g .ct-point, .ct-series-g .ct-line, .ct-series-g .ct-bar, .ct-series-g .ct-slice-donut { stroke: #2196F3; } .ct-series-g .ct-slice-pie, .ct-series-g .ct-slice-donut-solid, .ct-series-g .ct-area { fill: #2196F3; } .ct-series-h .ct-point, .ct-series-h .ct-line, .ct-series-h .ct-bar, .ct-series-h .ct-slice-donut { stroke: #563d7c; } .ct-series-h .ct-slice-pie, .ct-series-h .ct-slice-donut-solid, .ct-series-h .ct-area { fill: #563d7c; } .ct-series-i .ct-point, .ct-series-i .ct-line, .ct-series-i .ct-bar, .ct-series-i .ct-slice-donut { stroke: #fe9ecb; } .ct-series-i .ct-slice-pie, .ct-series-i .ct-slice-donut-solid, .ct-series-i .ct-area { fill: #fe9ecb; } .ct-series-j .ct-point, .ct-series-j .ct-line, .ct-series-j .ct-bar, .ct-series-j .ct-slice-donut { stroke: #ffdb8e; } .ct-series-j .ct-slice-pie, .ct-series-j .ct-slice-donut-solid, .ct-series-j .ct-area { fill: #ffdb8e; } .ct-series-k .ct-point, .ct-series-k .ct-line, .ct-series-k .ct-bar, .ct-series-k .ct-slice-donut { stroke: #ce0262; } .ct-series-k .ct-slice-pie, .ct-series-k .ct-slice-donut-solid, .ct-series-k .ct-area { fill: #ce0262; } .ct-series-l .ct-point, .ct-series-l .ct-line, .ct-series-l .ct-bar, .ct-series-l .ct-slice-donut { stroke: dimgray; } .ct-series-l .ct-slice-pie, .ct-series-l .ct-slice-donut-solid, .ct-series-l .ct-area { fill: dimgray; } .ct-series-m .ct-point, .ct-series-m .ct-line, .ct-series-m .ct-bar, .ct-series-m .ct-slice-donut { stroke: #37e2d0; } .ct-series-m .ct-slice-pie, .ct-series-m .ct-slice-donut-solid, .ct-series-m .ct-area { fill: #37e2d0; } .ct-series-n .ct-point, .ct-series-n .ct-line, .ct-series-n .ct-bar, .ct-series-n .ct-slice-donut { stroke: #51adf6; } .ct-series-n .ct-slice-pie, .ct-series-n .ct-slice-donut-solid, .ct-series-n .ct-area { fill: #51adf6; } .ct-series-o .ct-point, .ct-series-o .ct-line, .ct-series-o .ct-bar, .ct-series-o .ct-slice-donut { stroke: #a38cc6; } .ct-series-o .ct-slice-pie, .ct-series-o .ct-slice-donut-solid, .ct-series-o .ct-area { fill: #a38cc6; } .ct-square { display: block; position: relative; width: 100%; } .ct-square:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 100%; } .ct-square:after { content: ""; display: table; clear: both; } .ct-square > svg { display: block; position: absolute; top: 0; left: 0; } .ct-minor-second { display: block; position: relative; width: 100%; } .ct-minor-second:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 93.75%; } .ct-minor-second:after { content: ""; display: table; clear: both; } .ct-minor-second > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-second { display: block; position: relative; width: 100%; } .ct-major-second:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 88.88889%; } .ct-major-second:after { content: ""; display: table; clear: both; } .ct-major-second > svg { display: block; position: absolute; top: 0; left: 0; } .ct-minor-third { display: block; position: relative; width: 100%; } .ct-minor-third:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 83.33333%; } .ct-minor-third:after { content: ""; display: table; clear: both; } .ct-minor-third > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-third { display: block; position: relative; width: 100%; } .ct-major-third:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 80%; } .ct-major-third:after { content: ""; display: table; clear: both; } .ct-major-third > svg { display: block; position: absolute; top: 0; left: 0; } .ct-perfect-fourth { display: block; position: relative; width: 100%; } .ct-perfect-fourth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 75%; } .ct-perfect-fourth:after { content: ""; display: table; clear: both; } .ct-perfect-fourth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-perfect-fifth { display: block; position: relative; width: 100%; } .ct-perfect-fifth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 66.66667%; } .ct-perfect-fifth:after { content: ""; display: table; clear: both; } .ct-perfect-fifth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-minor-sixth { display: block; position: relative; width: 100%; } .ct-minor-sixth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 62.5%; } .ct-minor-sixth:after { content: ""; display: table; clear: both; } .ct-minor-sixth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-golden-section { display: block; position: relative; width: 100%; } .ct-golden-section:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 61.8047%; } .ct-golden-section:after { content: ""; display: table; clear: both; } .ct-golden-section > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-sixth { display: block; position: relative; width: 100%; } .ct-major-sixth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 60%; } .ct-major-sixth:after { content: ""; display: table; clear: both; } .ct-major-sixth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-minor-seventh { display: block; position: relative; width: 100%; } .ct-minor-seventh:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 56.25%; } .ct-minor-seventh:after { content: ""; display: table; clear: both; } .ct-minor-seventh > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-seventh { display: block; position: relative; width: 100%; } .ct-major-seventh:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 53.33333%; } .ct-major-seventh:after { content: ""; display: table; clear: both; } .ct-major-seventh > svg { display: block; position: absolute; top: 0; left: 0; } .ct-octave { display: block; position: relative; width: 100%; } .ct-octave:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 50%; } .ct-octave:after { content: ""; display: table; clear: both; } .ct-octave > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-tenth { display: block; position: relative; width: 100%; } .ct-major-tenth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 40%; } .ct-major-tenth:after { content: ""; display: table; clear: both; } .ct-major-tenth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-eleventh { display: block; position: relative; width: 100%; } .ct-major-eleventh:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 37.5%; } .ct-major-eleventh:after { content: ""; display: table; clear: both; } .ct-major-eleventh > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-twelfth { display: block; position: relative; width: 100%; } .ct-major-twelfth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 33.33333%; } .ct-major-twelfth:after { content: ""; display: table; clear: both; } .ct-major-twelfth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-double-octave { display: block; position: relative; width: 100%; } .ct-double-octave:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 25%; } .ct-double-octave:after { content: ""; display: table; clear: both; } .ct-double-octave > svg { display: block; position: absolute; top: 0; left: 0; } /*# sourceMappingURL=chartist.css.map */