diff --git a/.gitignore b/.gitignore deleted file mode 100644 index 9187e99..0000000 --- a/.gitignore +++ /dev/null @@ -1,6 +0,0 @@ -node_modules -.cache -public/** -vendor/ -components/_preview.twig -build \ No newline at end of file diff --git a/.vscode/launch.json b/.vscode/launch.json deleted file mode 100644 index a0eb8bf..0000000 --- a/.vscode/launch.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - // Use IntelliSense to learn about possible attributes. - // Hover to view descriptions of existing attributes. - // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 - "version": "0.2.0", - "configurations": [ - { - "type": "node", - "request": "attach", - "name": "Attach by Process ID", - "processId": "${command:PickProcess}", - "skipFiles": [ - "/**" - ] - } - - ] -} \ No newline at end of file diff --git a/.vscode/settings.json b/.vscode/settings.json deleted file mode 100644 index 6ec66dd..0000000 --- a/.vscode/settings.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "files.associations": { - "*.html":"twig" - }, - "emmet.includeLanguages": { - "twig": "html" - } -} \ No newline at end of file diff --git a/assets/images/3-m-logo.svg b/3-m-logo.svg similarity index 100% rename from assets/images/3-m-logo.svg rename to 3-m-logo.svg diff --git a/assets/fonts/Gotham-Bold.woff b/Gotham-Bold.e0086ceb.woff similarity index 100% rename from assets/fonts/Gotham-Bold.woff rename to Gotham-Bold.e0086ceb.woff diff --git a/assets/fonts/Gotham-Book.woff b/Gotham-Book.cbd028d1.woff similarity index 100% rename from assets/fonts/Gotham-Book.woff rename to Gotham-Book.cbd028d1.woff diff --git a/assets/fonts/Gotham-Light.woff b/Gotham-Light.a4815ad0.woff similarity index 100% rename from assets/fonts/Gotham-Light.woff rename to Gotham-Light.a4815ad0.woff diff --git a/assets/fonts/Gotham-Medium.woff b/Gotham-Medium.3fafac78.woff similarity index 100% rename from assets/fonts/Gotham-Medium.woff rename to Gotham-Medium.3fafac78.woff diff --git a/assets/fonts/Gotham-Thin.woff b/Gotham-Thin.40a22451.woff similarity index 100% rename from assets/fonts/Gotham-Thin.woff rename to Gotham-Thin.40a22451.woff diff --git a/assets/fonts/Gotham-Ultra.woff b/Gotham-Ultra.e0d48fcb.woff similarity index 100% rename from assets/fonts/Gotham-Ultra.woff rename to Gotham-Ultra.e0d48fcb.woff diff --git a/README.md b/README.md deleted file mode 100644 index 64be78a..0000000 --- a/README.md +++ /dev/null @@ -1,38 +0,0 @@ -#alldata components - -## requires -* nodejs >= 8.12.0 - -## install dependencies -```js -npm install -``` - -## run in dev mode -```js -npm run startdev -``` - -# how to create a component - - - -## install yeoman globally -```js - npm install -g yeoman -``` - -## open the folder -```js - cd generator-fractal-component/ -``` - -## run the command -```js - npm link -``` - -## go back to the root folder and run -```js - yo fractal-component -``` diff --git a/_preview.twig b/_preview.twig deleted file mode 100644 index d305fc5..0000000 --- a/_preview.twig +++ /dev/null @@ -1,15 +0,0 @@ - - - - - kykyn - - - - - - {{ yield | raw }} - - - - \ No newline at end of file diff --git a/_previewprod.html b/_previewprod.html index a1280d8..10b258c 100644 --- a/_previewprod.html +++ b/_previewprod.html @@ -1,18 +1,16 @@ - + + + + kykyn + + + + + - - - kykyn - - - - - - - - {{ yield | raw }} - - - - \ No newline at end of file + + {{ yield | raw }} + + + diff --git a/assets/images/asa-logo.svg b/asa-logo.svg similarity index 100% rename from assets/images/asa-logo.svg rename to asa-logo.svg diff --git a/assets.html b/assets.html new file mode 100644 index 0000000..e8604ea --- /dev/null +++ b/assets.html @@ -0,0 +1,13 @@ + + + + + + Redirecting… + + + +

Redirecting to / …

+ + + diff --git a/assets/js/bootstrap.js b/assets/js/bootstrap.js deleted file mode 100644 index 6d97d3c..0000000 --- a/assets/js/bootstrap.js +++ /dev/null @@ -1,34 +0,0 @@ -// import Alert from 'bootstrap/js/src/alert' -// import Button from 'bootstrap/js/src/button' -import Carousel from 'bootstrap/js/src/carousel' -// import Collapse from 'bootstrap/js/src/collapse' -// import Dropdown from 'bootstrap/js/src/dropdown' -// import Modal from 'bootstrap/js/src/modal' -// import Popover from 'bootstrap/js/src/popover' -// import Scrollspy from 'bootstrap/js/src/scrollspy' -// import Tab from 'bootstrap/js/src/tab' -// import Toast from 'bootstrap/js/src/toast' -// import Tooltip from 'bootstrap/js/src/tooltip' -// import Util from 'bootstrap/js/src/util' - -/** - * -------------------------------------------------------------------------- - * Bootstrap (v4.4.1): index.js - * Licensed under MIT (https://github.com/twbs/bootstrap/js/blob/master/LICENSE) - * -------------------------------------------------------------------------- - */ - -export { -// Util, -// Alert, -// Button, - Carousel, -// Collapse, -// Dropdown, -// Modal, -// Popover, -// Scrollspy, -// Tab, -// Toast, -// Tooltip -} diff --git a/assets/js/index.js b/assets/js/index.js deleted file mode 100644 index cdc17f2..0000000 --- a/assets/js/index.js +++ /dev/null @@ -1,41 +0,0 @@ -import "../favicon.ico"; -import "./bootstrap"; -import "../../components/groups/header/header"; -import "../../components/01-units/button/button"; -import "../../components/blocks/jumbo/jumbo"; -import "../../components/01-units/skew/skew"; -import "../../components/01-units/threelines/threelines"; -import "../../components/01-units/heading/heading"; -import "../../components/01-units/simpletext/simpletext"; -import "../../components/02-layout/cols/cols"; -import "../../components/blocks/brandingcard/brandingcard"; -import "../../components/01-units/image/image"; -import "../../components/01-units/unitmacros/unitmacros"; -import "../../components/groups/branding/branding"; -import "../../components/groups/hero/hero"; -import "../../components/01-units/tricolor/tricolor"; -import "../../components/01-units/slider/slider"; -import "../../components/pages/homePage/homePage"; -import "../../components/blocks/shadow-box/shadow-box"; -import "../../components/01-units/quote/quote"; -import "../../components/groups/testimonial/testimonial"; -import "../../components/groups/servicescards/servicescards"; -import "../../components/blocks/servcard/servcard"; -import "../../components/blocks/imageblue/imageblue"; -import "../../components/01-units/cardlink/cardlink"; -import "../../components/01-units/companies/companies"; -import "../../components/groups/latest/latest"; -import "../../components/blocks/latestCard/latestCard"; -import "../../components/01-units/latestHeading/latestHeading"; -import "../../components/groups/whatwedo/whatwedo"; -import "../../components/01-units/video/video"; -import "../../components/groups/footer/footer"; -import "../../components/blocks/collapse-list/collapse-list"; -import "../../components/groups/Affilliations/Affilliations"; -import "../../components/01-units/drupalitemsfacade/drupalitemsfacade"; -import "../../components/groups/whoweserve/whoweserve"; -import "../../components/01-units/servcard2/servcard2"; -import "../../components/groups/serve-wedo/serve-wedo"; -import "../../components/groups/whoweserve/whoweserve"; -import "../../components/01-units/servcard2/servcard2"; -import "../../components/pages/demo01172020/demo01172020"; diff --git a/assets/scss/_customVariables.scss b/assets/scss/_customVariables.scss deleted file mode 100644 index 6918fb1..0000000 --- a/assets/scss/_customVariables.scss +++ /dev/null @@ -1,11 +0,0 @@ -.shadow-box{ - box-shadow: 0 42px 44px 0 rgba(0, 0, 0, 0.05); -} - -.fill-relative-parent{ - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; -} \ No newline at end of file diff --git a/assets/scss/_fonts.scss b/assets/scss/_fonts.scss deleted file mode 100644 index 933f434..0000000 --- a/assets/scss/_fonts.scss +++ /dev/null @@ -1,65 +0,0 @@ - -/* ======================= */ - -@font-face { - font-family: 'Gotham'; - src: local('Gotham Medium'), local('Gotham-Medium'), - url(../fonts/Gotham-Medium.woff); - font-weight: 500; - font-style: normal; - } - - @font-face { - font-family: 'Gotham Ultra'; - src: local('Gotham Ultra'), local('Gotham-Ultra'), - url(../fonts/Gotham-Ultra.woff); - font-weight: normal; - font-style: normal; - } - - @font-face { - font-family: 'Gotham Book'; - src: local('Gotham Book'), local('Gotham-Book'), - url(../fonts/Gotham-Book.woff); - font-weight: normal; - font-style: normal; - } - - @font-face { - font-family: 'Gotham'; - src: local('Gotham Light'), local('Gotham-Light'), - url(../fonts/Gotham-Light.woff); - font-weight: 300; - font-style: normal; - } - - @font-face { - font-family: 'Gotham'; - src: local('Gotham Thin'), local('Gotham-Thin'), - url(../fonts/Gotham-Thin.woff); - font-weight: 100; - font-style: normal; - } - - @font-face { - font-family: 'Gotham'; - src: local('Gotham Bold'), local('Gotham-Bold'), - url(../fonts/Gotham-Bold.woff); - font-weight: bold; - font-style: normal; - } - - - html, body{ - font-family: 'Gotham'; - } - - @function fromPxtoRem($px) { - $result: ( $px / 16 ) * 1rem ; - @return $result; - } - - @mixin fontSize($size ) { - // convert from px to rem $size is an integert without px example 18 - font-size: ($size / 16) * 1rem; - } \ No newline at end of file diff --git a/assets/scss/_spacing.scss b/assets/scss/_spacing.scss deleted file mode 100644 index c9f40a1..0000000 --- a/assets/scss/_spacing.scss +++ /dev/null @@ -1,65 +0,0 @@ -// stylelint-disable declaration-no-important - -// Margin and Padding in vw -$spacersvw: () !default; -$oneColumn: 4.16; -// stylelint-disable-next-line scss/dollar-variable-default -$spacersvw: map-merge( - ( - 4vw: ($oneColumn * 1vw), - 8vw: ($oneColumn * 2vw), - 16vw: ($oneColumn * 4vw), - ), - $spacersvw -); - -@each $breakpoint in map-keys($grid-breakpoints) { - @include media-breakpoint-up($breakpoint) { - $infix: breakpoint-infix($breakpoint, $grid-breakpoints); - - @each $prop, $abbrev in (margin: m, padding: p) { - @each $size, $length in $spacersvw { - .#{$abbrev}#{$infix}-#{$size} { #{$prop}: $length ; } - .#{$abbrev}t#{$infix}-#{$size}, - .#{$abbrev}y#{$infix}-#{$size} { - #{$prop}-top: $length ; - } - .#{$abbrev}r#{$infix}-#{$size}, - .#{$abbrev}x#{$infix}-#{$size} { - #{$prop}-right: $length ; - } - .#{$abbrev}b#{$infix}-#{$size}, - .#{$abbrev}y#{$infix}-#{$size} { - #{$prop}-bottom: $length ; - } - .#{$abbrev}l#{$infix}-#{$size}, - .#{$abbrev}x#{$infix}-#{$size} { - #{$prop}-left: $length ; - } - } - } - - // Negative margins (e.g., where `.mb-n1` is negative version of `.mb-1`) - @each $size, $length in $spacers { - @if $size != 0 { - .m#{$infix}-n#{$size} { margin: -$length ; } - .mt#{$infix}-n#{$size}, - .my#{$infix}-n#{$size} { - margin-top: -$length ; - } - .mr#{$infix}-n#{$size}, - .mx#{$infix}-n#{$size} { - margin-right: -$length ; - } - .mb#{$infix}-n#{$size}, - .my#{$infix}-n#{$size} { - margin-bottom: -$length ; - } - .ml#{$infix}-n#{$size}, - .mx#{$infix}-n#{$size} { - margin-left: -$length ; - } - } - } - } -} diff --git a/assets/scss/_variables.scss b/assets/scss/_variables.scss deleted file mode 100644 index fe36fe4..0000000 --- a/assets/scss/_variables.scss +++ /dev/null @@ -1,1144 +0,0 @@ -// Variables -// -// Variables should follow the `$component-state-property-size` formula for -// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs. - -// Color system - -$white: #fff !default; -$gray-100: #f8f9fa !default; -$gray-200: #e9ecef !default; -$gray-300: #dee2e6 !default; -$gray-400: #ced4da !default; -$gray-500: #adb5bd !default; -$gray-600: #6c757d !default; -$gray-650: #54565a !default; -$gray-700: #495057 !default; -$gray-800: #343a40 !default; -$gray-900: #212529 !default; -$black: #000 !default; - -$grays: () !default; -// stylelint-disable-next-line scss/dollar-variable-default -$grays: map-merge( - ( - "100": $gray-100, - "200": $gray-200, - "300": $gray-300, - "400": $gray-400, - "500": $gray-500, - "600": $gray-600, - "700": $gray-700, - "800": $gray-800, - "900": $gray-900 - ), - $grays -); - -$blue: #1b3d6e !default; -$indigo: #6610f2 !default; -$purple: #6f42c1 !default; -$pink: #e83e8c !default; -$red: #dc3545 !default; -$orange: #f16824 !default; -$yellow: #ffc107 !default; -$green: #28a745 !default; -$teal: #20c997 !default; -$cyan: #17a2b8 !default; - -$colors: () !default; -// stylelint-disable-next-line scss/dollar-variable-default -$colors: map-merge( - ( - "blue": $blue, - "indigo": $indigo, - "purple": $purple, - "pink": $pink, - "red": $red, - "orange": $orange, - "yellow": $yellow, - "green": $green, - "teal": $teal, - "cyan": $cyan, - "white": $white, - "gray": $gray-600, - "gray-dark": $gray-800 - ), - $colors -); - -$primary: $blue !default; -$secondary: $orange !default; -$success: $green !default; -$info: $cyan !default; -$warning: $yellow !default; -$danger: $red !default; -$light: $gray-100 !default; -$dark: $gray-800 !default; - -$theme-colors: () !default; -// stylelint-disable-next-line scss/dollar-variable-default -$theme-colors: map-merge( - ( - "primary": $primary, - "secondary": $secondary, - "success": $success, - "info": $info, - "warning": $warning, - "danger": $danger, - "light": $light, - "dark": $dark - ), - $theme-colors -); - -// Set a specific jump point for requesting color jumps -$theme-color-interval: 8% !default; - -// The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255. -$yiq-contrasted-threshold: 150 !default; - -// Customize the light and dark text colors for use in our YIQ color contrast function. -$yiq-text-dark: $gray-900 !default; -$yiq-text-light: $white !default; - -// Characters which are escaped by the escape-svg function -$escaped-characters: ( - ("<","%3c"), - (">","%3e"), - ("#","%23"), -) !default; - - -// Options -// -// Quickly modify global styling by enabling or disabling optional features. - -$enable-caret: true !default; -$enable-rounded: false !default; -$enable-shadows: false !default; -$enable-gradients: false !default; -$enable-transitions: true !default; -$enable-prefers-reduced-motion-media-query: true !default; -$enable-hover-media-query: false !default; // Deprecated, no longer affects any compiled CSS -$enable-grid-classes: true !default; -$enable-pointer-cursor-for-buttons: true !default; -$enable-print-styles: true !default; -$enable-responsive-font-sizes: false !default; -$enable-validation-icons: true !default; -$enable-deprecation-messages: true !default; - - -// Spacing -// -// Control the default styling of most Bootstrap elements by modifying these -// variables. Mostly focused on spacing. -// You can add more entries to the $spacers map, should you need more variation. - -$spacer: 1rem !default; -$spacers: () !default; -// stylelint-disable-next-line scss/dollar-variable-default -$spacers: map-merge( - ( - 0: 0, - 1: ($spacer * .25), - 2: ($spacer * .5), - 3: $spacer, - 4: ($spacer * 1.5), - 5: ($spacer * 3) - ), - $spacers -); - -// This variable affects the `.h-*` and `.w-*` classes. -$sizes: () !default; -// stylelint-disable-next-line scss/dollar-variable-default -$sizes: map-merge( - ( - 25: 25%, - 50: 50%, - 75: 75%, - 100: 100%, - auto: auto - ), - $sizes -); - - -// Body -// -// Settings for the `` element. - -$body-bg: $white !default; -$body-color: $gray-900 !default; - - -// Links -// -// Style anchor elements. - -$link-color: theme-color("primary") !default; -$link-decoration: none !default; -$link-hover-color: darken($link-color, 15%) !default; -$link-hover-decoration: underline !default; -// Darken percentage for links with `.text-*` class (e.g. `.text-success`) -$emphasized-link-hover-darken-percentage: 15% !default; - -// Paragraphs -// -// Style p element. - -$paragraph-margin-bottom: 1rem !default; - - -// Grid breakpoints -// -// Define the minimum dimensions at which your layout will change, -// adapting to different screen sizes, for use in media queries. - -$grid-breakpoints: ( - xs: 0, - sm: 576px, - md: 768px, - lg: 992px, - xl: 1200px -) !default; - -@include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); -@include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints"); - - -// Grid containers -// -// Define the maximum width of `.container` for different screen sizes. - -$container-max-widths: ( - sm: 540px, - md: 720px, - lg: 960px, - xl: 1140px -) !default; - -@include _assert-ascending($container-max-widths, "$container-max-widths"); - - -// Grid columns -// -// Set the number of columns and specify the width of the gutters. - -$grid-columns: 12 !default; -$grid-gutter-width: 30px !default; -$grid-row-columns: 6 !default; - - -// Components -// -// Define common padding and border radius sizes and more. - -$line-height-lg: 1.5 !default; -$line-height-sm: 1.5 !default; - -$border-width: 1px !default; -$border-color: $gray-300 !default; - -$border-radius: .25rem !default; -$border-radius-lg: .3rem !default; -$border-radius-sm: .2rem !default; - -$rounded-pill: 50rem !default; - -$box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default; -$box-shadow: 0 .5rem 1rem rgba($black, .15) !default; -$box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default; - -$component-active-color: $white !default; -$component-active-bg: theme-color("primary") !default; - -$caret-width: .3em !default; -$caret-vertical-align: $caret-width * .85 !default; -$caret-spacing: $caret-width * .85 !default; - -$transition-base: all .2s ease-in-out !default; -$transition-fade: opacity .15s linear !default; -$transition-collapse: height .35s ease !default; - -$embed-responsive-aspect-ratios: () !default; -// stylelint-disable-next-line scss/dollar-variable-default -$embed-responsive-aspect-ratios: join( - ( - (21 9), - (16 9), - (4 3), - (1 1), - ), - $embed-responsive-aspect-ratios -); - -// Typography -// -// Font, line-height, and color for body text, headings, and more. - -// stylelint-disable value-keyword-case -$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default; -$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default; -$font-family-base: $font-family-sans-serif !default; -// stylelint-enable value-keyword-case - -$font-size-base: 1rem !default; // Assumes the browser default, typically `16px` -$font-size-lg: $font-size-base * 1.25 !default; -$font-size-sm: $font-size-base * .875 !default; - -$font-weight-lighter: lighter !default; -$font-weight-light: 300 !default; -$font-weight-normal: 400 !default; -$font-weight-bold: 700 !default; -$font-weight-bolder: bolder !default; - -$font-weight-base: $font-weight-normal !default; -$line-height-base: 1.5 !default; - -$h1-font-size: $font-size-base * 2.5 !default; -$h2-font-size: $font-size-base * 2 !default; -$h3-font-size: $font-size-base * 1.75 !default; -$h4-font-size: $font-size-base * 1.5 !default; -$h5-font-size: $font-size-base * 1.25 !default; -$h6-font-size: $font-size-base !default; - -$headings-margin-bottom: $spacer / 2 !default; -$headings-font-family: null !default; -$headings-font-weight: 500 !default; -$headings-line-height: 1.2 !default; -$headings-color: null !default; - -$display1-size: 6rem !default; -$display2-size: 5.5rem !default; -$display3-size: 4.5rem !default; -$display4-size: 3.5rem !default; - -$display1-weight: 300 !default; -$display2-weight: 300 !default; -$display3-weight: 300 !default; -$display4-weight: 300 !default; -$display-line-height: $headings-line-height !default; - -$lead-font-size: $font-size-base * 1.25 !default; -$lead-font-weight: 300 !default; - -$small-font-size: 80% !default; - -$text-muted: $gray-600 !default; - -$blockquote-small-color: $gray-600 !default; -$blockquote-small-font-size: $small-font-size !default; -$blockquote-font-size: $font-size-base * 1.25 !default; - -$hr-border-color: rgba($black, .1) !default; -$hr-border-width: $border-width !default; - -$mark-padding: .2em !default; - -$dt-font-weight: $font-weight-bold !default; - -$kbd-box-shadow: inset 0 -.1rem 0 rgba($black, .25) !default; -$nested-kbd-font-weight: $font-weight-bold !default; - -$list-inline-padding: .5rem !default; - -$mark-bg: #fcf8e3 !default; - -$hr-margin-y: $spacer !default; - - -// Tables -// -// Customizes the `.table` component with basic values, each used across all table variations. - -$table-cell-padding: .75rem !default; -$table-cell-padding-sm: .3rem !default; - -$table-color: $body-color !default; -$table-bg: null !default; -$table-accent-bg: rgba($black, .05) !default; -$table-hover-color: $table-color !default; -$table-hover-bg: rgba($black, .075) !default; -$table-active-bg: $table-hover-bg !default; - -$table-border-width: $border-width !default; -$table-border-color: $border-color !default; - -$table-head-bg: $gray-200 !default; -$table-head-color: $gray-700 !default; - -$table-dark-color: $white !default; -$table-dark-bg: $gray-800 !default; -$table-dark-accent-bg: rgba($white, .05) !default; -$table-dark-hover-color: $table-dark-color !default; -$table-dark-hover-bg: rgba($white, .075) !default; -$table-dark-border-color: lighten($table-dark-bg, 7.5%) !default; - -$table-striped-order: odd !default; - -$table-caption-color: $text-muted !default; - -$table-bg-level: -9 !default; -$table-border-level: -6 !default; - - -// Buttons + Forms -// -// Shared variables that are reassigned to `$input-` and `$btn-` specific variables. - -$input-btn-padding-y: .375rem !default; -$input-btn-padding-x: .75rem !default; -$input-btn-font-family: null !default; -$input-btn-font-size: $font-size-base !default; -$input-btn-line-height: $line-height-base !default; - -$input-btn-focus-width: .2rem !default; -$input-btn-focus-color: rgba($component-active-bg, .25) !default; -$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default; - -$input-btn-padding-y-sm: .25rem !default; -$input-btn-padding-x-sm: .5rem !default; -$input-btn-font-size-sm: $font-size-sm !default; -$input-btn-line-height-sm: $line-height-sm !default; - -$input-btn-padding-y-lg: .5rem !default; -$input-btn-padding-x-lg: 1rem !default; -$input-btn-font-size-lg: $font-size-lg !default; -$input-btn-line-height-lg: $line-height-lg !default; - -$input-btn-border-width: $border-width !default; - - -// Buttons -// -// For each of Bootstrap's buttons, define text, background, and border color. - -$btn-padding-y: $input-btn-padding-y !default; -$btn-padding-x: $input-btn-padding-x !default; -$btn-font-family: $input-btn-font-family !default; -$btn-font-size: $input-btn-font-size !default; -$btn-line-height: $input-btn-line-height !default; -$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping - -$btn-padding-y-sm: $input-btn-padding-y-sm !default; -$btn-padding-x-sm: $input-btn-padding-x-sm !default; -$btn-font-size-sm: $input-btn-font-size-sm !default; -$btn-line-height-sm: $input-btn-line-height-sm !default; - -$btn-padding-y-lg: $input-btn-padding-y-lg !default; -$btn-padding-x-lg: $input-btn-padding-x-lg !default; -$btn-font-size-lg: $input-btn-font-size-lg !default; -$btn-line-height-lg: $input-btn-line-height-lg !default; - -$btn-border-width: $input-btn-border-width !default; - -$btn-font-weight: $font-weight-normal !default; -$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default; -$btn-focus-width: $input-btn-focus-width !default; -$btn-focus-box-shadow: $input-btn-focus-box-shadow !default; -$btn-disabled-opacity: .65 !default; -$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default; - -$btn-link-disabled-color: $gray-600 !default; - -$btn-block-spacing-y: .5rem !default; - -// Allows for customizing button radius independently from global border radius -$btn-border-radius: $border-radius !default; -$btn-border-radius-lg: $border-radius-lg !default; -$btn-border-radius-sm: $border-radius-sm !default; - -$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; - - -// Forms - -$label-margin-bottom: .5rem !default; - -$input-padding-y: $input-btn-padding-y !default; -$input-padding-x: $input-btn-padding-x !default; -$input-font-family: $input-btn-font-family !default; -$input-font-size: $input-btn-font-size !default; -$input-font-weight: $font-weight-base !default; -$input-line-height: $input-btn-line-height !default; - -$input-padding-y-sm: $input-btn-padding-y-sm !default; -$input-padding-x-sm: $input-btn-padding-x-sm !default; -$input-font-size-sm: $input-btn-font-size-sm !default; -$input-line-height-sm: $input-btn-line-height-sm !default; - -$input-padding-y-lg: $input-btn-padding-y-lg !default; -$input-padding-x-lg: $input-btn-padding-x-lg !default; -$input-font-size-lg: $input-btn-font-size-lg !default; -$input-line-height-lg: $input-btn-line-height-lg !default; - -$input-bg: $white !default; -$input-disabled-bg: $gray-200 !default; - -$input-color: $gray-700 !default; -$input-border-color: $gray-400 !default; -$input-border-width: $input-btn-border-width !default; -$input-box-shadow: inset 0 1px 1px rgba($black, .075) !default; - -$input-border-radius: $border-radius !default; -$input-border-radius-lg: $border-radius-lg !default; -$input-border-radius-sm: $border-radius-sm !default; - -$input-focus-bg: $input-bg !default; -$input-focus-border-color: lighten($component-active-bg, 25%) !default; -$input-focus-color: $input-color !default; -$input-focus-width: $input-btn-focus-width !default; -$input-focus-box-shadow: $input-btn-focus-box-shadow !default; - -$input-placeholder-color: $gray-600 !default; -$input-plaintext-color: $body-color !default; - -$input-height-border: $input-border-width * 2 !default; - -$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default; -$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default; -$input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y / 2) !default; - -$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default; -$input-height-sm: add($input-line-height-sm * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default; -$input-height-lg: add($input-line-height-lg * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default; - -$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; - -$form-text-margin-top: .25rem !default; - -$form-check-input-gutter: 1.25rem !default; -$form-check-input-margin-y: .3rem !default; -$form-check-input-margin-x: .25rem !default; - -$form-check-inline-margin-x: .75rem !default; -$form-check-inline-input-margin-x: .3125rem !default; - -$form-grid-gutter-width: 10px !default; -$form-group-margin-bottom: 1rem !default; - -$input-group-addon-color: $input-color !default; -$input-group-addon-bg: $gray-200 !default; -$input-group-addon-border-color: $input-border-color !default; - -$custom-forms-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; - -$custom-control-gutter: .5rem !default; -$custom-control-spacer-x: 1rem !default; -$custom-control-cursor: null !default; - -$custom-control-indicator-size: 1rem !default; -$custom-control-indicator-bg: $input-bg !default; - -$custom-control-indicator-bg-size: 50% 50% !default; -$custom-control-indicator-box-shadow: $input-box-shadow !default; -$custom-control-indicator-border-color: $gray-500 !default; -$custom-control-indicator-border-width: $input-border-width !default; - -$custom-control-label-color: null !default; - -$custom-control-indicator-disabled-bg: $input-disabled-bg !default; -$custom-control-label-disabled-color: $gray-600 !default; - -$custom-control-indicator-checked-color: $component-active-color !default; -$custom-control-indicator-checked-bg: $component-active-bg !default; -$custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default; -$custom-control-indicator-checked-box-shadow: none !default; -$custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default; - -$custom-control-indicator-focus-box-shadow: $input-focus-box-shadow !default; -$custom-control-indicator-focus-border-color: $input-focus-border-color !default; - -$custom-control-indicator-active-color: $component-active-color !default; -$custom-control-indicator-active-bg: lighten($component-active-bg, 35%) !default; -$custom-control-indicator-active-box-shadow: none !default; -$custom-control-indicator-active-border-color: $custom-control-indicator-active-bg !default; - -$custom-checkbox-indicator-border-radius: $border-radius !default; -$custom-checkbox-indicator-icon-checked: url("data:image/svg+xml,") !default; - -$custom-checkbox-indicator-indeterminate-bg: $component-active-bg !default; -$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default; -$custom-checkbox-indicator-icon-indeterminate: url("data:image/svg+xml,") !default; -$custom-checkbox-indicator-indeterminate-box-shadow: none !default; -$custom-checkbox-indicator-indeterminate-border-color: $custom-checkbox-indicator-indeterminate-bg !default; - -$custom-radio-indicator-border-radius: 50% !default; -$custom-radio-indicator-icon-checked: url("data:image/svg+xml,") !default; - -$custom-switch-width: $custom-control-indicator-size * 1.75 !default; -$custom-switch-indicator-border-radius: $custom-control-indicator-size / 2 !default; -$custom-switch-indicator-size: subtract($custom-control-indicator-size, $custom-control-indicator-border-width * 4) !default; - -$custom-select-padding-y: $input-padding-y !default; -$custom-select-padding-x: $input-padding-x !default; -$custom-select-font-family: $input-font-family !default; -$custom-select-font-size: $input-font-size !default; -$custom-select-height: $input-height !default; -$custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator -$custom-select-font-weight: $input-font-weight !default; -$custom-select-line-height: $input-line-height !default; -$custom-select-color: $input-color !default; -$custom-select-disabled-color: $gray-600 !default; -$custom-select-bg: $input-bg !default; -$custom-select-disabled-bg: $gray-200 !default; -$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions -$custom-select-indicator-color: $gray-800 !default; -$custom-select-indicator: url("data:image/svg+xml,") !default; -$custom-select-background: escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon) - -$custom-select-feedback-icon-padding-right: add(1em * .75, (2 * $custom-select-padding-y * .75) + $custom-select-padding-x + $custom-select-indicator-padding) !default; -$custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default; -$custom-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default; - -$custom-select-border-width: $input-border-width !default; -$custom-select-border-color: $input-border-color !default; -$custom-select-border-radius: $border-radius !default; -$custom-select-box-shadow: inset 0 1px 2px rgba($black, .075) !default; - -$custom-select-focus-border-color: $input-focus-border-color !default; -$custom-select-focus-width: $input-focus-width !default; -$custom-select-focus-box-shadow: 0 0 0 $custom-select-focus-width $input-btn-focus-color !default; - -$custom-select-padding-y-sm: $input-padding-y-sm !default; -$custom-select-padding-x-sm: $input-padding-x-sm !default; -$custom-select-font-size-sm: $input-font-size-sm !default; -$custom-select-height-sm: $input-height-sm !default; - -$custom-select-padding-y-lg: $input-padding-y-lg !default; -$custom-select-padding-x-lg: $input-padding-x-lg !default; -$custom-select-font-size-lg: $input-font-size-lg !default; -$custom-select-height-lg: $input-height-lg !default; - -$custom-range-track-width: 100% !default; -$custom-range-track-height: .5rem !default; -$custom-range-track-cursor: pointer !default; -$custom-range-track-bg: $gray-300 !default; -$custom-range-track-border-radius: 1rem !default; -$custom-range-track-box-shadow: inset 0 .25rem .25rem rgba($black, .1) !default; - -$custom-range-thumb-width: 1rem !default; -$custom-range-thumb-height: $custom-range-thumb-width !default; -$custom-range-thumb-bg: $component-active-bg !default; -$custom-range-thumb-border: 0 !default; -$custom-range-thumb-border-radius: 1rem !default; -$custom-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default; -$custom-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default; -$custom-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in IE/Edge -$custom-range-thumb-active-bg: lighten($component-active-bg, 35%) !default; -$custom-range-thumb-disabled-bg: $gray-500 !default; - -$custom-file-height: $input-height !default; -$custom-file-height-inner: $input-height-inner !default; -$custom-file-focus-border-color: $input-focus-border-color !default; -$custom-file-focus-box-shadow: $input-focus-box-shadow !default; -$custom-file-disabled-bg: $input-disabled-bg !default; - -$custom-file-padding-y: $input-padding-y !default; -$custom-file-padding-x: $input-padding-x !default; -$custom-file-line-height: $input-line-height !default; -$custom-file-font-family: $input-font-family !default; -$custom-file-font-weight: $input-font-weight !default; -$custom-file-color: $input-color !default; -$custom-file-bg: $input-bg !default; -$custom-file-border-width: $input-border-width !default; -$custom-file-border-color: $input-border-color !default; -$custom-file-border-radius: $input-border-radius !default; -$custom-file-box-shadow: $input-box-shadow !default; -$custom-file-button-color: $custom-file-color !default; -$custom-file-button-bg: $input-group-addon-bg !default; -$custom-file-text: ( - en: "Browse" -) !default; - - -// Form validation - -$form-feedback-margin-top: $form-text-margin-top !default; -$form-feedback-font-size: $small-font-size !default; -$form-feedback-valid-color: theme-color("success") !default; -$form-feedback-invalid-color: theme-color("danger") !default; - -$form-feedback-icon-valid-color: $form-feedback-valid-color !default; -$form-feedback-icon-valid: url("data:image/svg+xml,") !default; -$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default; -$form-feedback-icon-invalid: url("data:image/svg+xml,") !default; - -$form-validation-states: () !default; -// stylelint-disable-next-line scss/dollar-variable-default -$form-validation-states: map-merge( - ( - "valid": ( - "color": $form-feedback-valid-color, - "icon": $form-feedback-icon-valid - ), - "invalid": ( - "color": $form-feedback-invalid-color, - "icon": $form-feedback-icon-invalid - ), - ), - $form-validation-states -); - -// Z-index master list -// -// Warning: Avoid customizing these values. They're used for a bird's eye view -// of components dependent on the z-axis and are designed to all work together. - -$zindex-dropdown: 1000 !default; -$zindex-sticky: 1020 !default; -$zindex-fixed: 1030 !default; -$zindex-modal-backdrop: 1040 !default; -$zindex-modal: 1050 !default; -$zindex-popover: 1060 !default; -$zindex-tooltip: 1070 !default; - - -// Navs - -$nav-link-padding-y: .5rem !default; -$nav-link-padding-x: 1rem !default; -$nav-link-disabled-color: $gray-600 !default; - -$nav-tabs-border-color: $gray-300 !default; -$nav-tabs-border-width: $border-width !default; -$nav-tabs-border-radius: $border-radius !default; -$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default; -$nav-tabs-link-active-color: $gray-700 !default; -$nav-tabs-link-active-bg: $body-bg !default; -$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default; - -$nav-pills-border-radius: $border-radius !default; -$nav-pills-link-active-color: $component-active-color !default; -$nav-pills-link-active-bg: $component-active-bg !default; - -$nav-divider-color: $gray-200 !default; -$nav-divider-margin-y: $spacer / 2 !default; - - -// Navbar - -$navbar-padding-y: $spacer / 2 !default; -$navbar-padding-x: $spacer !default; - -$navbar-nav-link-padding-x: .5rem !default; - -$navbar-brand-font-size: $font-size-lg !default; -// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link -$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default; -$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default; -$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default; - -$navbar-toggler-padding-y: .25rem !default; -$navbar-toggler-padding-x: .75rem !default; -$navbar-toggler-font-size: $font-size-lg !default; -$navbar-toggler-border-radius: $btn-border-radius !default; - -$navbar-dark-color: rgba($white, .5) !default; -$navbar-dark-hover-color: rgba($white, .75) !default; -$navbar-dark-active-color: $white !default; -$navbar-dark-disabled-color: rgba($white, .25) !default; -$navbar-dark-toggler-icon-bg: url("data:image/svg+xml,") !default; -$navbar-dark-toggler-border-color: rgba($white, .1) !default; - -$navbar-light-color: rgba($black, .5) !default; -$navbar-light-hover-color: rgba($black, .7) !default; -$navbar-light-active-color: rgba($black, .9) !default; -$navbar-light-disabled-color: rgba($black, .3) !default; -$navbar-light-toggler-icon-bg: url("data:image/svg+xml,") !default; -$navbar-light-toggler-border-color: rgba($black, .1) !default; - -$navbar-light-brand-color: $navbar-light-active-color !default; -$navbar-light-brand-hover-color: $navbar-light-active-color !default; -$navbar-dark-brand-color: $navbar-dark-active-color !default; -$navbar-dark-brand-hover-color: $navbar-dark-active-color !default; - - -// Dropdowns -// -// Dropdown menu container and contents. - -$dropdown-min-width: 10rem !default; -$dropdown-padding-y: .5rem !default; -$dropdown-spacer: .125rem !default; -$dropdown-font-size: $font-size-base !default; -$dropdown-color: $body-color !default; -$dropdown-bg: $white !default; -$dropdown-border-color: rgba($black, .15) !default; -$dropdown-border-radius: $border-radius !default; -$dropdown-border-width: $border-width !default; -$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default; -$dropdown-divider-bg: $gray-200 !default; -$dropdown-divider-margin-y: $nav-divider-margin-y !default; -$dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default; - -$dropdown-link-color: $gray-900 !default; -$dropdown-link-hover-color: darken($gray-900, 5%) !default; -$dropdown-link-hover-bg: $gray-100 !default; - -$dropdown-link-active-color: $component-active-color !default; -$dropdown-link-active-bg: $component-active-bg !default; - -$dropdown-link-disabled-color: $gray-600 !default; - -$dropdown-item-padding-y: .25rem !default; -$dropdown-item-padding-x: 1.5rem !default; - -$dropdown-header-color: $gray-600 !default; - - -// Pagination - -$pagination-padding-y: .5rem !default; -$pagination-padding-x: .75rem !default; -$pagination-padding-y-sm: .25rem !default; -$pagination-padding-x-sm: .5rem !default; -$pagination-padding-y-lg: .75rem !default; -$pagination-padding-x-lg: 1.5rem !default; -$pagination-line-height: 1.25 !default; - -$pagination-color: $link-color !default; -$pagination-bg: $white !default; -$pagination-border-width: $border-width !default; -$pagination-border-color: $gray-300 !default; - -$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default; -$pagination-focus-outline: 0 !default; - -$pagination-hover-color: $link-hover-color !default; -$pagination-hover-bg: $gray-200 !default; -$pagination-hover-border-color: $gray-300 !default; - -$pagination-active-color: $component-active-color !default; -$pagination-active-bg: $component-active-bg !default; -$pagination-active-border-color: $pagination-active-bg !default; - -$pagination-disabled-color: $gray-600 !default; -$pagination-disabled-bg: $white !default; -$pagination-disabled-border-color: $gray-300 !default; - - -// Jumbotron - -$jumbotron-padding: 2rem !default; -$jumbotron-color: null !default; -$jumbotron-bg: $gray-200 !default; - - -// Cards - -$card-spacer-y: .75rem !default; -$card-spacer-x: 1.25rem !default; -$card-border-width: $border-width !default; -$card-border-radius: $border-radius !default; -$card-border-color: rgba($black, .125) !default; -$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default; -$card-cap-bg: rgba($black, .03) !default; -$card-cap-color: null !default; -$card-height: null !default; -$card-color: null !default; -$card-bg: $white !default; - -$card-img-overlay-padding: 1.25rem !default; - -$card-group-margin: $grid-gutter-width / 2 !default; -$card-deck-margin: $card-group-margin !default; - -$card-columns-count: 3 !default; -$card-columns-gap: 1.25rem !default; -$card-columns-margin: $card-spacer-y !default; - - -// Tooltips - -$tooltip-font-size: $font-size-sm !default; -$tooltip-max-width: 200px !default; -$tooltip-color: $white !default; -$tooltip-bg: $black !default; -$tooltip-border-radius: $border-radius !default; -$tooltip-opacity: .9 !default; -$tooltip-padding-y: .25rem !default; -$tooltip-padding-x: .5rem !default; -$tooltip-margin: 0 !default; - -$tooltip-arrow-width: .8rem !default; -$tooltip-arrow-height: .4rem !default; -$tooltip-arrow-color: $tooltip-bg !default; - -// Form tooltips must come after regular tooltips -$form-feedback-tooltip-padding-y: $tooltip-padding-y !default; -$form-feedback-tooltip-padding-x: $tooltip-padding-x !default; -$form-feedback-tooltip-font-size: $tooltip-font-size !default; -$form-feedback-tooltip-line-height: $line-height-base !default; -$form-feedback-tooltip-opacity: $tooltip-opacity !default; -$form-feedback-tooltip-border-radius: $tooltip-border-radius !default; - - -// Popovers - -$popover-font-size: $font-size-sm !default; -$popover-bg: $white !default; -$popover-max-width: 276px !default; -$popover-border-width: $border-width !default; -$popover-border-color: rgba($black, .2) !default; -$popover-border-radius: $border-radius-lg !default; -$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default; -$popover-box-shadow: 0 .25rem .5rem rgba($black, .2) !default; - -$popover-header-bg: darken($popover-bg, 3%) !default; -$popover-header-color: $headings-color !default; -$popover-header-padding-y: .5rem !default; -$popover-header-padding-x: .75rem !default; - -$popover-body-color: $body-color !default; -$popover-body-padding-y: $popover-header-padding-y !default; -$popover-body-padding-x: $popover-header-padding-x !default; - -$popover-arrow-width: 1rem !default; -$popover-arrow-height: .5rem !default; -$popover-arrow-color: $popover-bg !default; - -$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default; - - -// Toasts - -$toast-max-width: 350px !default; -$toast-padding-x: .75rem !default; -$toast-padding-y: .25rem !default; -$toast-font-size: .875rem !default; -$toast-color: null !default; -$toast-background-color: rgba($white, .85) !default; -$toast-border-width: 1px !default; -$toast-border-color: rgba(0, 0, 0, .1) !default; -$toast-border-radius: .25rem !default; -$toast-box-shadow: 0 .25rem .75rem rgba($black, .1) !default; - -$toast-header-color: $gray-600 !default; -$toast-header-background-color: rgba($white, .85) !default; -$toast-header-border-color: rgba(0, 0, 0, .05) !default; - - -// Badges - -$badge-font-size: 75% !default; -$badge-font-weight: $font-weight-bold !default; -$badge-padding-y: .25em !default; -$badge-padding-x: .4em !default; -$badge-border-radius: $border-radius !default; - -$badge-transition: $btn-transition !default; -$badge-focus-width: $input-btn-focus-width !default; - -$badge-pill-padding-x: .6em !default; -// Use a higher than normal value to ensure completely rounded edges when -// customizing padding or font-size on labels. -$badge-pill-border-radius: 10rem !default; - - -// Modals - -// Padding applied to the modal body -$modal-inner-padding: 1rem !default; - -// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding -$modal-footer-margin-between: .5rem !default; - -$modal-dialog-margin: .5rem !default; -$modal-dialog-margin-y-sm-up: 1.75rem !default; - -$modal-title-line-height: $line-height-base !default; - -$modal-content-color: null !default; -$modal-content-bg: $white !default; -$modal-content-border-color: rgba($black, .2) !default; -$modal-content-border-width: $border-width !default; -$modal-content-border-radius: $border-radius-lg !default; -$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default; -$modal-content-box-shadow-xs: 0 .25rem .5rem rgba($black, .5) !default; -$modal-content-box-shadow-sm-up: 0 .5rem 1rem rgba($black, .5) !default; - -$modal-backdrop-bg: $black !default; -$modal-backdrop-opacity: .5 !default; -$modal-header-border-color: $border-color !default; -$modal-footer-border-color: $modal-header-border-color !default; -$modal-header-border-width: $modal-content-border-width !default; -$modal-footer-border-width: $modal-header-border-width !default; -$modal-header-padding-y: 1rem !default; -$modal-header-padding-x: 1rem !default; -$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility - -$modal-xl: 1140px !default; -$modal-lg: 800px !default; -$modal-md: 500px !default; -$modal-sm: 300px !default; - -$modal-fade-transform: translate(0, -50px) !default; -$modal-show-transform: none !default; -$modal-transition: transform .3s ease-out !default; -$modal-scale-transform: scale(1.02) !default; - - -// Alerts -// -// Define alert colors, border radius, and padding. - -$alert-padding-y: .75rem !default; -$alert-padding-x: 1.25rem !default; -$alert-margin-bottom: 1rem !default; -$alert-border-radius: $border-radius !default; -$alert-link-font-weight: $font-weight-bold !default; -$alert-border-width: $border-width !default; - -$alert-bg-level: -10 !default; -$alert-border-level: -9 !default; -$alert-color-level: 6 !default; - - -// Progress bars - -$progress-height: 1rem !default; -$progress-font-size: $font-size-base * .75 !default; -$progress-bg: $gray-200 !default; -$progress-border-radius: $border-radius !default; -$progress-box-shadow: inset 0 .1rem .1rem rgba($black, .1) !default; -$progress-bar-color: $white !default; -$progress-bar-bg: theme-color("primary") !default; -$progress-bar-animation-timing: 1s linear infinite !default; -$progress-bar-transition: width .6s ease !default; - - -// List group - -$list-group-color: null !default; -$list-group-bg: $white !default; -$list-group-border-color: rgba($black, .125) !default; -$list-group-border-width: $border-width !default; -$list-group-border-radius: $border-radius !default; - -$list-group-item-padding-y: .75rem !default; -$list-group-item-padding-x: 1.25rem !default; - -$list-group-hover-bg: $gray-100 !default; -$list-group-active-color: $component-active-color !default; -$list-group-active-bg: $component-active-bg !default; -$list-group-active-border-color: $list-group-active-bg !default; - -$list-group-disabled-color: $gray-600 !default; -$list-group-disabled-bg: $list-group-bg !default; - -$list-group-action-color: $gray-700 !default; -$list-group-action-hover-color: $list-group-action-color !default; - -$list-group-action-active-color: $body-color !default; -$list-group-action-active-bg: $gray-200 !default; - - -// Image thumbnails - -$thumbnail-padding: .25rem !default; -$thumbnail-bg: $body-bg !default; -$thumbnail-border-width: $border-width !default; -$thumbnail-border-color: $gray-300 !default; -$thumbnail-border-radius: $border-radius !default; -$thumbnail-box-shadow: 0 1px 2px rgba($black, .075) !default; - - -// Figures - -$figure-caption-font-size: 90% !default; -$figure-caption-color: $gray-600 !default; - - -// Breadcrumbs - -$breadcrumb-font-size: null !default; - -$breadcrumb-padding-y: .75rem !default; -$breadcrumb-padding-x: 1rem !default; -$breadcrumb-item-padding: .5rem !default; - -$breadcrumb-margin-bottom: 1rem !default; - -$breadcrumb-bg: $gray-200 !default; -$breadcrumb-divider-color: $gray-600 !default; -$breadcrumb-active-color: $gray-600 !default; -$breadcrumb-divider: quote("/") !default; - -$breadcrumb-border-radius: $border-radius !default; - - -// Carousel - -$carousel-control-color: $white !default; -$carousel-control-width: 15% !default; -$carousel-control-opacity: .5 !default; -$carousel-control-hover-opacity: .9 !default; -$carousel-control-transition: opacity .15s ease !default; - -$carousel-indicator-width: 30px !default; -$carousel-indicator-height: 3px !default; -$carousel-indicator-hit-area-height: 10px !default; -$carousel-indicator-spacer: 3px !default; -$carousel-indicator-active-bg: $white !default; -$carousel-indicator-transition: opacity .6s ease !default; - -$carousel-caption-width: 70% !default; -$carousel-caption-color: $white !default; - -$carousel-control-icon-width: 20px !default; - -$carousel-control-prev-icon-bg: url("data:image/svg+xml,") !default; -$carousel-control-next-icon-bg: url("data:image/svg+xml,") !default; - -$carousel-transition-duration: .6s !default; -$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`) - - -// Spinners - -$spinner-width: 2rem !default; -$spinner-height: $spinner-width !default; -$spinner-border-width: .25em !default; - -$spinner-width-sm: 1rem !default; -$spinner-height-sm: $spinner-width-sm !default; -$spinner-border-width-sm: .2em !default; - - -// Close - -$close-font-size: $font-size-base * 1.5 !default; -$close-font-weight: $font-weight-bold !default; -$close-color: $black !default; -$close-text-shadow: 0 1px 0 $white !default; - - -// Code - -$code-font-size: 87.5% !default; -$code-color: $pink !default; - -$kbd-padding-y: .2rem !default; -$kbd-padding-x: .4rem !default; -$kbd-font-size: $code-font-size !default; -$kbd-color: $white !default; -$kbd-bg: $gray-900 !default; - -$pre-color: $gray-900 !default; -$pre-scrollable-max-height: 340px !default; - - -// Utilities - -$displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default; -$overflows: auto, hidden !default; -$positions: static, relative, absolute, fixed, sticky !default; - - -// Printing - -$print-page-size: a3 !default; -$print-body-min-width: map-get($grid-breakpoints, "lg") !default; diff --git a/assets/scss/bootstrap.scss b/assets/scss/bootstrap.scss deleted file mode 100644 index 3c1d9de..0000000 --- a/assets/scss/bootstrap.scss +++ /dev/null @@ -1,37 +0,0 @@ -@import "~bootstrap/scss/_functions"; -@import "variables"; -@import "~bootstrap/scss/_mixins"; -@import "~bootstrap/scss/_root"; -@import "~bootstrap/scss/_reboot"; -@import "~bootstrap/scss/_type"; -@import "~bootstrap/scss/_images"; -@import "~bootstrap/scss/_code"; -@import "~bootstrap/scss/_grid"; -@import "~bootstrap/scss/_tables"; -@import "~bootstrap/scss/_forms"; -@import "~bootstrap/scss/_buttons"; -@import "~bootstrap/scss/_transitions"; -@import "~bootstrap/scss/_dropdown"; -@import "~bootstrap/scss/_button-group"; -@import "~bootstrap/scss/_input-group"; -@import "~bootstrap/scss/_custom-forms"; -@import "~bootstrap/scss/_nav"; -@import "~bootstrap/scss/_navbar"; -@import "~bootstrap/scss/_card"; -@import "~bootstrap/scss/_breadcrumb"; -@import "~bootstrap/scss/_pagination"; -@import "~bootstrap/scss/_badge"; -@import "~bootstrap/scss/_jumbotron"; -@import "~bootstrap/scss/_alert"; -@import "~bootstrap/scss/_progress"; -@import "~bootstrap/scss/_media"; -@import "~bootstrap/scss/_list-group"; -@import "~bootstrap/scss/_close"; -@import "~bootstrap/scss/_toasts"; -@import "~bootstrap/scss/_modal"; -@import "~bootstrap/scss/_tooltip"; -@import "~bootstrap/scss/_popover"; -@import "~bootstrap/scss/_carousel"; -@import "~bootstrap/scss/_spinners"; -@import "~bootstrap/scss/_utilities"; -@import "~bootstrap/scss/_print"; \ No newline at end of file diff --git a/assets/scss/global.scss b/assets/scss/global.scss deleted file mode 100644 index a129255..0000000 --- a/assets/scss/global.scss +++ /dev/null @@ -1,60 +0,0 @@ -// $color1: rebeccapurple; -// @import "../components/**/*.scss"; - -// Import a Google Font -// @import url('https://fonts.googleapis.com/css?family=Nunito:400,700'); -// h2{ -// color:yellow; -// } -$color1: green; - -//@import '~@fortawesome/fontawesome-free/scss/fontawesome'; -@import "./bootstrap"; - -@import "./customVariables"; -@import "./spacing"; -@import "./fonts"; - -// @import "~bulma/sass/components/level.sass"; -// @import "~bulma/sass/components/navbar.sass"; -// @import "../../components/**/*.scss"; - -@import "../../components/groups/header/header"; -@import "../../components/01-units/button/button"; -@import "../../components/blocks/jumbo/jumbo"; -@import "../../components/01-units/skew/skew"; -@import "../../components/01-units/threelines/threelines"; -@import "../../components/01-units/heading/heading"; -@import "../../components/01-units/simpletext/simpletext"; -@import "../../components/02-layout/cols/cols"; -@import "../../components/blocks/brandingcard/brandingcard"; -@import "../../components/01-units/image/image"; -@import "../../components/01-units/unitmacros/unitmacros"; -@import "../../components/groups/branding/branding"; -@import "../../components/groups/hero/hero"; -@import "../../components/01-units/tricolor/tricolor"; -@import "../../components/01-units/slider/slider"; -@import "../../components/pages/homePage/homePage"; -@import "../../components/blocks/shadow-box/shadow-box"; -@import "../../components/01-units/quote/quote"; -@import "../../components/groups/testimonial/testimonial"; -@import "../../components/groups/servicescards/servicescards"; -@import "../../components/blocks/servcard/servcard"; -@import "../../components/blocks/imageblue/imageblue"; -@import "../../components/01-units/cardlink/cardlink"; -@import "../../components/01-units/companies/companies"; -@import "../../components/groups/latest/latest"; -@import "../../components/blocks/latestCard/latestCard"; -@import "../../components/01-units/latestHeading/latestHeading"; -@import "../../components/groups/whatwedo/whatwedo"; -@import "../../components/01-units/video/video"; -@import "../../components/groups/footer/footer"; -@import "../../components/blocks/collapse-list/collapse-list"; -@import "../../components/groups/Affilliations/Affilliations"; -@import "../../components/01-units/drupalitemsfacade/drupalitemsfacade"; -@import "../../components/groups/whoweserve/whoweserve"; -@import "../../components/01-units/servcard2/servcard2"; -@import "../../components/groups/serve-wedo/serve-wedo"; -@import "../../components/groups/whoweserve/whoweserve"; -@import "../../components/01-units/servcard2/servcard2"; -@import "../../components/pages/demo01172020/demo01172020"; diff --git a/assets/images/bg-img-wedo.png b/bg-img-wedo.png similarity index 100% rename from assets/images/bg-img-wedo.png rename to bg-img-wedo.png diff --git a/assets/images/bg-wedo.png b/bg-wedo.png similarity index 100% rename from assets/images/bg-wedo.png rename to bg-wedo.png diff --git a/assets/images/bosch-logo.svg b/bosch-logo.svg similarity index 100% rename from assets/images/bosch-logo.svg rename to bosch-logo.svg diff --git a/assets/images/burguermenu.svg b/burguermenu.svg similarity index 100% rename from assets/images/burguermenu.svg rename to burguermenu.svg diff --git a/assets/images/carfix.jpg b/carfix.jpg similarity index 100% rename from assets/images/carfix.jpg rename to carfix.jpg diff --git a/assets/images/carfix2.jpg b/carfix2.d50b2060.jpg similarity index 100% rename from assets/images/carfix2.jpg rename to carfix2.d50b2060.jpg diff --git a/assets/scss/assets/images/carfix2.jpg b/carfix2.jpg similarity index 100% rename from assets/scss/assets/images/carfix2.jpg rename to carfix2.jpg diff --git a/assets/images/carmax-logo.svg b/carmax-logo.svg similarity index 100% rename from assets/images/carmax-logo.svg rename to carmax-logo.svg diff --git a/assets/images/cart.svg b/cart.svg similarity index 100% rename from assets/images/cart.svg rename to cart.svg diff --git a/assets/images/closemenu.svg b/closemenu.svg similarity index 100% rename from assets/images/closemenu.svg rename to closemenu.svg diff --git a/components.html b/components.html new file mode 100644 index 0000000..e8604ea --- /dev/null +++ b/components.html @@ -0,0 +1,13 @@ + + + + + + Redirecting… + + + +

Redirecting to / …

+ + + diff --git a/components/01-units/button/README.md b/components/01-units/button/README.md deleted file mode 100644 index 14ec5f0..0000000 --- a/components/01-units/button/README.md +++ /dev/null @@ -1,31 +0,0 @@ -# button component - -implicit context - -``` -{% include '@button' %} -``` - -explicit context - -``` -{% include '@button' with {"btnText": "This is an button component!"} %} - -``` - - - -This template for this component looks like this: - -``` -{{view '@button'}} -``` - -and it therefore expects a set of data to render it that is in the following format: - -``` -{{context '@button'}} -``` diff --git a/components/01-units/button/button.config.json b/components/01-units/button/button.config.json deleted file mode 100644 index f941dbc..0000000 --- a/components/01-units/button/button.config.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "title": "button component", - "context": { - "btnText": "This is an button component!" - } -} diff --git a/components/01-units/button/button.twig b/components/01-units/button/button.twig deleted file mode 100644 index 660cc6f..0000000 --- a/components/01-units/button/button.twig +++ /dev/null @@ -1 +0,0 @@ - diff --git a/components/01-units/cardlink/cardlink.config.json b/components/01-units/cardlink/cardlink.config.json deleted file mode 100644 index 7650538..0000000 --- a/components/01-units/cardlink/cardlink.config.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "title": "cardlink component", - "context": { - "textLink": "Learn more", - "link": "https://www.google.com" - } -} diff --git a/components/01-units/cardlink/cardlink.twig b/components/01-units/cardlink/cardlink.twig deleted file mode 100644 index eb71812..0000000 --- a/components/01-units/cardlink/cardlink.twig +++ /dev/null @@ -1,3 +0,0 @@ - -{{textLink}} - diff --git a/components/01-units/companies/companies--bs.twig b/components/01-units/companies/companies--bs.twig deleted file mode 100644 index 44a6c7e..0000000 --- a/components/01-units/companies/companies--bs.twig +++ /dev/null @@ -1,33 +0,0 @@ -{% set MB_NUMBER = 6 %} -{% set DK_NUMBER = 5 %} -{% set countMobile = companies.length / MB_NUMBER %} -{% set countMobile = countMobile|round(0, 'ceil') %} -{% set countDesktop = companies.length / DK_NUMBER %} -{% set countDesktop = countDesktop|round(0, 'ceil') %} -{% set lenght = companies.length %} -{% set template = 'companies--page' %} - -
-
- - {% set modelsMB = [] %} - - {% for idx in 0..(countMobile-1) %} - {% set modelsMB = modelsMB|merge([ {companies: companies|slice((idx* MB_NUMBER), MB_NUMBER)}]) %} - {% endfor %} - - {% include "@slider--dyn" with {carouselId: 'carouselCompanyMB', models : modelsMB, sameHeight: true, template : template, controlsBottom: true} %} - - -
- -
- {% set modelsDK = [] %} - {% for idx in 0..(countDesktop-1) %} - {% set modelsDK = modelsDK|merge([ {companies: companies|slice((idx* DK_NUMBER), DK_NUMBER)}]) %} - {% endfor %} - {% include "@slider--dyn" with {carouselId: 'carouselCompanyDK', models : modelsDK, sameHeight: true, template : template} %} - -
- -
diff --git a/components/01-units/companies/companies--page.twig b/components/01-units/companies/companies--page.twig deleted file mode 100644 index d6179ea..0000000 --- a/components/01-units/companies/companies--page.twig +++ /dev/null @@ -1,10 +0,0 @@ -
- {% for company in companies %} -
- -
- {% endfor %} -
diff --git a/components/01-units/companies/companies.config.json b/components/01-units/companies/companies.config.json deleted file mode 100644 index d4209ed..0000000 --- a/components/01-units/companies/companies.config.json +++ /dev/null @@ -1,52 +0,0 @@ -{ - "title": "companies component", - "carouselId": "carouselImages", - "context": { - "companies": [ - { - "affiliation": "Association", - "src": "/images/3-m-logo.svg" - }, - { - "affiliation": "association", - "src": "/images/asa-logo.svg" - }, - { - "affiliation": "integration partner", - "src": "/images/carmax-logo.svg" - }, - { - "affiliation": "Associaiton", - "src": "/images/bosch-logo.svg" - }, - { - "affiliation": "customer", - "src": "/images/jiffy-lube.svg" - }, - { - "affiliation": "Associaiton", - "src": "/images/key.svg" - }, - { - "affiliation": "Association", - "src": "/images/3-m-logo.svg" - }, - { - "affiliation": "Associaiton", - "src": "/images/key.svg" - }, - { - "affiliation": "Association", - "src": "/images/3-m-logo.svg" - }, - { - "affiliation": "Associaiton", - "src": "/images/key.svg" - }, - { - "affiliation": "integration partner", - "src": "/images/carmax-logo.svg" - } - ] - } -} diff --git a/components/01-units/companies/companies.twig b/components/01-units/companies/companies.twig deleted file mode 100644 index e69de29..0000000 diff --git a/components/01-units/drupalitemsfacade/drupalitemsfacade.config.json b/components/01-units/drupalitemsfacade/drupalitemsfacade.config.json deleted file mode 100644 index a0a37a3..0000000 --- a/components/01-units/drupalitemsfacade/drupalitemsfacade.config.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "title": "drupalitemsfacade component", - "context": { - "text": "This is an drupalitemsfacade component!", - "heading": "My heading" - } -} diff --git a/components/01-units/heading/heading.config.json b/components/01-units/heading/heading.config.json deleted file mode 100644 index 73c41b9..0000000 --- a/components/01-units/heading/heading.config.json +++ /dev/null @@ -1,85 +0,0 @@ -{ - "title": "heading component", - "collated": true, - "context": { - "heading": "My h1 heading", - "headingLevel": "h1" - }, - "variants": [ - { - "name": "h2", - "context": { - "heading": "My h2 heading", - "headingLevel": "h2" - } - }, - { - "name": "h3", - "context": { - "heading": "My h3 heading", - "headingLevel": "h3" - } - }, - { - "name": "h4", - "context": { - "heading": "My h4 heading", - "headingLevel": "h4" - } - }, - { - "name": "h5", - "context": { - "heading": "My h5 heading", - "headingLevel": "h5" - } - }, - { - "name": "h6", - "context": { - "heading": "My h6 heading", - "headingLevel": "h6" - } - }, - { - "name": "h2", - "context": { - "heading": "My h2 heading", - "headingLevel": "h2", - "threelines": true - } - }, - { - "name": "h3", - "context": { - "heading": "My h3 heading", - "headingLevel": "h3", - "threelines": true - } - }, - { - "name": "h4", - "context": { - "heading": "My h4 heading", - "headingLevel": "h4", - "threelines": true - } - }, - { - "name": "h5", - "context": { - "heading": "My h5 heading", - "headingLevel": "h5", - "threelines": true - } - }, - { - "name": "h6", - "context": { - "heading": "My h6 heading", - "headingLevel": "h6", - "threelines": true - } - } - ] -} diff --git a/components/01-units/heading/heading.twig b/components/01-units/heading/heading.twig deleted file mode 100644 index 3392bed..0000000 --- a/components/01-units/heading/heading.twig +++ /dev/null @@ -1,11 +0,0 @@ - - <{{headingLevel}} class="cmp-heading {{headingLevel}} {% if classes %} {{classes}} {% endif %} {% if threelines %} has-line {% endif %}"> - {{heading}} - - - {% if threelines %} - {# {% include ('@components/01-units/threelines/threelines.twig') %} #} - {% include '@units/threelines/threelines.twig' %} - - {% endif %} - diff --git a/components/01-units/image/image.config.json b/components/01-units/image/image.config.json deleted file mode 100644 index 9995274..0000000 --- a/components/01-units/image/image.config.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "title": "image component", - "context": { - "alt": "mechanic", - "sizes": "(max-width:767px) 50vw,(min-width:768px) 10vw", - "src": "/images/mechanic.png", - "srcset": "/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w," - }, - "variants": [ - { - "name": "svg", - "context": { - "alt": "mechanic", - "src": "/images/mechanic.svg" - } - } - ] -} diff --git a/components/01-units/image/image.twig b/components/01-units/image/image.twig deleted file mode 100644 index 642db53..0000000 --- a/components/01-units/image/image.twig +++ /dev/null @@ -1,15 +0,0 @@ - -{# php logic if is an svg image clear the sizes and srcset variables, we dont need them #} - - - -{% if src ends with '.svg' %} - {{alt}} -{% else %} - {{alt}} - - - -{% endif %} - -{# $0.currentSrc #} \ No newline at end of file diff --git a/components/01-units/latestHeading/latestHeading.config.json b/components/01-units/latestHeading/latestHeading.config.json deleted file mode 100644 index 4274d9d..0000000 --- a/components/01-units/latestHeading/latestHeading.config.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "title": "latestHeading component", - "context": { - "latestTitle": "News", - "latestLink": "See all news" - } -} diff --git a/components/01-units/latestHeading/latestHeading.twig b/components/01-units/latestHeading/latestHeading.twig deleted file mode 100644 index fd8a27f..0000000 --- a/components/01-units/latestHeading/latestHeading.twig +++ /dev/null @@ -1,6 +0,0 @@ - -
-
{{latestTitle}}
- -
- diff --git a/components/01-units/quote/quote.config.json b/components/01-units/quote/quote.config.json deleted file mode 100644 index 325e5c7..0000000 --- a/components/01-units/quote/quote.config.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "title": "quote component", - "context": { - "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.", - "footer": "Josh Kazdan, Autosphere" - } -} diff --git a/components/01-units/quote/quote.twig b/components/01-units/quote/quote.twig deleted file mode 100644 index a1d4dda..0000000 --- a/components/01-units/quote/quote.twig +++ /dev/null @@ -1,8 +0,0 @@ -
- {% include "@image" with {src:'/images/quote-start.svg'} %} -
-

{{text}}

-
{{footer}}
-
- {% include "@image" with {src:'/images/quote-end.svg'} %} -
\ No newline at end of file diff --git a/components/01-units/servcard2/servcard2.config.json b/components/01-units/servcard2/servcard2.config.json deleted file mode 100644 index 9c61200..0000000 --- a/components/01-units/servcard2/servcard2.config.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "title": "servcard2 component", - "context": {} -} diff --git a/components/01-units/servcard2/servcard2.twig b/components/01-units/servcard2/servcard2.twig deleted file mode 100644 index b9b5307..0000000 --- a/components/01-units/servcard2/servcard2.twig +++ /dev/null @@ -1,15 +0,0 @@ - \ No newline at end of file diff --git a/components/01-units/simpletext/simpletext.config.json b/components/01-units/simpletext/simpletext.config.json deleted file mode 100644 index 488d6eb..0000000 --- a/components/01-units/simpletext/simpletext.config.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "title": "simpletext component", - "context": { - "text": "This is an simpletext component!", - "heading": "My heading" - } -} diff --git a/components/01-units/simpletext/simpletext.twig b/components/01-units/simpletext/simpletext.twig deleted file mode 100644 index 13fac42..0000000 --- a/components/01-units/simpletext/simpletext.twig +++ /dev/null @@ -1,5 +0,0 @@ - {% if text is not empty %} -

- {{text}} -

- {% endif %} \ No newline at end of file diff --git a/components/01-units/skew/skew.config.json b/components/01-units/skew/skew.config.json deleted file mode 100644 index ac7cfda..0000000 --- a/components/01-units/skew/skew.config.json +++ /dev/null @@ -1,34 +0,0 @@ -{ - "title": "skew component", - "context": {}, - "variants": [ - { - "name": "on", - "context": { - "text": "skew warning!", - "heading": "warning", - "skewClass": "skew-8" - } - }, - - { - "name": "image", - "context": { - "text": "image", - "heading": "not skew with image as background", - "bgImage": true, - "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg", - "sizes": "100vw", - "alt": "hero", - "srcset": "https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w" - } - }, - { - "name": "inlineimage", - "context": { - "inlineBgImage": "/images/testimonialbg.png", - "skewClass": "skew-8" - } - } - ] -} diff --git a/components/01-units/skew/skew.twig b/components/01-units/skew/skew.twig deleted file mode 100644 index 94bb41b..0000000 --- a/components/01-units/skew/skew.twig +++ /dev/null @@ -1,26 +0,0 @@ - - -
- - -{% if skewClass %} -
- {% if content %} - {{content}} - {% endif %} -
-{% else %} - - {% if bgImage %} - {% include "@image" %} - {% endif %} - - {% if content %} - {{content}} - {% endif %} - -{% endif %} - -
\ No newline at end of file diff --git a/components/01-units/slider/_slider--dynamic.twig b/components/01-units/slider/_slider--dynamic.twig deleted file mode 100644 index 7c8cf83..0000000 --- a/components/01-units/slider/_slider--dynamic.twig +++ /dev/null @@ -1,41 +0,0 @@ - -
- {% if images|length > 1 %} -
- - {# #} - - - Previous - -
    - - {% for img in images %} -
  1. - {% endfor %} - -
- - {# #} - {# #} - - Next - -
- {% endif %} -
- {% if images|length > 0 %} - {% for img in images %} -
- First slide - {#

ONE

#} -
- {% endfor %} - {% endif %} -
- -
\ No newline at end of file diff --git a/components/01-units/slider/_slider--new.twig b/components/01-units/slider/_slider--new.twig deleted file mode 100644 index 7c8cf83..0000000 --- a/components/01-units/slider/_slider--new.twig +++ /dev/null @@ -1,41 +0,0 @@ - -
- {% if images|length > 1 %} -
- - {# #} - - - Previous - -
    - - {% for img in images %} -
  1. - {% endfor %} - -
- - {# #} - {# #} - - Next - -
- {% endif %} -
- {% if images|length > 0 %} - {% for img in images %} -
- First slide - {#

ONE

#} -
- {% endfor %} - {% endif %} -
- -
\ No newline at end of file diff --git a/components/01-units/slider/_slider--slides.twig b/components/01-units/slider/_slider--slides.twig deleted file mode 100644 index 844848b..0000000 --- a/components/01-units/slider/_slider--slides.twig +++ /dev/null @@ -1,23 +0,0 @@ - -{% set count = models|length %} -{% set carouselId = "carouselDyn" %} -{% set extraData = {classes: "d-block w-100"} %} -{% if models|length > 0 %} - {% set slides %} - {% for model in models %} - {% if extraData %} - {% set model = model|merge(extraData) %} - {% endif %} - {% set slideContent %} - {# First slide #} - {# {% include "@" ~ template with {src: model.src, classes: "d-block w-100"} %} #} - {% include "@" ~ template with model only %} - {% endset %} - {% include "@slider--slide" with {slideContent : slideContent, active: loop.first } %} - {% endfor %} - {% endset %} - - {% include "@slider--dyn" with {count: count, slides : slides} %} - {# {{slides}} #} -{% endif %} - diff --git a/components/01-units/slider/slider--dyn.twig b/components/01-units/slider/slider--dyn.twig deleted file mode 100644 index 71c738d..0000000 --- a/components/01-units/slider/slider--dyn.twig +++ /dev/null @@ -1,65 +0,0 @@ - - -{% set count = models|length %} - -{% set slides %} - {% include "@slider--slidessimple" with {models : models, extraData: extraData} %} -{% endset %} - -
- {% if not controlsBottom %} - {% if count > 1 %} -
- - - - Previous - -
    - {% for i in range(0, count - 1) %} -
  1. - {% endfor %} -
- - - Next - -
- {% endif %} - {% endif %} - - -
- {% if slides %} - {{slides}} - {% endif %} -
- {% if controlsBottom %} - {% if count > 1 %} -
- - - - Previous - -
    - {% for i in range(0, count - 1) %} -
  1. - {% endfor %} -
- - - Next - -
- {% endif %} - {% endif %} -
\ No newline at end of file diff --git a/components/01-units/slider/slider--slide.twig b/components/01-units/slider/slider--slide.twig deleted file mode 100644 index e06fca6..0000000 --- a/components/01-units/slider/slider--slide.twig +++ /dev/null @@ -1,3 +0,0 @@ -
- {{slideContent}} -
\ No newline at end of file diff --git a/components/01-units/slider/slider--slidessimple.twig b/components/01-units/slider/slider--slidessimple.twig deleted file mode 100644 index ac6b659..0000000 --- a/components/01-units/slider/slider--slidessimple.twig +++ /dev/null @@ -1,14 +0,0 @@ - -{% if models|length > 0 %} - {% for model in models %} - {% if extraData %} - {% set model = model|merge(extraData) %} - {% endif %} - {% set slideContent %} - {% include "@" ~ template with model only %} - {% endset %} - {% include "@slider--slide" with {slideContent : slideContent, active: loop.first } %} - {% endfor %} - -{% endif %} - diff --git a/components/01-units/slider/slider.config.json b/components/01-units/slider/slider.config.json deleted file mode 100644 index 6eb3150..0000000 --- a/components/01-units/slider/slider.config.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "title": "slider component", - "context": { - "text": "This is an slider component!", - "heading": "My heading", - "template": "image", - "sameHeight": true, - "carouselId": "carouselImages", - "models": [ - { - "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg" - }, - { - "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg" - }, - { "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" } - ] - }, - "variants": [ - { - "name": "new", - "context": { - "carouselId": "carouselImages", - "images": [ - "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg", - "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg", - "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" - ] - } - }, - { - "name": "slides", - "context": { - "template": "image", - "models": [ - { - "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg" - }, - { - "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg" - }, - { "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" } - ] - } - }, - { - "name": "slide", - "context": { - "slideContent": "Hello", - "active": true - } - } - ] -} diff --git a/components/01-units/slider/slider.twig b/components/01-units/slider/slider.twig deleted file mode 100644 index 9f1fe71..0000000 --- a/components/01-units/slider/slider.twig +++ /dev/null @@ -1,7 +0,0 @@ - - {% set carouselId = "carouselHeroSlider" %} - {% set extraData = {extrainfo: 'hero-slides'} %} - {% set template = "image" %} - {% include "@slider--dyn" with {carouselId:carouselId, models : models, sameHeight: true, template : template, extraData: extraData} %} - - diff --git a/components/01-units/threelines/threelines.config.json b/components/01-units/threelines/threelines.config.json deleted file mode 100644 index f6b86e9..0000000 --- a/components/01-units/threelines/threelines.config.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "title": "threelines component", - "context": { - "text": "This is an threelines component!", - "heading": "My heading" - } -} diff --git a/components/01-units/tricolor/tricolor--position.twig b/components/01-units/tricolor/tricolor--position.twig deleted file mode 100644 index 974e46d..0000000 --- a/components/01-units/tricolor/tricolor--position.twig +++ /dev/null @@ -1,15 +0,0 @@ - -{% if inverted %} -
-
-
-
-{% else %} -
-
-
-
-{% endif %} - - -
\ No newline at end of file diff --git a/components/01-units/tricolor/tricolor.config.json b/components/01-units/tricolor/tricolor.config.json deleted file mode 100644 index 9b60cf0..0000000 --- a/components/01-units/tricolor/tricolor.config.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "title": "tricolor component", - "context": { - "text": "This is an tricolor component!", - "heading": "My heading" - } -} diff --git a/components/01-units/unitmacros/unitmacros.config.json b/components/01-units/unitmacros/unitmacros.config.json deleted file mode 100644 index 4d45a80..0000000 --- a/components/01-units/unitmacros/unitmacros.config.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "title": "unitmacros component", - "context": { - "text": "This is an unitmacros component!", - "heading": "My heading" - } -} diff --git a/components/01-units/unitmacros/unitmacros.twig b/components/01-units/unitmacros/unitmacros.twig deleted file mode 100644 index 2121bc4..0000000 --- a/components/01-units/unitmacros/unitmacros.twig +++ /dev/null @@ -1,35 +0,0 @@ - -{% macro getSpaces(ctx) %} - {% if ctx is defined %} - {% set spacesArray = [] %} - - {% if ctx.py is defined %} - {% set spacesArray = spacesArray | merge([ctx.py]) %} - {% endif %} - - {% if ctx.px is defined %} - {% set spacesArray = spacesArray | merge([ctx.px]) %} - {% endif %} - - {% if ctx.pyLg is defined %} - {% set spacesArray = spacesArray | merge([ctx.pyLg]) %} - {% endif %} - - {% if ctx.pxLg is defined %} - {% set spacesArray = spacesArray | merge([ctx.pxLg]) %} - {% endif %} - {% if ctx.my is defined %} - {% set spacesArray = spacesArray | merge([ctx.my]) %} - {% endif %} - - {% if ctx.mx is defined %} - {% set spacesArray = spacesArray | merge([ctx.mx]) %} - {% endif %} - - {% set spaces = spacesArray | join(' ') %} - - {{spaces}} - {% endif %} -{% endmacro %} - - diff --git a/components/01-units/video/video.config.json b/components/01-units/video/video.config.json deleted file mode 100644 index 68f48d1..0000000 --- a/components/01-units/video/video.config.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "title": "video component", - "context": { - "videoId": "bTqVqk7FSmY" - } -} diff --git a/components/02-layout/cols/_cols--content.twig b/components/02-layout/cols/_cols--content.twig deleted file mode 100644 index 655ec8c..0000000 --- a/components/02-layout/cols/_cols--content.twig +++ /dev/null @@ -1,10 +0,0 @@ - - -{% set content %} - -
1
-
2
-
3
- -{% endset %} -{% include "@cols" %} diff --git a/components/02-layout/cols/cols--drupalcontent.twig b/components/02-layout/cols/cols--drupalcontent.twig deleted file mode 100644 index 0c39286..0000000 --- a/components/02-layout/cols/cols--drupalcontent.twig +++ /dev/null @@ -1,12 +0,0 @@ -{% set content %} - - {% set items %} -
1
-
2
-
3
- {% endset %} - - {% include "@drupalitemsfacade" with {items:items} %} -{% endset %} - -{% include "@cols" %} diff --git a/components/02-layout/cols/cols.config.json b/components/02-layout/cols/cols.config.json deleted file mode 100644 index de5b5c7..0000000 --- a/components/02-layout/cols/cols.config.json +++ /dev/null @@ -1,9 +0,0 @@ -{ - "title": "cols component", - "context": { - "text": "This is an cols component!", - "mobileModifier": "1", - "tabletModifier": "2", - "desktopModifier": "3" - } -} diff --git a/components/02-layout/cols/cols.twig b/components/02-layout/cols/cols.twig deleted file mode 100644 index 912f7d2..0000000 --- a/components/02-layout/cols/cols.twig +++ /dev/null @@ -1,11 +0,0 @@ - - -
- - - - {% if content %} - {{content}} - {% endif %} - -
diff --git a/components/blocks/brandingcard/brandingcard.config.json b/components/blocks/brandingcard/brandingcard.config.json deleted file mode 100644 index 2529c7e..0000000 --- a/components/blocks/brandingcard/brandingcard.config.json +++ /dev/null @@ -1,13 +0,0 @@ -{ - "title": "brandingcard component", - "context": { - "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.", - "heading": "My heading", - "headingLevel": "h3", - "textColor": "white", - "backgroundColor": "primary", - "alt": "mechanic", - "src": "/images/mechanic.png", - "srcset": "/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w," - } -} diff --git a/components/blocks/brandingcard/brandingcard.twig b/components/blocks/brandingcard/brandingcard.twig deleted file mode 100644 index 19278ef..0000000 --- a/components/blocks/brandingcard/brandingcard.twig +++ /dev/null @@ -1,17 +0,0 @@ -{% import '@unitmacros' as output %} - -{% set spaceObj = {py:'py-4',pyLg:'py-lg-4', pxLg:'px-lg-4' } %} - -
- -{# by default boostrap has white and black --> text-white , text-black #} - {# #} - - {% set sizes = "(max-width:767px) 25vw,(min-width:768px) 10vw" %} - {% include "@image" %} - {% include "@heading" %} - {% include "@simpletext" %} - -
-
- diff --git a/components/blocks/collapse-list/collapse-list.config.json b/components/blocks/collapse-list/collapse-list.config.json deleted file mode 100644 index b510e87..0000000 --- a/components/blocks/collapse-list/collapse-list.config.json +++ /dev/null @@ -1,36 +0,0 @@ -{ - "title": "collapse-list component", - "context": { - "listTitle": "Products", - "listContents": [ - { - "listText": "ALLDATA Repair", - "listLink": "www.google.com" - }, - { - "listText": "ALLDTA Collision", - "listLink": "www.google.com" - }, - { - "listText": "ALLDATA Mobile", - "listLink": "www.google.com" - }, - { - "listText": "ALLDATA Diagnostics", - "listLink": "www.google.com" - }, - { - "listText": "ALLDATA Tech-Assits", - "listLink": "www.google.com" - }, - { - "listText": "ALLDATA Manage Online", - "listLink": "www.google.com" - }, - { - "listText": "ALLDATA Shop Manager", - "listLink": "www.google.com" - } - ] - } -} diff --git a/components/blocks/collapse-list/collapse-list.twig b/components/blocks/collapse-list/collapse-list.twig deleted file mode 100644 index 899a5a0..0000000 --- a/components/blocks/collapse-list/collapse-list.twig +++ /dev/null @@ -1,26 +0,0 @@ - -
-
- {{listTitle}} - - -
- -
- diff --git a/components/blocks/imageblue/imageblue.config.json b/components/blocks/imageblue/imageblue.config.json deleted file mode 100644 index 77484ff..0000000 --- a/components/blocks/imageblue/imageblue.config.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "title": "imageblue component", - "context": { - "src": "/images/carfix.jpg" - } -} diff --git a/components/blocks/imageblue/imageblue.twig b/components/blocks/imageblue/imageblue.twig deleted file mode 100644 index 4fb0146..0000000 --- a/components/blocks/imageblue/imageblue.twig +++ /dev/null @@ -1,4 +0,0 @@ - -
- {% include "@image" %} -
\ No newline at end of file diff --git a/components/blocks/jumbo/jumbo--simple.twig b/components/blocks/jumbo/jumbo--simple.twig deleted file mode 100644 index 67ec583..0000000 --- a/components/blocks/jumbo/jumbo--simple.twig +++ /dev/null @@ -1,8 +0,0 @@ -{% include "@jumbo" with - { - "headingLevel": "h2", - "btnText": "", - "threelines": false, - "modifier": "simple" - } -%} \ No newline at end of file diff --git a/components/blocks/jumbo/jumbo.config.json b/components/blocks/jumbo/jumbo.config.json deleted file mode 100644 index 84ab6d6..0000000 --- a/components/blocks/jumbo/jumbo.config.json +++ /dev/null @@ -1,35 +0,0 @@ -{ - "title": "jumbo component", - "context": { - "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.", - "heading": "AUTOMOTIVE INTELLIGENCE", - "headingLevel": "h1", - "btnText": "shop products", - "threelines": true - }, - "variants":[ - {"name": "No three lines", - "context": { - "threelines": false - } - }, - {"name": "No Button", - "context": { - "btnText": "" - } - }, - {"name": "No Button and no Three lines", - "context": { - - "btnText": "", - "threelines": false - } - }, - {"name": "simple", - "context": { - "heading": "Why ALLDATA", - "text": "ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide." - } - } - ] -} diff --git a/components/blocks/jumbo/jumbo.twig b/components/blocks/jumbo/jumbo.twig deleted file mode 100644 index 3b5026a..0000000 --- a/components/blocks/jumbo/jumbo.twig +++ /dev/null @@ -1,27 +0,0 @@ -{% set content %} -
- - -{# headingLevel are h1 h2 h3 etc #} - {% include '@units/heading/heading.twig' with {classes : "cmp-jumbo__heading" } %} - - {% include '@units/simpletext/simpletext.twig' %} - - {% if btnText is not empty %} - {% include '@units/button/button.twig' %} - {% endif %} -
- - - {# {{ dump(text) }} #} - {# #} - {# the button can read the text on the jumbo component no need to explicit pass 'whit; #} - {# {% include '@button' %} #} - -{% endset %} - -{{content}} - -{# no need to explicit pass it also #} -{# {% include "@skew" %} #} -{# {% include "@skew" with {'content' : content} %} #} \ No newline at end of file diff --git a/components/blocks/latestCard/latestCard.config.json b/components/blocks/latestCard/latestCard.config.json deleted file mode 100644 index a04adb3..0000000 --- a/components/blocks/latestCard/latestCard.config.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "title": "servcard component", - "context": { - "latestTitle": "news", - "latestLink": "see all news", - "src": "/images/carfix.jpg", - "heading": "Independent collision shops", - "headingLevel": "h6", - "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.", - "textLink" : "Learn More", - "link" : "https://www.google.com", - "middlePos" : false, - "lastCard" : false - } -} \ No newline at end of file diff --git a/components/blocks/latestCard/latestCard.twig b/components/blocks/latestCard/latestCard.twig deleted file mode 100644 index 302e1ee..0000000 --- a/components/blocks/latestCard/latestCard.twig +++ /dev/null @@ -1,21 +0,0 @@ -
- {% include "@latestheading" %} -
-
-
- {% include "@imageblue" %} -
-
- {% include "@image" %} -
-
-
- {% include "@heading" %} - - more - - {% include "@simpletext" %} - {% include "@cardlink" %} -
-
-
diff --git a/components/blocks/servcard/servcard.config.json b/components/blocks/servcard/servcard.config.json deleted file mode 100644 index 59bf718..0000000 --- a/components/blocks/servcard/servcard.config.json +++ /dev/null @@ -1,14 +0,0 @@ -{ - "title": "servcard component", - "context": { - "src": "/images/carfix.jpg", - "heading": "Independent collision shops", - "headingLevel": "h6", - "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.", - "textLink" : "Learn More", - "link" : "https://www.google.com", - "middlePos" : false, - "lastCard" : false - - } -} diff --git a/components/blocks/servcard/servcard.twig b/components/blocks/servcard/servcard.twig deleted file mode 100644 index 77b1eb7..0000000 --- a/components/blocks/servcard/servcard.twig +++ /dev/null @@ -1,15 +0,0 @@ - \ No newline at end of file diff --git a/components/blocks/shadow-box/shadow-box.config.json b/components/blocks/shadow-box/shadow-box.config.json deleted file mode 100644 index 7dc1671..0000000 --- a/components/blocks/shadow-box/shadow-box.config.json +++ /dev/null @@ -1,11 +0,0 @@ -{ - "title": "shadow-box component", - "context": { - "text": "This is an shadow-box component!", - "image": { - "src":"https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png", - "alt": "happy man" - }, - "quote": "@quote" - } -} diff --git a/components/blocks/shadow-box/shadow-box.scss b/components/blocks/shadow-box/shadow-box.scss deleted file mode 100644 index b3fafd9..0000000 --- a/components/blocks/shadow-box/shadow-box.scss +++ /dev/null @@ -1,71 +0,0 @@ -/** - * Main css for Shadow Box - */ - -.cmp-shadow-box { - >.row{ - margin-right: 0; - margin-left: 0; - } - - .cmp-shadow-box-quote{ - // border: red solid 1px; - display: flex; - flex-direction: column; - justify-content: center; - // @extend .p-0; - - .cmp-quote{ - @extend .shadow-box; - @extend .px-4vw; - @extend .py-8vw; - - } - } - - .cmp-shadow-box-img{ - position: relative; - @extend .shadow-box; - // border: blue solid 1px; - > .cmp-image{ - object-fit: cover; - width: 100%; - max-height: 300px; - object-position: top; - } - - .cmp-shadow-box-play-container{ - @extend .fill-relative-parent; - display: flex; - align-items: flex-end; - button{ - padding: 4vw; - } - } - - } - - - - @include media-breakpoint-up(md){ - .cmp-shadow-box-quote{ - .cmp-quote{ - @extend .my-md-4vw; - } - } - - .cmp-shadow-box-img{ - > .cmp-image{ - min-height: 100%; - max-height: unset; - } - - .cmp-shadow-box-play-container{ - justify-content: center; - align-items: center; - } - } - - } - -} diff --git a/components/blocks/shadow-box/shadow-box.twig b/components/blocks/shadow-box/shadow-box.twig deleted file mode 100644 index c70530a..0000000 --- a/components/blocks/shadow-box/shadow-box.twig +++ /dev/null @@ -1,29 +0,0 @@ - -{% set columContent %} -
- {% include "@image" with image|merge({classes: 'img-fluid'}) %} - - -
- -
- -
-
- {% include "@quote" with quote only %} -
-{% endset %} - - -{% set drupal %} - {% include "@drupalitemsfacade" with {items:columContent} %} -{% endset %} - -
- {% include "@cols" with {content : columContent, mobileModifier: "1", tabletModifier: "2", noGutter:true } only %} -
- diff --git a/components/detail/affilliations.html b/components/detail/affilliations.html new file mode 100644 index 0000000..819ec5e --- /dev/null +++ b/components/detail/affilliations.html @@ -0,0 +1,2422 @@ + + + + + + + + + + + + +Affilliations component | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + Affilliations component + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<div class="cmp-Affilliations mx-4 px-lg-5 mx-lg-3">
+
+    <div class="cmp-jumbo  cmp-jumbo__No Button ">
+
+        <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+            working with <br> the industry’s best
+        </h2>
+
+        <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+        <p class="cmp-text">
+            ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.
+        </p>
+
+    </div>
+
+    <div class="cmp-companies cmp-companies__bs">
+        <div class="cmp-companies-sm d-lg-none">
+
+            <div id="carouselCompanyMB" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+
+                <div class="carousel-inner">
+
+                    <div class="carousel-item  active ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/asa-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/bosch-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/jiffy-lube.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">customer</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+                    <div class="carousel-item ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+
+                </div>
+                <div class="cmp-slider-controls d-flex bottom">
+                    <a class="cmp-slider-prev" href="#carouselCompanyMB" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                    <ol class="carousel-indicators">
+                        <li data-target="#carouselCompanyMB" data-slide-to="0" class="active"></li>
+                        <li data-target="#carouselCompanyMB" data-slide-to="1"></li>
+                    </ol>
+                    <a class="cmp-slider-next" href="#carouselCompanyMB" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                </div>
+            </div>
+
+        </div>
+
+        <div class="cmp-companies-lg d-none d-lg-block">
+
+            <div id="carouselCompanyDK" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+                <div class="cmp-slider-controls d-flex">
+                    <a class="cmp-slider-prev" href="#carouselCompanyDK" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                    <ol class="carousel-indicators">
+                        <li data-target="#carouselCompanyDK" data-slide-to="0" class="active"></li>
+                        <li data-target="#carouselCompanyDK" data-slide-to="1"></li>
+                        <li data-target="#carouselCompanyDK" data-slide-to="2"></li>
+                    </ol>
+                    <a class="cmp-slider-next" href="#carouselCompanyDK" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                </div>
+
+                <div class="carousel-inner">
+
+                    <div class="carousel-item  active ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/asa-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/bosch-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/jiffy-lube.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">customer</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+                    <div class="carousel-item ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+                    <div class="carousel-item ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+
+                </div>
+            </div>
+        </div>
+
+    </div>
+    <div class="cmp-affiliations-button">
+        <button class="cmp-button btn btn-outline-secondary">see all</button>
+
+        <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+    </div>
+</div>
+ + +
+ + +
+ + 
<div class="cmp-Affilliations mx-4 px-lg-5 mx-lg-3">
+    {% include "@jumbo" with 
+            {
+                "headingLevel": "h2",
+                "btnText": "",
+                "threelines": true,
+                "modifier": "No Button"
+            } 
+    %}
+    {% include "@companies--bs" with companies only %}
+    <div class="cmp-affiliations-button">
+        {% include "@button"%}
+    </div>
+</div>
+ +
+ + +
+ + + + 
{
+  "text": "ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.",
+  "heading": "working with <br> the industry’s best",
+  "companies": {
+    "companies": [
+      {
+        "affiliation": "Association",
+        "src": "/images/3-m-logo.svg"
+      },
+      {
+        "affiliation": "association",
+        "src": "/images/asa-logo.svg"
+      },
+      {
+        "affiliation": "integration partner",
+        "src": "/images/carmax-logo.svg"
+      },
+      {
+        "affiliation": "Associaiton",
+        "src": "/images/bosch-logo.svg"
+      },
+      {
+        "affiliation": "customer",
+        "src": "/images/jiffy-lube.svg"
+      },
+      {
+        "affiliation": "Associaiton",
+        "src": "/images/key.svg"
+      },
+      {
+        "affiliation": "Association",
+        "src": "/images/3-m-logo.svg"
+      },
+      {
+        "affiliation": "Associaiton",
+        "src": "/images/key.svg"
+      },
+      {
+        "affiliation": "Association",
+        "src": "/images/3-m-logo.svg"
+      },
+      {
+        "affiliation": "Associaiton",
+        "src": "/images/key.svg"
+      },
+      {
+        "affiliation": "integration partner",
+        "src": "/images/carmax-logo.svg"
+      }
+    ]
+  },
+  "btnText": "see all"
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    "use strict";
+
+/**
+ *  This is the main file for Affilliations
+ */
+
+/* STARTER CODE
+
+class Affilliations {
+    constructor($inst) {
+        cponsole.log('Initializing Affilliations')
+    }
+}
+
+*/
+
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/affilliations/Affilliations.js +
    • +
  • + Filesystem Path: + components/groups/Affilliations/Affilliations.js +
    • +
  • + Size: + 196 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Affilliations
+ */
+
+.cmp-Affilliations {
+  .cmp-text {
+    font-size: 14px;
+    font-weight: 300;
+    line-height: 1.71;
+    color: #54565a;
+  }
+  .tns-nav {
+    display: block;
+  }
+  .cmp-button {
+    margin: 50px auto 0px;
+    padding: 12px 70px;
+  }
+  .cmp-affiliations-button {
+    widows: 100%;
+    text-align: center;
+  }
+
+  @include media-breakpoint-up(lg) {
+    .cmp-text {
+      width: 575px;
+    }
+    .cmp-affiliations-button {
+      text-align: right;
+    }
+    .cmp-button {
+      margin-right: 100px;
+      margin-top: 30px;
+      padding: 12px 30px;
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/affilliations/Affilliations.scss +
    • +
  • + Filesystem Path: + components/groups/Affilliations/Affilliations.scss +
    • +
  • + Size: + 597 Bytes +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/branding--default.html b/components/detail/branding--default.html new file mode 100644 index 0000000..1062ae4 --- /dev/null +++ b/components/detail/branding--default.html @@ -0,0 +1,2225 @@ + + + + + + + + + + + + +branding component: Default | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + branding component: Default + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<section class="cmp-skew columns is-centered skew-6 branding   bg-primary  ">
+
+    <div class="inner-section ">
+
+        <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+
+            <div class="cmp-jumbo  cmp-jumbo__simple ">
+
+                <h2 class="cmp-heading h2  cmp-jumbo__heading   ">
+                    Why ALLDATA
+                </h2>
+
+                <p class="cmp-text">
+                    ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+                </p>
+
+            </div>
+
+            <div class="cmp-cols  cols-1   cols-lg-3  ">
+
+                <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/mechanic.svg" alt="mechanic">
+
+                        <h3 class="cmp-heading h3   ">
+                            Repair Information
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/tyre.svg" alt="tyre">
+
+                        <h3 class="cmp-heading h3   ">
+                            diagnostics
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/key.svg" alt="key">
+
+                        <h3 class="cmp-heading h3   ">
+                            shop management
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                </div>
+
+            </div>
+        </div>
+
+    </div>
+
+</section>
+ + +
+ + +
+ + 
{% set cardsContent %}
+    {% for card in cards %}
+        {% include "@brandingcard" with card only %}
+    {% endfor %}
+{% endset %}
+
+{% set drupal %}
+    {% include "@drupalitemsfacade" with {items:cardsContent} %}
+{% endset %}
+
+{% set content %}
+    {# <p>hi</p> #}
+    <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+        {% include "@jumbo--simple" %}
+        {% include "@cols" with {content: drupal} %}
+    </div>
+{% endset %}
+
+
+{% set skewClass = 'skew-6 branding' %}
+{% set skewBg = 'bg-primary' %}
+{# {% set cmpClass = 'cmp-branding' %} #}
+
+{% include "@skew" %}
+ +
+ + +
+ + + + 
{
+  "heading": "Why ALLDATA",
+  "text": "ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.",
+  "mobileModifier": "1",
+  "desktopModifier": "3",
+  "overlapPrev": false,
+  "cards": [
+    {
+      "heading": "Repair Information",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "mechanic",
+      "src": "/images/mechanic.svg"
+    },
+    {
+      "heading": "diagnostics",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "tyre",
+      "src": "/images/tyre.svg"
+    },
+    {
+      "heading": "shop management",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "key",
+      "src": "/images/key.svg"
+    }
+  ]
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    'use strict';
+
+/**
+ *  This is the main file for Branding
+ */
+
+/* STARTER CODE
+
+class Branding {
+    constructor($inst) {
+        cponsole.log('Initializing Branding')
+    }
+}
+
+*/
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/branding/branding.js +
    • +
  • + Filesystem Path: + components/groups/branding/branding.js +
    • +
  • + Size: + 180 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Branding
+ */
+.cmp-skew.branding {
+  position: relative;
+  z-index: 1;
+}
+.cmp-branding {
+  > *:last-child {
+    margin-bottom: 0;
+  }
+
+  .cmp-cols {
+    // there is not such a last of class so we use div
+
+    > div:last-child {
+      .cmp-brandingcard__line {
+        display: none;
+      }
+    }
+  }
+
+  @include media-breakpoint-up(lg) {
+    .cmp-brandingcard__line {
+      display: none;
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/branding/branding.scss +
    • +
  • + Filesystem Path: + components/groups/branding/branding.scss +
    • +
  • + Size: + 422 Bytes +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/branding--overlap.html b/components/detail/branding--overlap.html new file mode 100644 index 0000000..c34b40e --- /dev/null +++ b/components/detail/branding--overlap.html @@ -0,0 +1,2216 @@ + + + + + + + + + + + + +branding component: Overlap | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + branding component: Overlap + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<section class="cmp-skew columns is-centered skew-6 branding overlap-prev-section  bg-primary  ">
+
+    <div class="inner-section ">
+
+        <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+
+            <div class="cmp-jumbo  cmp-jumbo__simple ">
+
+                <h2 class="cmp-heading h2  cmp-jumbo__heading   ">
+                    Why ALLDATA
+                </h2>
+
+                <p class="cmp-text">
+                    ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+                </p>
+
+            </div>
+
+            <div class="cmp-cols  cols-1   cols-lg-3  ">
+
+                <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/mechanic.svg" alt="mechanic">
+
+                        <h3 class="cmp-heading h3   ">
+                            Repair Information
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/tyre.svg" alt="tyre">
+
+                        <h3 class="cmp-heading h3   ">
+                            diagnostics
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/key.svg" alt="key">
+
+                        <h3 class="cmp-heading h3   ">
+                            shop management
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                </div>
+
+            </div>
+        </div>
+
+    </div>
+
+</section>
+ + +
+ + +
+ + 
{% set cardsContent %}
+    {% for card in cards %}
+        {% include "@brandingcard" with card only %}
+    {% endfor %}
+{% endset %}
+
+{% set drupal %}
+    {% include "@drupalitemsfacade" with {items:cardsContent} %}
+{% endset %}
+
+{% set content %}
+    {# <p>hi</p> #}
+    <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+        {% include "@jumbo--simple" %}
+        {% include "@cols" with {content: drupal} %}
+    </div>
+{% endset %}
+
+
+{% set skewClass = 'skew-6 branding' %}
+{% set skewBg = 'bg-primary' %}
+{# {% set cmpClass = 'cmp-branding' %} #}
+
+{% include "@skew" %}
+ +
+ + +
+ + + + 
{
+  "heading": "Why ALLDATA",
+  "text": "ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.",
+  "mobileModifier": "1",
+  "desktopModifier": "3",
+  "overlapPrev": true,
+  "cards": [
+    {
+      "heading": "Repair Information",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "mechanic",
+      "src": "/images/mechanic.svg"
+    },
+    {
+      "heading": "diagnostics",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "tyre",
+      "src": "/images/tyre.svg"
+    },
+    {
+      "heading": "shop management",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "key",
+      "src": "/images/key.svg"
+    }
+  ]
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    'use strict';
+
+/**
+ *  This is the main file for Branding
+ */
+
+/* STARTER CODE
+
+class Branding {
+    constructor($inst) {
+        cponsole.log('Initializing Branding')
+    }
+}
+
+*/
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/branding/branding.js +
    • +
  • + Filesystem Path: + components/groups/branding/branding.js +
    • +
  • + Size: + 180 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Branding
+ */
+.cmp-skew.branding {
+  position: relative;
+  z-index: 1;
+}
+.cmp-branding {
+  > *:last-child {
+    margin-bottom: 0;
+  }
+
+  .cmp-cols {
+    // there is not such a last of class so we use div
+
+    > div:last-child {
+      .cmp-brandingcard__line {
+        display: none;
+      }
+    }
+  }
+
+  @include media-breakpoint-up(lg) {
+    .cmp-brandingcard__line {
+      display: none;
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/branding/branding.scss +
    • +
  • + Filesystem Path: + components/groups/branding/branding.scss +
    • +
  • + Size: + 422 Bytes +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/branding.html b/components/detail/branding.html new file mode 100644 index 0000000..93bd586 --- /dev/null +++ b/components/detail/branding.html @@ -0,0 +1,2225 @@ + + + + + + + + + + + + +branding component | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + branding component + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<section class="cmp-skew columns is-centered skew-6 branding   bg-primary  ">
+
+    <div class="inner-section ">
+
+        <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+
+            <div class="cmp-jumbo  cmp-jumbo__simple ">
+
+                <h2 class="cmp-heading h2  cmp-jumbo__heading   ">
+                    Why ALLDATA
+                </h2>
+
+                <p class="cmp-text">
+                    ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+                </p>
+
+            </div>
+
+            <div class="cmp-cols  cols-1   cols-lg-3  ">
+
+                <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/mechanic.svg" alt="mechanic">
+
+                        <h3 class="cmp-heading h3   ">
+                            Repair Information
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/tyre.svg" alt="tyre">
+
+                        <h3 class="cmp-heading h3   ">
+                            diagnostics
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/key.svg" alt="key">
+
+                        <h3 class="cmp-heading h3   ">
+                            shop management
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                </div>
+
+            </div>
+        </div>
+
+    </div>
+
+</section>
+ + +
+ + +
+ + 
{% set cardsContent %}
+    {% for card in cards %}
+        {% include "@brandingcard" with card only %}
+    {% endfor %}
+{% endset %}
+
+{% set drupal %}
+    {% include "@drupalitemsfacade" with {items:cardsContent} %}
+{% endset %}
+
+{% set content %}
+    {# <p>hi</p> #}
+    <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+        {% include "@jumbo--simple" %}
+        {% include "@cols" with {content: drupal} %}
+    </div>
+{% endset %}
+
+
+{% set skewClass = 'skew-6 branding' %}
+{% set skewBg = 'bg-primary' %}
+{# {% set cmpClass = 'cmp-branding' %} #}
+
+{% include "@skew" %}
+ +
+ + +
+ + + + 
{
+  "heading": "Why ALLDATA",
+  "text": "ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.",
+  "mobileModifier": "1",
+  "desktopModifier": "3",
+  "overlapPrev": false,
+  "cards": [
+    {
+      "heading": "Repair Information",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "mechanic",
+      "src": "/images/mechanic.svg"
+    },
+    {
+      "heading": "diagnostics",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "tyre",
+      "src": "/images/tyre.svg"
+    },
+    {
+      "heading": "shop management",
+      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+      "headingLevel": "h3",
+      "alt": "key",
+      "src": "/images/key.svg"
+    }
+  ]
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    'use strict';
+
+/**
+ *  This is the main file for Branding
+ */
+
+/* STARTER CODE
+
+class Branding {
+    constructor($inst) {
+        cponsole.log('Initializing Branding')
+    }
+}
+
+*/
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/branding/branding.js +
    • +
  • + Filesystem Path: + components/groups/branding/branding.js +
    • +
  • + Size: + 180 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Branding
+ */
+.cmp-skew.branding {
+  position: relative;
+  z-index: 1;
+}
+.cmp-branding {
+  > *:last-child {
+    margin-bottom: 0;
+  }
+
+  .cmp-cols {
+    // there is not such a last of class so we use div
+
+    > div:last-child {
+      .cmp-brandingcard__line {
+        display: none;
+      }
+    }
+  }
+
+  @include media-breakpoint-up(lg) {
+    .cmp-brandingcard__line {
+      display: none;
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/branding/branding.scss +
    • +
  • + Filesystem Path: + components/groups/branding/branding.scss +
    • +
  • + Size: + 422 Bytes +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/brandingcard.html b/components/detail/brandingcard.html new file mode 100644 index 0000000..7dcc9bc --- /dev/null +++ b/components/detail/brandingcard.html @@ -0,0 +1,2127 @@ + + + + + + + + + + + + +brandingcard component | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + brandingcard component + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      text-white  bg-primary">
+
+    <img class="cmp-image " src="/images/mechanic.png" alt="mechanic" sizes="(max-width:767px) 25vw,(min-width:768px) 10vw" srcset="/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w,">
+
+    <h3 class="cmp-heading h3   ">
+        My heading
+    </h3>
+
+    <p class="cmp-text">
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    </p>
+
+    <hr class="cmp-brandingcard__line">
+</div>
+ + +
+ + +
+ + 
{% import '@unitmacros' as output %}
+
+{% set spaceObj = {py:'py-4',pyLg:'py-lg-4', pxLg:'px-lg-4' } %}
+
+<div class="cmp-brandingcard text-center {{output.getSpaces(spaceObj)}} {% if textColor %} text-{{textColor}}{% endif %} {% if backgroundColor %} bg-{{backgroundColor}}{% endif %}">
+
+{# by default boostrap has white and black --> text-white , text-black #}
+    {# <img src="/images/mechanic.svg" class="Fill-4"> #}
+
+    {% set sizes = "(max-width:767px) 25vw,(min-width:768px) 10vw" %}
+    {% include "@image" %}
+    {% include "@heading" %}
+    {% include "@simpletext" %}
+
+    <hr class="cmp-brandingcard__line">
+</div>
+ +
+ + +
+ + + + 
{
+  "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+  "heading": "My heading",
+  "headingLevel": "h3",
+  "textColor": "white",
+  "backgroundColor": "primary",
+  "alt": "mechanic",
+  "src": "/images/mechanic.png",
+  "srcset": "/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w,"
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    'use strict';
+
+/**
+ *  This is the main file for Brandingcard
+ */
+
+/* STARTER CODE
+
+class Brandingcard {
+    constructor($inst) {
+        cponsole.log('Initializing Brandingcard')
+    }
+}
+
+*/
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/brandingcard/brandingcard.js +
    • +
  • + Filesystem Path: + components/blocks/brandingcard/brandingcard.js +
    • +
  • + Size: + 192 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Brandingcard
+ */
+
+ $hrColor: rgba(255, 255, 255, 0.2);
+.cmp-brandingcard {
+    // @extend .text-white;
+    // @extend .bg-primary;
+    // @extend .text-center;
+
+    .cmp-image{
+        max-width: 25vw ;
+        margin-bottom: 1.5rem ;
+    }
+
+    .cmp-heading{
+        text-transform: uppercase;
+        //zepplin
+        @include fontSize(18);
+        line-height: 1.56;
+        letter-spacing: 1px;
+        margin-bottom: 1rem;
+        font-weight: normal; // review this
+
+    }
+    .cmp-text{
+        @include fontSize(14);
+        line-height: 1.71;
+        opacity: 0.6;
+        margin-bottom: fromPxtoRem(48);
+    }
+
+    .cmp-brandingcard__line{
+        border-color:$hrColor;
+        border-width: 1.4px;
+        margin-top: 0;
+        margin-bottom: 0;
+        width: 30vw;
+    }
+
+    @include  media-breakpoint-up(lg){
+        .cmp-image{
+            // max-width: 10vw ;
+            width: 8vw;
+            height: 8vw;
+        }
+        
+    }
+}
+
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/brandingcard/brandingcard.scss +
    • +
  • + Filesystem Path: + components/blocks/brandingcard/brandingcard.scss +
    • +
  • + Size: + 978 Bytes +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/button.html b/components/detail/button.html new file mode 100644 index 0000000..9070754 --- /dev/null +++ b/components/detail/button.html @@ -0,0 +1,2084 @@ + + + + + + + + + + + + +button component | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + button component + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<button class="cmp-button btn btn-outline-secondary">This is an button component!</button>
+
+<button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+ + +
+ + +
+ + 
<button class="cmp-button btn btn-outline-secondary">{{btnText}}</button>
+
+{# {% set var = {{'images/plus-orange.svg'}} %}
+{% set var2 = {{'images/plus-orange.svg' | path}} %} #}
+     <button class="cmp-servcard__more"><img src={{'images/plus-orange.svg'}} alt="more"> no/ and NO path</button>
+     {# <button class="cmp-servcard__more"><img src={{'/images/plus-orange.svg' |path}} alt="more"> / and Path</button> #}
+     {# <button class="cmp-servcard__more"><img src={{'/images/plus-orange.svg' }} alt="more">No path</button> #}
+
+
+ {# {{var | raw}}
+ {{var2 | raw }} #}
+ +
+ + +
+ + + + 
{
+  "btnText": "This is an button component!"
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    "use strict";
+
+/**
+ *  This is the main file for Button
+ */
+
+/* STARTER CODE
+
+class Button {
+    constructor($inst) {
+        cponsole.log('Initializing Button')
+    }
+}
+
+*/
+
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/button/button.js +
    • +
  • + Filesystem Path: + components/01-units/button/button.js +
    • +
  • + Size: + 175 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Button
+ */
+
+.cmp-button {
+  color: $primary;
+  border-width: 2px;
+  text-transform: uppercase;
+  font-size: 0.75rem;
+
+  // from zeppling
+  font-weight: bold;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: normal;
+  letter-spacing: normal;
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/button/button.scss +
    • +
  • + Filesystem Path: + components/01-units/button/button.scss +
    • +
  • + Size: + 276 Bytes +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

button component

+

implicit context

+
{% include '@button' %}

explicit context

+
{% include '@button' with {"btnText": "This is an button component!"} %}
+
+ +

This template for this component looks like this:

+
<button class="cmp-button btn btn-outline-secondary">{{btnText}}</button>
+
+{# {% set var = {{'images/plus-orange.svg'}} %}
+{% set var2 = {{'images/plus-orange.svg' | path}} %} #}
+     <button class="cmp-servcard__more"><img src={{'images/plus-orange.svg'}} alt="more"> no/ and NO path</button>
+     {# <button class="cmp-servcard__more"><img src={{'/images/plus-orange.svg' |path}} alt="more"> / and Path</button> #}
+     {# <button class="cmp-servcard__more"><img src={{'/images/plus-orange.svg' }} alt="more">No path</button> #}
+
+
+ {# {{var | raw}}
+ {{var2 | raw }} #}

and it therefore expects a set of data to render it that is in the following format:

+
{
+    "btnText": "This is an button component!"
+}
+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/cardlink.html b/components/detail/cardlink.html new file mode 100644 index 0000000..9de7afa --- /dev/null +++ b/components/detail/cardlink.html @@ -0,0 +1,2058 @@ + + + + + + + + + + + + +cardlink component | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + cardlink component + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<a class="cmp-cardlink" href="https://www.google.com">Learn more</a>
+ + +
+ + +
+ + 
<a class="cmp-cardlink" href="{{link}}">{{textLink}}</a>
+ +
+ + +
+ + + + 
{
+  "textLink": "Learn more",
+  "link": "https://www.google.com"
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    "use strict";
+
+/**
+ *  This is the main file for CardLink
+ */
+
+/* STARTER CODE
+
+class CardLink {
+    constructor($inst) {
+        cponsole.log('Initializing CardLink')
+    }
+}
+
+*/
+
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cardlink/cardlink.js +
    • +
  • + Filesystem Path: + components/01-units/cardlink/cardlink.js +
    • +
  • + Size: + 181 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for CardLink
+ */
+
+.cmp-cardlink {
+  color: #1b3d6e;
+  text-transform: uppercase;
+  font-weight: bold;
+  font-size: 0.75rem;
+  font-weight: bold;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: normal;
+  letter-spacing: normal;
+  padding-bottom: 7px;
+  color: #1b3d6e;
+  border-bottom: 2px solid #f16824;
+  width: fit-content; //this class is given to a div instead a link and the link is moved inside the div, so the div width must be specified
+}
+
+.cmp-cardlink:hover {
+  text-decoration: none;
+  color: #1b3d6e;
+}
+
+@include media-breakpoint-up(lg) {
+  .cmp-cardlink {
+    border-bottom: none;
+  }
+
+  .cmp-cardlink:hover {
+    cursor: pointer;
+    border-bottom: 2px solid #f16824;
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cardlink/cardlink.scss +
    • +
  • + Filesystem Path: + components/01-units/cardlink/cardlink.scss +
    • +
  • + Size: + 718 Bytes +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/collapse-list.html b/components/detail/collapse-list.html new file mode 100644 index 0000000..72f0756 --- /dev/null +++ b/components/detail/collapse-list.html @@ -0,0 +1,2228 @@ + + + + + + + + + + + + +collapse-list component | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + collapse-list component + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<div class="cmp-collapse-list">
+    <div class="cmp-collapse-list__title">
+        Products
+        <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+        <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+    </div>
+    <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+        <ul>
+            <li>
+                <a href="www.google.com">ALLDATA Repair</a>
+            </li>
+            <li>
+                <a href="www.google.com">ALLDTA Collision</a>
+            </li>
+            <li>
+                <a href="www.google.com">ALLDATA Mobile</a>
+            </li>
+            <li>
+                <a href="www.google.com">ALLDATA Diagnostics</a>
+            </li>
+            <li>
+                <a href="www.google.com">ALLDATA Tech-Assits</a>
+            </li>
+            <li>
+                <a href="www.google.com">ALLDATA Manage Online</a>
+            </li>
+            <li>
+                <a href="www.google.com">ALLDATA Shop Manager</a>
+            </li>
+        </ul>
+    </div>
+</div>
+ + +
+ + +
+ + 
<div class="cmp-collapse-list">
+    <div class="cmp-collapse-list__title">
+        {{listTitle}}
+        <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            {% include "@image" with {src:"/images/list_more.svg",alt:"show more"} %}
+        </button>
+        <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            {% include "@image" with {src:"/images/list_close.svg",alt:"show less"} %}
+        </button>
+    </div>
+    <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+        <ul>
+            {% for content in listContents %}
+                <li>
+                    {% if content.listLink %}
+                    <a href="{{content.listLink}}">{{content.listText}}</a>
+                    {% else %}
+                    {{content.listText}}
+                    {% endif %}
+                </li> 
+            {% endfor %}
+        </ul>
+    </div>
+</div>
+ +
+ + +
+ + + + 
{
+  "listTitle": "Products",
+  "listContents": [
+    {
+      "listText": "ALLDATA Repair",
+      "listLink": "www.google.com"
+    },
+    {
+      "listText": "ALLDTA Collision",
+      "listLink": "www.google.com"
+    },
+    {
+      "listText": "ALLDATA Mobile",
+      "listLink": "www.google.com"
+    },
+    {
+      "listText": "ALLDATA Diagnostics",
+      "listLink": "www.google.com"
+    },
+    {
+      "listText": "ALLDATA Tech-Assits",
+      "listLink": "www.google.com"
+    },
+    {
+      "listText": "ALLDATA Manage Online",
+      "listLink": "www.google.com"
+    },
+    {
+      "listText": "ALLDATA Shop Manager",
+      "listLink": "www.google.com"
+    }
+  ]
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    'use strict';
+import $ from 'jquery'
+/**
+ *  This is the main file for Collapse List
+ */
+
+/* STARTER CODE
+
+class CollapseList {
+    constructor($inst) {
+        cponsole.log('Initializing CollapseList')
+    }
+}
+
+*/
+
+$( ".cmp-collapse-list__title" ).click(function() {
+    let parent = $(this).parent(".cmp-collapse-list");
+    let iconMore = $(this).children(".cmp-collapse-list-button__show-more");
+    let iconLess = $(this).children(".cmp-collapse-list-button__show-less");
+    let list = parent.children(".cmp-collapse-list__content");
+    let lists = $(".cmp-collapse-list").find(".cmp-collapse-list__content");
+    if(list.hasClass("list-closed")){
+        $.each(lists, function(value) {
+            let parentlists = $(this).parent(".cmp-collapse-list");
+            let titleLists = parentlists.children(".cmp-collapse-list__title");
+            let listMore = titleLists.children(".cmp-collapse-list-button__show-more");
+            let listLess = titleLists.children(".cmp-collapse-list-button__show-less");
+            if (!($(this).hasClass("list-closed"))) {
+                $(this).addClass("list-closed");
+                $(this).attr( "aria-hidden", "true");
+                $(this).attr( "aria-expanded", "false");
+                listMore.removeClass("d-none");
+                listLess.addClass("d-none");
+            } 
+        });
+        list.removeClass("list-closed");
+        list.attr( "aria-hidden", "false");
+        list.attr( "aria-expanded", "true");
+        iconMore.addClass("d-none");
+        iconLess.removeClass("d-none");
+    }else{
+        list.addClass("list-closed");
+        list.attr( "aria-hidden", "true");
+        list.attr( "aria-expanded", "false");
+        iconMore.removeClass("d-none");
+        iconLess.addClass("d-none");
+    }
+    
+    
+});
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/collapse-list/collapse-list.js +
    • +
  • + Filesystem Path: + components/blocks/collapse-list/collapse-list.js +
    • +
  • + Size: + 1.8 KB +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Collapse List
+ */
+
+.cmp-collapse-list {
+  width: 300px;
+  background-color: #1b3e6f;
+  font-size: 14px;
+  color: white;
+  margin-bottom: 10px;
+  width: 100%;
+  &__title{
+    letter-spacing: 0.18px;
+    text-transform: uppercase;
+    font-weight: bold;
+    margin-bottom: 25px;
+  }
+  &__content{
+    font-weight: 300;
+    line-height: 1.14;
+    // transition: max-height 0.3s;
+    overflow: hidden;
+    height: auto;
+    max-height: 1000px;
+    ul{
+      padding: 0;
+    }
+    li{
+      list-style: none;
+      margin-bottom: 20px;
+      
+    }
+    a{
+      color: white;
+    }
+    a:hover{
+      text-decoration: none;
+      cursor: pointer;
+    }
+  }
+
+  .cmp-collapse-list-button{
+    &__show-more, &__show-less{
+      display: inline-block;
+      float: right;
+      border: none;
+      background: none;
+    }
+  }
+
+  .list-closed{
+    height: 0px;
+    max-height: 0px;
+  }
+}
+
+@include  media-breakpoint-up(lg){
+
+  .cmp-collapse-list {
+
+    .list-closed{
+      height: auto;
+      max-height: 1000px;
+    }
+
+  }
+}
    +     + +
    +     +
    • +
  • + URL: + /components/raw/collapse-list/collapse-list.scss +
    • +
  • + Filesystem Path: + components/blocks/collapse-list/collapse-list.scss +
    • +
  • + Size: + 1 KB +
    • +
+
+ +
+
+ + + + +
+
    +
  • + Handle: + @collapse-list +
    • + + + + + +
  • + Preview: + + + +
    • +
  • + Filesystem Path: + components/blocks/collapse-list/collapse-list.twig +
    • + +
  • + References (1): + + + @image + + +
    • + + +
  • + Referenced by (1): + + + @footer + + +
    • + +
+
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/cols--content.html b/components/detail/cols--content.html new file mode 100644 index 0000000..490d956 --- /dev/null +++ b/components/detail/cols--content.html @@ -0,0 +1,2140 @@ + + + + + + + + + + + + +cols component: Content | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + cols component: Content + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<div class="cmp-cols  cols-1  cols-md-2  cols-lg-3  ">
+
+    <div>1</div>
+    <div>2</div>
+    <div>3</div>
+
+</div>
+ + +
+ + +
+ + 
{% set content %}
+
+<div>1</div>
+<div>2</div>
+<div>3</div>
+    
+{% endset %}
+{% include "@cols" %}
+ +
+ + +
+ + + + 
{
+  "text": "This is an cols component!",
+  "mobileModifier": "1",
+  "tabletModifier": "2",
+  "desktopModifier": "3"
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    "use strict";
+
+/**
+ *  This is the main file for Cols
+ */
+
+/* STARTER CODE
+
+class Cols {
+    constructor($inst) {
+        cponsole.log('Initializing Cols')
+    }
+}
+
+*/
+
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cols/cols.js +
    • +
  • + Filesystem Path: + components/02-layout/cols/cols.js +
    • +
  • + Size: + 169 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Cols
+ */
+
+@mixin cols-direct-child-not-col {
+  > *:not([class*=" col"]):not([class^="col"]):not(.field__items) {
+    @content;
+  }
+}
+
+@mixin cols-drupal-direct-child-not-col {
+  .field__items > *:not([class*=" col"]):not([class^="col"]) {
+    @content;
+  }
+}
+
+.cmp-cols {
+  @extend .row;
+
+  @include cols-direct-child-not-col {
+    @extend .col;
+  }
+
+  &.no-gutter {
+    @include cols-direct-child-not-col {
+      padding-right: 0;
+      padding-left: 0;
+    }
+  }
+
+  @for $i from 1 through 4 {
+    $colopposite: 12 / $i;
+    &.cols-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-#{$colopposite};
+      }
+    }
+    &.cols-md-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-md-#{$colopposite};
+      }
+    }
+    &.cols-lg-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-lg-#{$colopposite};
+      }
+    }
+  }
+}
+
+// drupal injects
+
+.cmp-cols {
+  .field__items {
+    @extend .row;
+  }
+
+  @include cols-drupal-direct-child-not-col {
+    @extend .col;
+  }
+
+  &.no-gutter {
+    @include cols-drupal-direct-child-not-col {
+      padding-right: 0;
+      padding-left: 0;
+    }
+  }
+
+  @for $i from 1 through 4 {
+    $colopposite: 12 / $i;
+    &.cols-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-#{$colopposite};
+      }
+    }
+    &.cols-md-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-md-#{$colopposite};
+      }
+    }
+    &.cols-lg-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-lg-#{$colopposite};
+      }
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cols/cols.scss +
    • +
  • + Filesystem Path: + components/02-layout/cols/cols.scss +
    • +
  • + Size: + 1.6 KB +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/cols--default.html b/components/detail/cols--default.html new file mode 100644 index 0000000..64b802c --- /dev/null +++ b/components/detail/cols--default.html @@ -0,0 +1,2153 @@ + + + + + + + + + + + + +cols component: Default | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + cols component: Default + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<div class="cmp-cols  cols-1  cols-md-2  cols-lg-3  ">
+
+</div>
+ + +
+ + +
+ + 
<div class="cmp-cols {% if mobileModifier %} cols-{{mobileModifier}}{% endif %} {% if tabletModifier %} cols-md-{{tabletModifier}}{% endif %} {% if desktopModifier %} cols-lg-{{desktopModifier}}{% endif %} {% if noGutter %} no-gutter {% endif %} ">
+   
+
+
+   {% if content %}
+    {{content}}
+   {% endif %}
+   
+</div>
+ +
+ + +
+ + + + 
{
+  "text": "This is an cols component!",
+  "mobileModifier": "1",
+  "tabletModifier": "2",
+  "desktopModifier": "3"
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    "use strict";
+
+/**
+ *  This is the main file for Cols
+ */
+
+/* STARTER CODE
+
+class Cols {
+    constructor($inst) {
+        cponsole.log('Initializing Cols')
+    }
+}
+
+*/
+
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cols/cols.js +
    • +
  • + Filesystem Path: + components/02-layout/cols/cols.js +
    • +
  • + Size: + 169 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Cols
+ */
+
+@mixin cols-direct-child-not-col {
+  > *:not([class*=" col"]):not([class^="col"]):not(.field__items) {
+    @content;
+  }
+}
+
+@mixin cols-drupal-direct-child-not-col {
+  .field__items > *:not([class*=" col"]):not([class^="col"]) {
+    @content;
+  }
+}
+
+.cmp-cols {
+  @extend .row;
+
+  @include cols-direct-child-not-col {
+    @extend .col;
+  }
+
+  &.no-gutter {
+    @include cols-direct-child-not-col {
+      padding-right: 0;
+      padding-left: 0;
+    }
+  }
+
+  @for $i from 1 through 4 {
+    $colopposite: 12 / $i;
+    &.cols-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-#{$colopposite};
+      }
+    }
+    &.cols-md-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-md-#{$colopposite};
+      }
+    }
+    &.cols-lg-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-lg-#{$colopposite};
+      }
+    }
+  }
+}
+
+// drupal injects
+
+.cmp-cols {
+  .field__items {
+    @extend .row;
+  }
+
+  @include cols-drupal-direct-child-not-col {
+    @extend .col;
+  }
+
+  &.no-gutter {
+    @include cols-drupal-direct-child-not-col {
+      padding-right: 0;
+      padding-left: 0;
+    }
+  }
+
+  @for $i from 1 through 4 {
+    $colopposite: 12 / $i;
+    &.cols-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-#{$colopposite};
+      }
+    }
+    &.cols-md-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-md-#{$colopposite};
+      }
+    }
+    &.cols-lg-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-lg-#{$colopposite};
+      }
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cols/cols.scss +
    • +
  • + Filesystem Path: + components/02-layout/cols/cols.scss +
    • +
  • + Size: + 1.6 KB +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/cols--drupalcontent.html b/components/detail/cols--drupalcontent.html new file mode 100644 index 0000000..4215b9e --- /dev/null +++ b/components/detail/cols--drupalcontent.html @@ -0,0 +1,2149 @@ + + + + + + + + + + + + +cols component: Drupalcontent | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + cols component: Drupalcontent + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<div class="cmp-cols  cols-1  cols-md-2  cols-lg-3  ">
+
+    <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+        <div>1</div>
+        <div>2</div>
+        <div>3</div>
+
+    </div>
+
+</div>
+ + +
+ + +
+ + 
{% set content %}
+
+	{% set items %}
+		<div>1</div>
+		<div>2</div>
+		<div>3</div>
+	{% endset %}
+
+	{% include "@drupalitemsfacade" with {items:items} %}
+{% endset %}
+
+{% include "@cols" %}
+ +
+ + +
+ + + + 
{
+  "text": "This is an cols component!",
+  "mobileModifier": "1",
+  "tabletModifier": "2",
+  "desktopModifier": "3"
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    "use strict";
+
+/**
+ *  This is the main file for Cols
+ */
+
+/* STARTER CODE
+
+class Cols {
+    constructor($inst) {
+        cponsole.log('Initializing Cols')
+    }
+}
+
+*/
+
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cols/cols.js +
    • +
  • + Filesystem Path: + components/02-layout/cols/cols.js +
    • +
  • + Size: + 169 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Cols
+ */
+
+@mixin cols-direct-child-not-col {
+  > *:not([class*=" col"]):not([class^="col"]):not(.field__items) {
+    @content;
+  }
+}
+
+@mixin cols-drupal-direct-child-not-col {
+  .field__items > *:not([class*=" col"]):not([class^="col"]) {
+    @content;
+  }
+}
+
+.cmp-cols {
+  @extend .row;
+
+  @include cols-direct-child-not-col {
+    @extend .col;
+  }
+
+  &.no-gutter {
+    @include cols-direct-child-not-col {
+      padding-right: 0;
+      padding-left: 0;
+    }
+  }
+
+  @for $i from 1 through 4 {
+    $colopposite: 12 / $i;
+    &.cols-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-#{$colopposite};
+      }
+    }
+    &.cols-md-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-md-#{$colopposite};
+      }
+    }
+    &.cols-lg-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-lg-#{$colopposite};
+      }
+    }
+  }
+}
+
+// drupal injects
+
+.cmp-cols {
+  .field__items {
+    @extend .row;
+  }
+
+  @include cols-drupal-direct-child-not-col {
+    @extend .col;
+  }
+
+  &.no-gutter {
+    @include cols-drupal-direct-child-not-col {
+      padding-right: 0;
+      padding-left: 0;
+    }
+  }
+
+  @for $i from 1 through 4 {
+    $colopposite: 12 / $i;
+    &.cols-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-#{$colopposite};
+      }
+    }
+    &.cols-md-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-md-#{$colopposite};
+      }
+    }
+    &.cols-lg-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-lg-#{$colopposite};
+      }
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cols/cols.scss +
    • +
  • + Filesystem Path: + components/02-layout/cols/cols.scss +
    • +
  • + Size: + 1.6 KB +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/cols.html b/components/detail/cols.html new file mode 100644 index 0000000..9132560 --- /dev/null +++ b/components/detail/cols.html @@ -0,0 +1,2153 @@ + + + + + + + + + + + + +cols component | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + cols component + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<div class="cmp-cols  cols-1  cols-md-2  cols-lg-3  ">
+
+</div>
+ + +
+ + +
+ + 
<div class="cmp-cols {% if mobileModifier %} cols-{{mobileModifier}}{% endif %} {% if tabletModifier %} cols-md-{{tabletModifier}}{% endif %} {% if desktopModifier %} cols-lg-{{desktopModifier}}{% endif %} {% if noGutter %} no-gutter {% endif %} ">
+   
+
+
+   {% if content %}
+    {{content}}
+   {% endif %}
+   
+</div>
+ +
+ + +
+ + + + 
{
+  "text": "This is an cols component!",
+  "mobileModifier": "1",
+  "tabletModifier": "2",
+  "desktopModifier": "3"
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    "use strict";
+
+/**
+ *  This is the main file for Cols
+ */
+
+/* STARTER CODE
+
+class Cols {
+    constructor($inst) {
+        cponsole.log('Initializing Cols')
+    }
+}
+
+*/
+
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cols/cols.js +
    • +
  • + Filesystem Path: + components/02-layout/cols/cols.js +
    • +
  • + Size: + 169 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Cols
+ */
+
+@mixin cols-direct-child-not-col {
+  > *:not([class*=" col"]):not([class^="col"]):not(.field__items) {
+    @content;
+  }
+}
+
+@mixin cols-drupal-direct-child-not-col {
+  .field__items > *:not([class*=" col"]):not([class^="col"]) {
+    @content;
+  }
+}
+
+.cmp-cols {
+  @extend .row;
+
+  @include cols-direct-child-not-col {
+    @extend .col;
+  }
+
+  &.no-gutter {
+    @include cols-direct-child-not-col {
+      padding-right: 0;
+      padding-left: 0;
+    }
+  }
+
+  @for $i from 1 through 4 {
+    $colopposite: 12 / $i;
+    &.cols-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-#{$colopposite};
+      }
+    }
+    &.cols-md-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-md-#{$colopposite};
+      }
+    }
+    &.cols-lg-#{$i} {
+      @include cols-direct-child-not-col {
+        @extend .col-lg-#{$colopposite};
+      }
+    }
+  }
+}
+
+// drupal injects
+
+.cmp-cols {
+  .field__items {
+    @extend .row;
+  }
+
+  @include cols-drupal-direct-child-not-col {
+    @extend .col;
+  }
+
+  &.no-gutter {
+    @include cols-drupal-direct-child-not-col {
+      padding-right: 0;
+      padding-left: 0;
+    }
+  }
+
+  @for $i from 1 through 4 {
+    $colopposite: 12 / $i;
+    &.cols-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-#{$colopposite};
+      }
+    }
+    &.cols-md-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-md-#{$colopposite};
+      }
+    }
+    &.cols-lg-#{$i} {
+      @include cols-drupal-direct-child-not-col {
+        @extend .col-lg-#{$colopposite};
+      }
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/cols/cols.scss +
    • +
  • + Filesystem Path: + components/02-layout/cols/cols.scss +
    • +
  • + Size: + 1.6 KB +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/companies--bs.html b/components/detail/companies--bs.html new file mode 100644 index 0000000..6648424 --- /dev/null +++ b/components/detail/companies--bs.html @@ -0,0 +1,2473 @@ + + + + + + + + + + + + +companies component: Bs | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + companies component: Bs + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 
<div class="cmp-companies cmp-companies__bs">
+    <div class="cmp-companies-sm d-lg-none">
+
+        <div id="carouselCompanyMB" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+
+            <div class="carousel-inner">
+
+                <div class="carousel-item  active ">
+                    <div class="cmp-companies-page text-center">
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/asa-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">association</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/bosch-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/jiffy-lube.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">customer</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                            </div>
+                        </div>
+                    </div>
+
+                </div>
+                <div class="carousel-item ">
+                    <div class="cmp-companies-page text-center">
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                            </div>
+                        </div>
+                    </div>
+
+                </div>
+
+            </div>
+            <div class="cmp-slider-controls d-flex bottom">
+                <a class="cmp-slider-prev" href="#carouselCompanyMB" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                <ol class="carousel-indicators">
+                    <li data-target="#carouselCompanyMB" data-slide-to="0" class="active"></li>
+                    <li data-target="#carouselCompanyMB" data-slide-to="1"></li>
+                </ol>
+                <a class="cmp-slider-next" href="#carouselCompanyMB" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+            </div>
+        </div>
+
+    </div>
+
+    <div class="cmp-companies-lg d-none d-lg-block">
+
+        <div id="carouselCompanyDK" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+            <div class="cmp-slider-controls d-flex">
+                <a class="cmp-slider-prev" href="#carouselCompanyDK" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                <ol class="carousel-indicators">
+                    <li data-target="#carouselCompanyDK" data-slide-to="0" class="active"></li>
+                    <li data-target="#carouselCompanyDK" data-slide-to="1"></li>
+                    <li data-target="#carouselCompanyDK" data-slide-to="2"></li>
+                </ol>
+                <a class="cmp-slider-next" href="#carouselCompanyDK" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+            </div>
+
+            <div class="carousel-inner">
+
+                <div class="carousel-item  active ">
+                    <div class="cmp-companies-page text-center">
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/asa-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">association</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/bosch-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/jiffy-lube.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">customer</small>
+                            </div>
+                        </div>
+                    </div>
+
+                </div>
+                <div class="carousel-item ">
+                    <div class="cmp-companies-page text-center">
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                            </div>
+                        </div>
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                            </div>
+                        </div>
+                    </div>
+
+                </div>
+                <div class="carousel-item ">
+                    <div class="cmp-companies-page text-center">
+                        <div class="cmp-companies-company">
+                            <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                            </div>
+                        </div>
+                    </div>
+
+                </div>
+
+            </div>
+        </div>
+    </div>
+
+</div>
+ + +
+ + +
+ + 
{% set MB_NUMBER = 6 %}
+{% set DK_NUMBER = 5 %}
+{% set countMobile = companies.length / MB_NUMBER %}
+{% set countMobile = countMobile|round(0, 'ceil') %}
+{% set countDesktop = companies.length / DK_NUMBER %}
+{% set countDesktop = countDesktop|round(0, 'ceil') %}
+{% set lenght = companies.length %}
+{% set template = 'companies--page' %}
+
+<div class="cmp-companies cmp-companies__bs">
+	<div class="cmp-companies-sm d-lg-none">
+
+		{% set modelsMB = [] %}
+
+		{% for idx in 0..(countMobile-1) %}
+		  {% set modelsMB = modelsMB|merge([ {companies: companies|slice((idx* MB_NUMBER), MB_NUMBER)}]) %}
+		{% endfor %}
+
+		{% include "@slider--dyn" with {carouselId: 'carouselCompanyMB', models : modelsMB, sameHeight: true, template : template, controlsBottom: true} %}
+
+
+	</div>
+
+	<div class="cmp-companies-lg d-none d-lg-block">
+		{% set modelsDK = [] %}
+		{% for idx in 0..(countDesktop-1) %}
+		  {% set modelsDK = modelsDK|merge([ {companies: companies|slice((idx* DK_NUMBER), DK_NUMBER)}]) %}
+		{% endfor %}
+		{% include "@slider--dyn" with {carouselId: 'carouselCompanyDK', models : modelsDK, sameHeight: true, template : template} %}
+
+	</div>
+
+</div>
+ +
+ + +
+ + + + 
{
+  "companies": [
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "association",
+      "src": "/images/asa-logo.svg"
+    },
+    {
+      "affiliation": "integration partner",
+      "src": "/images/carmax-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/bosch-logo.svg"
+    },
+    {
+      "affiliation": "customer",
+      "src": "/images/jiffy-lube.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "integration partner",
+      "src": "/images/carmax-logo.svg"
+    }
+  ]
+}
+ + + +
+ + + + + +
+
+ +
+ + +
+ + +
+
    +
  • + Content: + +
    + + + 
    "use strict";
+// import { tns } from "tiny-slider/src/tiny-slider";
+// import $ from "jquery";
+/**
+ *  This is the main file for Companies
+ */
+
+/* STARTER CODE
+
+class Companies {
+    constructor($inst) {
+        cponsole.log('Initializing Companies')
+    }
+}
+
+*/
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/companies/companies.js +
    • +
  • + Filesystem Path: + components/01-units/companies/companies.js +
    • +
  • + Size: + 263 Bytes +
    • +
+
+ +
+
    +
  • + Content: + +
    + + + 
    /**
+ *  Main css for Companies
+ */
+
+.cmp-companies__bs {
+  @include media-breakpoint-up(lg) {
+    a.cmp-slider-prev,
+    a.cmp-slider-next {
+      position: absolute;
+      margin-top: -50px;
+    }
+    a.cmp-slider-prev {
+      left: 1em;
+    }
+    a.cmp-slider-next {
+      right: 1em;
+    }
+    ol.carousel-indicators {
+      display: none;
+    }
+  }
+}
+
+.cmp-companies-page {
+  display: flex;
+  flex-wrap: wrap;
+
+  .cmp-companies-company {
+    width: 33%;
+    flex: 0 0 33.333%;
+    max-width: 33.333%;
+    @extend .py-2;
+    display: flex;
+    flex-direction: column;
+    .cmp-companies-logo {
+      display: flex;
+      flex-direction: column;
+    }
+    .cmp-company-affiliation {
+      font-size: 8px;
+      line-height: 1.25;
+      letter-spacing: 0.16px;
+      color: #54565a;
+      text-transform: uppercase;
+    }
+
+    @include media-breakpoint-up(lg) {
+      width: 20%;
+      flex: 0 0 20%;
+      max-width: 20%;
+
+      .cmp-company-affiliation {
+        font-size: 10px;
+        letter-spacing: 0.2px;
+        order: -1;
+      }
+    }
+  }
+}
+
+.cmp-companies__bs {
+}
+
+.cmp-companies-page {
+  display: flex;
+  flex-wrap: wrap;
+
+  .cmp-companies-company {
+    width: 33%;
+    flex: 0 0 33.333%;
+    max-width: 33.333%;
+    @extend .py-2;
+    display: flex;
+    flex-direction: column;
+
+    @include media-breakpoint-up(lg) {
+      width: 20%;
+      flex: 0 0 20%;
+      max-width: 20%;
+
+      .cmp-company-affiliation {
+        order: -1;
+      }
+    }
+  }
+}
+
    +     + +
    +     +
    • +
  • + URL: + /components/raw/companies/companies.scss +
    • +
  • + Filesystem Path: + components/01-units/companies/companies.scss +
    • +
  • + Size: + 1.5 KB +
    • +
+
+ +
+
+ + + + +
+ +
+ + +
+
+ +

There are no notes for this item.

+ +
+
+ + + +
+ +
+ + + + +
+ + +
+
+ +
+ +
+ + +
+
+
+ + + + + + + + + + diff --git a/components/detail/companies--default.html b/components/detail/companies--default.html new file mode 100644 index 0000000..b413578 --- /dev/null +++ b/components/detail/companies--default.html @@ -0,0 +1,2159 @@ + + + + + + + + + + + + +companies component: Default | alldata components + + + + + + +
+ +
+
+ + alldata components +
+ +
+ +
+ +
+
+ + + + + + +
+ + + +
+

+ + companies component: Default + + + + + + +

+ + +
+ + + +
+ + +
+ + +
+
+
+ + +
+
+
+
+
+ + +
+ +
+
+ + + +
+ +
+ + + + +
+ + + 

+        
+    
+

+
+    
+    

+    
+        

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "companies": [
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "association",
+      "src": "/images/asa-logo.svg"
+    },
+    {
+      "affiliation": "integration partner",
+      "src": "/images/carmax-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/bosch-logo.svg"
+    },
+    {
+      "affiliation": "customer",
+      "src": "/images/jiffy-lube.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "integration partner",
+      "src": "/images/carmax-logo.svg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+// import { tns } from "tiny-slider/src/tiny-slider";
+// import $ from "jquery";
+/**
+ *  This is the main file for Companies
+ */
+
+/* STARTER CODE
+
+class Companies {
+    constructor($inst) {
+        cponsole.log('Initializing Companies')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/companies/companies.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/companies/companies.js
+                
    • 
+                
  • 
+                    Size:
+                    263 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Companies
+ */
+
+.cmp-companies__bs {
+  @include media-breakpoint-up(lg) {
+    a.cmp-slider-prev,
+    a.cmp-slider-next {
+      position: absolute;
+      margin-top: -50px;
+    }
+    a.cmp-slider-prev {
+      left: 1em;
+    }
+    a.cmp-slider-next {
+      right: 1em;
+    }
+    ol.carousel-indicators {
+      display: none;
+    }
+  }
+}
+
+.cmp-companies-page {
+  display: flex;
+  flex-wrap: wrap;
+
+  .cmp-companies-company {
+    width: 33%;
+    flex: 0 0 33.333%;
+    max-width: 33.333%;
+    @extend .py-2;
+    display: flex;
+    flex-direction: column;
+    .cmp-companies-logo {
+      display: flex;
+      flex-direction: column;
+    }
+    .cmp-company-affiliation {
+      font-size: 8px;
+      line-height: 1.25;
+      letter-spacing: 0.16px;
+      color: #54565a;
+      text-transform: uppercase;
+    }
+
+    @include media-breakpoint-up(lg) {
+      width: 20%;
+      flex: 0 0 20%;
+      max-width: 20%;
+
+      .cmp-company-affiliation {
+        font-size: 10px;
+        letter-spacing: 0.2px;
+        order: -1;
+      }
+    }
+  }
+}
+
+.cmp-companies__bs {
+}
+
+.cmp-companies-page {
+  display: flex;
+  flex-wrap: wrap;
+
+  .cmp-companies-company {
+    width: 33%;
+    flex: 0 0 33.333%;
+    max-width: 33.333%;
+    @extend .py-2;
+    display: flex;
+    flex-direction: column;
+
+    @include media-breakpoint-up(lg) {
+      width: 20%;
+      flex: 0 0 20%;
+      max-width: 20%;
+
+      .cmp-company-affiliation {
+        order: -1;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/companies/companies.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/companies/companies.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.5 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/companies--page.html b/components/detail/companies--page.html
new file mode 100644
index 0000000..c35db7b
--- /dev/null
+++ b/components/detail/companies--page.html
@@ -0,0 +1,2266 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+companies component: Page | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            companies component: Page
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-companies-page text-center">
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/asa-logo.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">association</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/bosch-logo.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/jiffy-lube.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">customer</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/key.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/key.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/key.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+        </div>
+    </div>
+    <div class="cmp-companies-company">
+        <div class="cmp-companies-logo my-auto my-lg-0">
+
+            <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+            <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+        </div>
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-companies-page text-center">
+	{% for company in companies %}
+		<div class="cmp-companies-company">
+			<div class="cmp-companies-logo my-auto my-lg-0">
+			{% include "@image" with company %}
+			<small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">{{company.affiliation}}</small>
+			</div>
+		</div>
+	{% endfor %}
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "companies": [
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "association",
+      "src": "/images/asa-logo.svg"
+    },
+    {
+      "affiliation": "integration partner",
+      "src": "/images/carmax-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/bosch-logo.svg"
+    },
+    {
+      "affiliation": "customer",
+      "src": "/images/jiffy-lube.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "integration partner",
+      "src": "/images/carmax-logo.svg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+// import { tns } from "tiny-slider/src/tiny-slider";
+// import $ from "jquery";
+/**
+ *  This is the main file for Companies
+ */
+
+/* STARTER CODE
+
+class Companies {
+    constructor($inst) {
+        cponsole.log('Initializing Companies')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/companies/companies.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/companies/companies.js
+                
    • 
+                
  • 
+                    Size:
+                    263 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Companies
+ */
+
+.cmp-companies__bs {
+  @include media-breakpoint-up(lg) {
+    a.cmp-slider-prev,
+    a.cmp-slider-next {
+      position: absolute;
+      margin-top: -50px;
+    }
+    a.cmp-slider-prev {
+      left: 1em;
+    }
+    a.cmp-slider-next {
+      right: 1em;
+    }
+    ol.carousel-indicators {
+      display: none;
+    }
+  }
+}
+
+.cmp-companies-page {
+  display: flex;
+  flex-wrap: wrap;
+
+  .cmp-companies-company {
+    width: 33%;
+    flex: 0 0 33.333%;
+    max-width: 33.333%;
+    @extend .py-2;
+    display: flex;
+    flex-direction: column;
+    .cmp-companies-logo {
+      display: flex;
+      flex-direction: column;
+    }
+    .cmp-company-affiliation {
+      font-size: 8px;
+      line-height: 1.25;
+      letter-spacing: 0.16px;
+      color: #54565a;
+      text-transform: uppercase;
+    }
+
+    @include media-breakpoint-up(lg) {
+      width: 20%;
+      flex: 0 0 20%;
+      max-width: 20%;
+
+      .cmp-company-affiliation {
+        font-size: 10px;
+        letter-spacing: 0.2px;
+        order: -1;
+      }
+    }
+  }
+}
+
+.cmp-companies__bs {
+}
+
+.cmp-companies-page {
+  display: flex;
+  flex-wrap: wrap;
+
+  .cmp-companies-company {
+    width: 33%;
+    flex: 0 0 33.333%;
+    max-width: 33.333%;
+    @extend .py-2;
+    display: flex;
+    flex-direction: column;
+
+    @include media-breakpoint-up(lg) {
+      width: 20%;
+      flex: 0 0 20%;
+      max-width: 20%;
+
+      .cmp-company-affiliation {
+        order: -1;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/companies/companies.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/companies/companies.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.5 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/companies.html b/components/detail/companies.html
new file mode 100644
index 0000000..a07234d
--- /dev/null
+++ b/components/detail/companies.html
@@ -0,0 +1,2168 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+companies component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            companies component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        

+        
+    
+

+
+    
+    

+    
+        

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "companies": [
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "association",
+      "src": "/images/asa-logo.svg"
+    },
+    {
+      "affiliation": "integration partner",
+      "src": "/images/carmax-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/bosch-logo.svg"
+    },
+    {
+      "affiliation": "customer",
+      "src": "/images/jiffy-lube.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "Association",
+      "src": "/images/3-m-logo.svg"
+    },
+    {
+      "affiliation": "Associaiton",
+      "src": "/images/key.svg"
+    },
+    {
+      "affiliation": "integration partner",
+      "src": "/images/carmax-logo.svg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+// import { tns } from "tiny-slider/src/tiny-slider";
+// import $ from "jquery";
+/**
+ *  This is the main file for Companies
+ */
+
+/* STARTER CODE
+
+class Companies {
+    constructor($inst) {
+        cponsole.log('Initializing Companies')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/companies/companies.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/companies/companies.js
+                
    • 
+                
  • 
+                    Size:
+                    263 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Companies
+ */
+
+.cmp-companies__bs {
+  @include media-breakpoint-up(lg) {
+    a.cmp-slider-prev,
+    a.cmp-slider-next {
+      position: absolute;
+      margin-top: -50px;
+    }
+    a.cmp-slider-prev {
+      left: 1em;
+    }
+    a.cmp-slider-next {
+      right: 1em;
+    }
+    ol.carousel-indicators {
+      display: none;
+    }
+  }
+}
+
+.cmp-companies-page {
+  display: flex;
+  flex-wrap: wrap;
+
+  .cmp-companies-company {
+    width: 33%;
+    flex: 0 0 33.333%;
+    max-width: 33.333%;
+    @extend .py-2;
+    display: flex;
+    flex-direction: column;
+    .cmp-companies-logo {
+      display: flex;
+      flex-direction: column;
+    }
+    .cmp-company-affiliation {
+      font-size: 8px;
+      line-height: 1.25;
+      letter-spacing: 0.16px;
+      color: #54565a;
+      text-transform: uppercase;
+    }
+
+    @include media-breakpoint-up(lg) {
+      width: 20%;
+      flex: 0 0 20%;
+      max-width: 20%;
+
+      .cmp-company-affiliation {
+        font-size: 10px;
+        letter-spacing: 0.2px;
+        order: -1;
+      }
+    }
+  }
+}
+
+.cmp-companies__bs {
+}
+
+.cmp-companies-page {
+  display: flex;
+  flex-wrap: wrap;
+
+  .cmp-companies-company {
+    width: 33%;
+    flex: 0 0 33.333%;
+    max-width: 33.333%;
+    @extend .py-2;
+    display: flex;
+    flex-direction: column;
+
+    @include media-breakpoint-up(lg) {
+      width: 20%;
+      flex: 0 0 20%;
+      max-width: 20%;
+
+      .cmp-company-affiliation {
+        order: -1;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/companies/companies.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/companies/companies.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.5 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/demo01172020.html b/components/detail/demo01172020.html
new file mode 100644
index 0000000..889ecbf
--- /dev/null
+++ b/components/detail/demo01172020.html
@@ -0,0 +1,6448 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+demo01172020 component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            demo01172020 component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="page">
+
+    <div class="highlighted">
+        <aside class="layout-container section clearfix" role="complementary">
+            <div class="region region-highlighted">
+                <div data-drupal-messages-fallback="" class="hidden"></div>
+
+            </div>
+
+        </aside>
+    </div>
+    <div id="main-wrapper" class="layout-main-wrapper layout-container clearfix">
+        <div id="main" class="layout-main clearfix">
+
+            <main id="content" class="column main-content" role="main">
+                <section class="section">
+                    <a id="main-content" tabindex="-1"></a>
+                    <div class="region region-content">
+                        <div id="block-alldata-block" data-block-plugin-id="block_content:58ad31b5-cc64-4861-979a-11ae1a0f4ce4" class="block block-block-content block-block-content58ad31b5-cc64-4861-979a-11ae1a0f4ce4">
+
+                            <div class="content">
+
+                                <div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item">
+                                    <div id="google_translate_element">
+                                        <div class="skiptranslate goog-te-gadget" dir="ltr" style="">
+                                            <div id=":0.targetLanguage" class="goog-te-gadget-simple" style="white-space: nowrap;"><img src="https://www.google.com/images/cleardot.gif" class="goog-te-gadget-icon" alt="" style="background-image: url(&quot;https://translate.googleapis.com/translate_static/img/te_ctrl3.gif&quot;); background-position: -65px 0px;">
+                                                <span
+                                                    style="vertical-align: middle;"><a aria-haspopup="true" class="goog-te-menu-value" href="javascript:void(0)"><span>Select Language</span><img
+                                                            src="https://www.google.com/images/cleardot.gif" alt=""
+                                                            width="1" height="1"><span
+                                                            style="border-left: 1px solid rgb(187, 187, 187);">​</span><img
+                                                            src="https://www.google.com/images/cleardot.gif" alt=""
+                                                            width="1" height="1"><span aria-hidden="true"
+                                                            style="color: rgb(118, 118, 118);">▼</span></a></span>
+                                            </div>
+                                        </div>
+                                    </div>
+
+                                </div>
+
+                            </div>
+                        </div>
+                        <div id="block-alldata-content" data-block-plugin-id="system_main_block" class="block block-system block-system-main-block">
+
+                            <div class="content">
+
+                                <article role="article" about="/home" class="node node--type-alldata-landing-page node--promoted node--view-mode-full clearfix">
+                                    <header>
+
+                                    </header>
+                                    <div class="node__content clearfix">
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;Links&quot; field" data-block-plugin-id="extra_field_block:node:alldata_landing_page:links" class="block block-layout-builder block-extra-field-blocknodealldata-landing-pagelinks">
+
+                                                    <div class="content">
+
+                                                    </div>
+                                                </div>
+                                                <div data-layout-content-preview-placeholder-label="&quot;Hero slider&quot; block" data-block-plugin-id="block_content:3de97c39-092c-4949-a32a-07d55fde05a3" class="block block-block-content block-block-content3de97c39-092c-4949-a32a-07d55fde05a3">
+
+                                                    <div class="content">
+                                                        <section class="columns is-centered position-relative">
+                                                            <div class="cmp-hero">
+                                                                <div class="cmp-cols row  cols-1  cols-md-2">
+                                                                    <div id="carouselHeroSlider" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+                                                                        <div class="cmp-slider-controls d-flex">
+                                                                            <a class="cmp-slider-prev" href="#carouselHeroSlider" role="button" data-slide="prev">
+                                                                                <svg xmlns="http://www.w3.org/2000/svg"
+                                                                                    aria-hidden="true" width="9"
+                                                                                    height="15" viewBox="0 0 9 15">
+                                                                                    <path fill-rule="evenodd"
+                                                                                        d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z">
+                                                                                    </path>
+                                                                                </svg>
+                                                                                <span class="sr-only">Previous</span>
+                                                                            </a>
+                                                                            <ol class="carousel-indicators">
+                                                                                <li data-target="#carouselHeroSlider" data-slide-to="0" class="active">
+                                                                                </li>
+                                                                                <li data-target="#carouselHeroSlider" data-slide-to="1" class=""></li>
+                                                                            </ol>
+                                                                            <a class="cmp-slider-next" href="#carouselHeroSlider" role="button" data-slide="next">
+                                                                                <svg xmlns="http://www.w3.org/2000/svg"
+                                                                                    aria-hidden="true" width="9"
+                                                                                    height="15" viewBox="0 0 9 15">
+                                                                                    <path fill-rule="evenodd"
+                                                                                        d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z">
+                                                                                    </path>
+                                                                                </svg>
+                                                                                <span class="sr-only">Next</span>
+                                                                            </a>
+                                                                        </div>
+                                                                        <div class="carousel-inner  left ">
+                                                                            <div class="carousel-item  active " style="min-height: 347.4px;">
+                                                                                <div class="paragraph paragraph--type--slider-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-jumbo ">
+                                                                                        <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+
+                                                                                            <div class="field field--name-field-slider-headline field--type-string field--label-hidden field__item">
+                                                                                                KYAUTOMOTIVE INTELLIGENCE
+                                                                                            </div>
+
+                                                                                        </h1>
+                                                                                        <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+                                                                                            <g fill="#F16824"
+                                                                                                fill-rule="evenodd">
+                                                                                                <path
+                                                                                                    d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                                                </path>
+                                                                                            </g>
+                                                                                        </svg>
+                                                                                        <div class="cmp-text">
+
+                                                                                            <div class="clearfix text-formatted field field--name-field-slider-body field--type-text-long field--label-hidden field__item">
+                                                                                                <p>From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+                                                                                                </p>
+                                                                                            </div>
+
+                                                                                        </div>
+                                                                                        <button class="cmp-button btn btn-outline-secondary">
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-cta field--type-link field--label-hidden field__item">
+                                                                                                <a href="">shop
+                                                                                                    products</a></div>
+                                                                                        </button>
+                                                                                    </div>
+
+                                                                                </div>
+
+                                                                            </div>
+                                                                            <div class="carousel-item   " style="min-height: 347.4px;">
+                                                                                <div class="paragraph paragraph--type--slider-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-jumbo ">
+                                                                                        <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+
+                                                                                            <div class="field field--name-field-slider-headline field--type-string field--label-hidden field__item">
+                                                                                                TESTING CAROUSEL</div>
+
+                                                                                        </h1>
+                                                                                        <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+                                                                                            <g fill="#F16824"
+                                                                                                fill-rule="evenodd">
+                                                                                                <path
+                                                                                                    d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                                                </path>
+                                                                                            </g>
+                                                                                        </svg>
+                                                                                        <div class="cmp-text">
+
+                                                                                            <div class="clearfix text-formatted field field--name-field-slider-body field--type-text-long field--label-hidden field__item">
+                                                                                                <p>slider 2 - From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+                                                                                                </p>
+                                                                                            </div>
+
+                                                                                        </div>
+                                                                                        <button class="cmp-button btn btn-outline-secondary">
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-cta field--type-link field--label-hidden field__item">
+                                                                                                <a
+                                                                                                    href="http://www.google.com">shop
+                                                                                                    products</a></div>
+                                                                                        </button>
+                                                                                    </div>
+
+                                                                                </div>
+
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </section>
+
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;WHY ALLDATA&quot; block" data-block-plugin-id="block_content:235385cd-e571-4c08-9933-b62475485588" class="block block-block-content block-block-content235385cd-e571-4c08-9933-b62475485588">
+
+                                                    <div class="content">
+                                                        <section class="columns is-centered bg-primary">
+                                                            <div class="inner-section ">
+                                                                <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+                                                                    <div class="cmp-jumbo  cmp-jumbo__simple ">
+                                                                        <h2 class="cmp-heading h2 cmp-jumbo__heading">
+
+                                                                            <div class="field field--name-field-brand-block-headline field--type-string field--label-hidden field__item">
+                                                                                WHY ALLDATA</div>
+
+                                                                        </h2>
+
+                                                                        <div class="clearfix text-formatted field field--name-field-brand-block-body field--type-text-long field--label-hidden field__item">
+                                                                            <p>ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000
+                                                                                technicians in over 115,000 shops worldwide.</p>
+                                                                        </div>
+
+                                                                    </div>
+                                                                    <div class="cmp-cols row  cols-1   cols-lg-3">
+
+                                                                        <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+                                                                            <div class="field__item">
+                                                                                <div class="paragraph paragraph--type--branding-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-brandingcard text-center py-4 py-lg-4 px-lg-4">
+
+                                                                                        <div class="field field--name-field-brand-icon field--type-entity-reference field--label-hidden field__item">
+                                                                                            <article class="media media--type-image media--view-mode-default">
+
+                                                                                                <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                    <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/fill-4%403x.png" alt="REPAIR INFORMATION" typeof="foaf:Image">
+
+                                                                                                </div>
+
+                                                                                            </article>
+                                                                                        </div>
+
+                                                                                        <h3 class="cmp-heading h3">
+
+                                                                                            <div class="field field--name-field-brand-headline field--type-string field--label-hidden field__item">
+                                                                                                REPAIR INFORMATION</div>
+
+                                                                                        </h3>
+
+                                                                                        <div class="clearfix text-formatted field field--name-field-brand-body field--type-text-long field--label-hidden field__item">
+                                                                                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                                                                                            </p>
+                                                                                        </div>
+
+                                                                                        <hr class="cmp-brandingcard__line">
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                            <div class="field__item">
+                                                                                <div class="paragraph paragraph--type--branding-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-brandingcard text-center py-4 py-lg-4 px-lg-4">
+
+                                                                                        <div class="field field--name-field-brand-icon field--type-entity-reference field--label-hidden field__item">
+                                                                                            <article class="media media--type-image media--view-mode-default">
+
+                                                                                                <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                    <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/fill-4%403x.png" alt="REPAIR INFORMATION" typeof="foaf:Image">
+
+                                                                                                </div>
+
+                                                                                            </article>
+                                                                                        </div>
+
+                                                                                        <h3 class="cmp-heading h3">
+
+                                                                                            <div class="field field--name-field-brand-headline field--type-string field--label-hidden field__item">
+                                                                                                DIAGNOSTICS</div>
+
+                                                                                        </h3>
+
+                                                                                        <div class="clearfix text-formatted field field--name-field-brand-body field--type-text-long field--label-hidden field__item">
+                                                                                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                                                                                            </p>
+                                                                                        </div>
+
+                                                                                        <hr class="cmp-brandingcard__line">
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                            <div class="field__item">
+                                                                                <div class="paragraph paragraph--type--branding-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-brandingcard text-center py-4 py-lg-4 px-lg-4">
+
+                                                                                        <div class="field field--name-field-brand-icon field--type-entity-reference field--label-hidden field__item">
+                                                                                            <article class="media media--type-image media--view-mode-default">
+
+                                                                                                <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                    <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/fill-4%403x.png" alt="REPAIR INFORMATION" typeof="foaf:Image">
+
+                                                                                                </div>
+
+                                                                                            </article>
+                                                                                        </div>
+
+                                                                                        <h3 class="cmp-heading h3">
+
+                                                                                            <div class="field field--name-field-brand-headline field--type-string field--label-hidden field__item">
+                                                                                                SHOP MANAGEMENT</div>
+
+                                                                                        </h3>
+
+                                                                                        <div class="clearfix text-formatted field field--name-field-brand-body field--type-text-long field--label-hidden field__item">
+                                                                                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                                                                                            </p>
+                                                                                        </div>
+
+                                                                                        <hr class="cmp-brandingcard__line">
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+
+                                                                    </div>
+                                                                </div>
+
+                                                            </div>
+                                                        </section>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;Who We Serve&quot; block" data-block-plugin-id="block_content:74749b5a-76b9-4341-97a0-c4f77f29b4d4" class="block block-block-content block-block-content74749b5a-76b9-4341-97a0-c4f77f29b4d4">
+
+                                                    <div class="content">
+                                                        <section class="columns is-centered">
+                                                            <div class="cmp-servicescards">
+                                                                <div class="cmp-jumbo  cmp-jumbo__No Button and no simple text ">
+                                                                    <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+
+                                                                        <div class="field field--name-field-card-sec-headline field--type-string field--label-hidden field__item">
+                                                                            Who We Serve</div>
+
+                                                                    </h2>
+                                                                    <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+                                                                        <g fill="#F16824" fill-rule="evenodd">
+                                                                            <path
+                                                                                d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                            </path>
+                                                                        </g>
+                                                                    </svg>
+                                                                </div>
+                                                                <div class="cmp-servicescards__cardcontainer mx-sm-auto">
+
+                                                                    <div class="field field--name-field-cards field--type-entity-reference field--label-hidden field__items">
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3661" class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation" class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div class="cmp-servcard__image">
+                                                                                            <div class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article class="media media--type-image media--view-mode-default">
+
+                                                                                                            <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg" alt="servicecard" typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile" style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div class="cmp-servcard__content">
+                                                                                            <h6 class="cmp-heading h6   ">
+
+                                                                                                <div class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    Independent collision shops
+                                                                                                </div>
+
+                                                                                            </h6>
+                                                                                            <button class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                                                                                        </p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div class="cmp-cardlink">
+
+                                                                                                    <div class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3666" class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation" class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div class="cmp-servcard__image">
+                                                                                            <div class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article class="media media--type-image media--view-mode-default">
+
+                                                                                                            <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg" alt="servicecard" typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile" style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div class="cmp-servcard__content">
+                                                                                            <h6 class="cmp-heading h6   ">
+
+                                                                                                <div class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    INDEPENDENT REPAIR SHOPS
+                                                                                                </div>
+
+                                                                                            </h6>
+                                                                                            <button class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                                                                                        </p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div class="cmp-cardlink">
+
+                                                                                                    <div class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3671" class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation" class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div class="cmp-servcard__image">
+                                                                                            <div class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article class="media media--type-image media--view-mode-default">
+
+                                                                                                            <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg" alt="servicecard" typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile" style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div class="cmp-servcard__content">
+                                                                                            <h6 class="cmp-heading h6   ">
+
+                                                                                                <div class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    MUTLI-SHOP</div>
+
+                                                                                            </h6>
+                                                                                            <button class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                                                                                        </p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div class="cmp-cardlink">
+
+                                                                                                    <div class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3676" class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation" class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div class="cmp-servcard__image">
+                                                                                            <div class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article class="media media--type-image media--view-mode-default">
+
+                                                                                                            <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg" alt="servicecard" typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile" style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div class="cmp-servcard__content">
+                                                                                            <h6 class="cmp-heading h6   ">
+
+                                                                                                <div class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    GOVERNMENT / EDUCATION
+                                                                                                </div>
+
+                                                                                            </h6>
+                                                                                            <button class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                                                                                        </p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div class="cmp-cardlink">
+
+                                                                                                    <div class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3681" class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation" class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div class="cmp-servcard__image">
+                                                                                            <div class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article class="media media--type-image media--view-mode-default">
+
+                                                                                                            <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg" alt="servicecard" typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile" style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div class="cmp-servcard__content">
+                                                                                            <h6 class="cmp-heading h6   ">
+
+                                                                                                <div class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    Dealerships</div>
+
+                                                                                            </h6>
+                                                                                            <button class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                                                                                        </p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div class="cmp-cardlink">
+
+                                                                                                    <div class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3686" class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation" class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div class="cmp-servcard__image">
+                                                                                            <div class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article class="media media--type-image media--view-mode-default">
+
+                                                                                                            <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg" alt="servicecard" typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile" style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div class="cmp-servcard__content">
+                                                                                            <h6 class="cmp-heading h6   ">
+
+                                                                                                <div class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    Single Vechicle Subscriber
+                                                                                                </div>
+
+                                                                                            </h6>
+                                                                                            <button class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                                                                                        </p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div class="cmp-cardlink">
+
+                                                                                                    <div class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Go To
+                                                                                                            DIY Site</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                    </div>
+
+                                                                </div>
+                                                            </div>
+                                                        </section>
+
+                                                    </div>
+                                                </div>
+                                                <div data-layout-content-preview-placeholder-label="&quot;What we do&quot; block" data-block-plugin-id="block_content:8c71e36f-4184-4df5-b87d-e1529c3a2969" class="block block-block-content block-block-content8c71e36f-4184-4df5-b87d-e1529c3a2969">
+
+                                                    <div class="content">
+                                                        <section class="columns is-centered position-relative">
+                                                            <div class="cmp-hero">
+                                                                <div class="cmp-cols row  cols-1  cols-md-2">
+                                                                    <div id="carouselHeroSlider" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+                                                                        <div class="carousel-inner single-slide right ">
+                                                                            <div class="carousel-item  active " style="min-height: 269.8px;">
+                                                                                <div class="paragraph paragraph--type--slider-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-jumbo ">
+                                                                                        <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+
+                                                                                            <div class="field field--name-field-slider-headline field--type-string field--label-hidden field__item">
+                                                                                                WHAT WE DO</div>
+
+                                                                                        </h1>
+                                                                                        <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+                                                                                            <g fill="#F16824"
+                                                                                                fill-rule="evenodd">
+                                                                                                <path
+                                                                                                    d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                                                </path>
+                                                                                            </g>
+                                                                                        </svg>
+                                                                                        <div class="cmp-text">
+
+                                                                                            <div class="clearfix text-formatted field field--name-field-slider-body field--type-text-long field--label-hidden field__item">
+                                                                                                <p>We are a
+                                                                                                    <strong>data-driven
+                                                                                                        solutions</strong> provider working
+                                                                                                    <strong>hard</strong> and
+                                                                                                    <strong>smart</strong> to help automotive repair shop and be the <strong>best
+                                                                                                        they can
+                                                                                                        be</strong></p>
+                                                                                            </div>
+
+                                                                                        </div>
+                                                                                        <button class="cmp-button btn btn-outline-secondary">
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-cta field--type-link field--label-hidden field__item">
+                                                                                                <a href="">ABOUT US</a>
+                                                                                            </div>
+                                                                                        </button>
+                                                                                    </div>
+
+                                                                                </div>
+
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </section>
+
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;Testimonial Section&quot; block" data-block-plugin-id="block_content:fbd40c5c-93ba-4065-8138-4787a00e8ae3" class="block block-block-content block-block-contentfbd40c5c-93ba-4065-8138-4787a00e8ae3">
+
+                                                    <div class="content">
+
+                                                        <section class="columns is-centered">
+                                                            <div class="inner-section ">
+                                                                <div class="cmp-testimonial">
+                                                                    <div class="cmp-testimonial-inner">
+                                                                        <div id="carouselTestimonialSlider" class="cmp-slider carousel slide pointer-event" data-ride="carousel" data-interval="false">
+                                                                            <div class="cmp-slider-controls d-flex">
+                                                                                <a class="cmp-slider-prev" href="#carouselTestimonialSlider" role="button" data-slide="prev">
+                                                                                    <svg xmlns="http://www.w3.org/2000/svg"
+                                                                                        aria-hidden="true" width="9"
+                                                                                        height="15" viewBox="0 0 9 15">
+                                                                                        <path fill-rule="evenodd"
+                                                                                            d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z">
+                                                                                        </path>
+                                                                                    </svg>
+                                                                                    <span
+                                                                                        class="sr-only">Previous</span>
+                                                                                </a>
+                                                                                <ol class="carousel-indicators">
+                                                                                    <li data-target="#carouselTestimonialSlider" data-slide-to="0" class="active"></li>
+                                                                                    <li data-target="#carouselTestimonialSlider" data-slide-to="1" class=""></li>
+                                                                                </ol>
+                                                                                <a class="cmp-slider-next" href="#carouselTestimonialSlider" role="button" data-slide="next">
+                                                                                    <svg xmlns="http://www.w3.org/2000/svg"
+                                                                                        aria-hidden="true" width="9"
+                                                                                        height="15" viewBox="0 0 9 15">
+                                                                                        <path fill-rule="evenodd"
+                                                                                            d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z">
+                                                                                        </path>
+                                                                                    </svg>
+                                                                                    <span class="sr-only">Next</span>
+                                                                                </a>
+                                                                            </div>
+
+                                                                            <div class="carousel-inner">
+                                                                                <div class="carousel-item  active ">
+
+                                                                                    <article role="article" about="/node/3651" class="node node--type-testimonial node--promoted node--view-mode-default">
+                                                                                        <div class="node__content">
+                                                                                            <div class="">
+                                                                                                <div class="cmp-cols row  cols-1  cols-md-2">
+                                                                                                    <div class="cmp-shadow-box-img">
+                                                                                                        <div class="desktop">
+                                                                                                            <div class="field field--name-field-testimonial-desk-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                <article class="media media--type-image media--view-mode-default">
+
+                                                                                                                    <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                        <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/richard.jpg" alt="Testimonial 1" typeof="foaf:Image">
+
+                                                                                                                    </div>
+
+                                                                                                                </article>
+                                                                                                            </div>
+                                                                                                        </div>
+                                                                                                        <div class="mobile" style="display: none;">
+                                                                                                            <div class="field field--name-field-testimonial-mobile-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                <article class="media media--type-image media--view-mode-default">
+
+                                                                                                                    <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                        <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/richard.jpg" width="669" height="738" alt="Testimonial 1" typeof="foaf:Image">
+
+                                                                                                                    </div>
+
+                                                                                                                </article>
+                                                                                                            </div>
+                                                                                                        </div>
+
+                                                                                                        <div class="cmp-shadow-box-play-container">
+                                                                                                            <button class="btn">
+                                                                                                                <img class="cmp-image "
+                                                                                                                    src="/images/play.svg"
+                                                                                                                    alt="">
+                                                                                                                <span
+                                                                                                                    class="sr-only"></span>
+                                                                                                            </button>
+                                                                                                        </div>
+                                                                                                    </div>
+                                                                                                    <div class="cmp-shadow-box-quote">
+                                                                                                        <div class="cmp-quote">
+                                                                                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+                                                                                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                                                                                <p>
+                                                                                                                </p>
+                                                                                                                <div class="clearfix text-formatted field field--name-field-testimonial-quote field--type-text-long field--label-hidden field__item">
+                                                                                                                    <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.
+                                                                                                                    </p>
+                                                                                                                </div>
+                                                                                                                <p></p>
+                                                                                                                <footer>
+                                                                                                                    <div class="field field--name-field-testimonial-cite field--type-string field--label-hidden field__item">
+                                                                                                                        Josh Kazdan, Autosphere
+                                                                                                                    </div>
+                                                                                                                </footer>
+                                                                                                            </blockquote>
+                                                                                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+                                                                                                        </div>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+
+                                                                                    </article>
+
+                                                                                </div>
+                                                                                <div class="carousel-item   ">
+
+                                                                                    <article role="article" about="/node/3656" class="node node--type-testimonial node--promoted node--view-mode-default">
+                                                                                        <div class="node__content">
+                                                                                            <div class="">
+                                                                                                <div class="cmp-cols row  cols-1  cols-md-2">
+                                                                                                    <div class="cmp-shadow-box-img">
+                                                                                                        <div class="desktop">
+                                                                                                            <div class="field field--name-field-testimonial-desk-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                <article class="media media--type-image media--view-mode-default">
+
+                                                                                                                    <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                        <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/richard.jpg" width="669" height="738" alt="Testimonial 1" typeof="foaf:Image">
+
+                                                                                                                    </div>
+
+                                                                                                                </article>
+                                                                                                            </div>
+                                                                                                        </div>
+                                                                                                        <div class="mobile" style="display: none;">
+                                                                                                            <div class="field field--name-field-testimonial-mobile-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                <article class="media media--type-image media--view-mode-default">
+
+                                                                                                                    <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                        <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/richard.jpg" width="669" height="738" alt="Testimonial 1" typeof="foaf:Image">
+
+                                                                                                                    </div>
+
+                                                                                                                </article>
+                                                                                                            </div>
+                                                                                                        </div>
+
+                                                                                                        <div class="cmp-shadow-box-play-container">
+                                                                                                            <button class="btn">
+                                                                                                                <img class="cmp-image "
+                                                                                                                    src="/images/play.svg"
+                                                                                                                    alt="">
+                                                                                                                <span
+                                                                                                                    class="sr-only"></span>
+                                                                                                            </button>
+                                                                                                        </div>
+                                                                                                    </div>
+                                                                                                    <div class="cmp-shadow-box-quote">
+                                                                                                        <div class="cmp-quote">
+                                                                                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+                                                                                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                                                                                <p>
+                                                                                                                </p>
+                                                                                                                <div class="clearfix text-formatted field field--name-field-testimonial-quote field--type-text-long field--label-hidden field__item">
+                                                                                                                    <p>2 -&nbsp;ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their
+                                                                                                                        fingertips.
+                                                                                                                    </p>
+                                                                                                                </div>
+                                                                                                                <p></p>
+                                                                                                                <footer>
+                                                                                                                    <div class="field field--name-field-testimonial-cite field--type-string field--label-hidden field__item">
+                                                                                                                        2- Josh Kazdan, Autosphere
+                                                                                                                    </div>
+                                                                                                                </footer>
+                                                                                                            </blockquote>
+                                                                                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+                                                                                                        </div>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+
+                                                                                    </article>
+
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+                                                                        <div class="cmp-testimonial-footer">
+                                                                            <p class="cmp-text">
+
+                                                                            </p>
+                                                                            <div class="clearfix text-formatted field field--name-field-shadowbox-description field--type-text-long field--label-hidden field__item">
+                                                                                <p>See what over 400,000 technicians can't work without.</p>
+                                                                            </div>
+
+                                                                            <p></p>
+                                                                            <button class="cmp-button btn btn-outline-secondary">
+                                                                                <div
+                                                                                    class="field field--name-field-shadow-cta field--type-link field--label-hidden field__item">
+                                                                                    <a href="">Get Started</a></div>
+                                                                            </button>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </section>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;SEE THE LATEST&quot; block" data-block-plugin-id="block_content:7e55eb43-1569-4ff4-9de6-38a4d4cb5ff1" class="block block-block-content block-block-content7e55eb43-1569-4ff4-9de6-38a4d4cb5ff1">
+
+                                                    <div class="content">
+
+                                                        <section class="cmp-skew columns is-centered bg-primary-100  ">
+                                                            <div class="inner-section ">
+                                                                <div class="cmp-latest">
+                                                                    <div class="container">
+                                                                        <h2 class="cmp-heading h2 has-line ">
+
+                                                                            <div class="field field--name-field-posts-headline field--type-string field--label-hidden field__item">
+                                                                                SEE THE LATEST</div>
+
+                                                                        </h2>
+                                                                        <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+                                                                            <g fill="#F16824" fill-rule="evenodd">
+                                                                                <path
+                                                                                    d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                                </path>
+                                                                            </g>
+                                                                        </svg>
+                                                                        <div class="cmp-latestcards__cardcontainer">
+                                                                            <div class="row">
+                                                                                <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
+                                                                                    <div class="cmp-latestcard">
+
+                                                                                        <div class="field field--name-field-recent-post-paragraph field--type-entity-reference-revisions field--label-hidden field__items">
+                                                                                            <div class="field__item">
+                                                                                                <div class="paragraph paragraph--type--recent-posts-section paragraph--view-mode--default">
+
+                                                                                                    <div class="cmp-latestHeading">
+                                                                                                        <h6 class="heading-title">
+                                                                                                            <div class="field field--name-field-posts-headline field--type-string field--label-hidden field__item">
+                                                                                                                NEWS
+                                                                                                            </div>
+                                                                                                        </h6>
+                                                                                                        <button class="heading-link">
+                                                                                                            <a class="heading-link"
+                                                                                                                href="/taxonomy/term/771"
+                                                                                                                target="_self">
+                                                                                                                SEE ALL
+                                                                                                                NEWS</a>
+                                                                                                        </button>
+                                                                                                    </div>
+                                                                                                    <div class="cmp-latestcard-content">
+
+                                                                                                        <div class="field field--name-field-posts-blog-post field--type-entity-reference field--label-hidden field__item">
+                                                                                                            <article role="article" about="/node/3701" class="node node--type-blog-post node--promoted node--view-mode-recent-posts-block clearfix">
+                                                                                                                <div class="node__content clearfix">
+                                                                                                                    <div class="cmp-latestcard__image ">
+                                                                                                                        <div class="d-none d-md-block">
+                                                                                                                            <div class="cmp-imageblue bg-primary">
+
+                                                                                                                                <div class="field field--name-field-blog-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                                    <article class="media media--type-image media--view-mode-default">
+
+                                                                                                                                        <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                                            <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg" alt="servicecard" typeof="foaf:Image">
+
+                                                                                                                                        </div>
+
+                                                                                                                                    </article>
+                                                                                                                                </div>
+
+                                                                                                                            </div>
+                                                                                                                        </div>
+                                                                                                                    </div>
+                                                                                                                    <div class="cmp-latestcard__content">
+                                                                                                                        <h6 class="cmp-heading h6   ">
+
+                                                                                                                            <div class="field field--name-field-blog-headline field--type-string field--label-hidden field__item">
+                                                                                                                                FIVE WAYS TECHNOLOGY CAN HELP YOUR DEALERSHIP SERVICE
+                                                                                                                            </div>
+
+                                                                                                                        </h6>
+                                                                                                                        <span class="cmp-latestcard__more">
+                                                                                                                            <img src="/images/plus-orange.svg"
+                                                                                                                                alt="more">
+                                                                                                                        </span>
+                                                                                                                        <div class="cmp-text">
+
+                                                                                                                            <div class="clearfix text-formatted field field--name-field-blog-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                                                <p>At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales &amp; Business Development at ALLDATA...
+                                                                                                                                </p>
+                                                                                                                            </div>
+
+                                                                                                                        </div>
+                                                                                                                        <div class="cmp-cardlink">
+                                                                                                                            <div class="field field--name-field-blog-cta field--type-link field--label-hidden field__item">
+                                                                                                                                <a href="">LEARN
+                                                                                                                                    MORE</a>
+                                                                                                                            </div>
+                                                                                                                        </div>
+                                                                                                                    </div>
+                                                                                                                </div>
+                                                                                                            </article>
+                                                                                                        </div>
+
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                            </div>
+                                                                                            <div class="field__item">
+                                                                                                <div class="paragraph paragraph--type--recent-posts-section paragraph--view-mode--default">
+
+                                                                                                    <div class="cmp-latestHeading">
+                                                                                                        <h6 class="heading-title">
+                                                                                                            <div class="field field--name-field-posts-headline field--type-string field--label-hidden field__item">
+                                                                                                                Teach tips
+                                                                                                            </div>
+                                                                                                        </h6>
+                                                                                                        <button class="heading-link">
+                                                                                                            <a class="heading-link"
+                                                                                                                href="/taxonomy/term/776"
+                                                                                                                target="_self">
+                                                                                                                SEE ALL
+                                                                                                                TEACH
+                                                                                                                TIPS</a>
+                                                                                                        </button>
+                                                                                                    </div>
+                                                                                                    <div class="cmp-latestcard-content">
+
+                                                                                                        <div class="field field--name-field-posts-blog-post field--type-entity-reference field--label-hidden field__item">
+                                                                                                            <article role="article" about="/node/3706" class="node node--type-blog-post node--promoted node--view-mode-recent-posts-block clearfix">
+                                                                                                                <div class="node__content clearfix">
+                                                                                                                    <div class="cmp-latestcard__image ">
+                                                                                                                        <div class="d-none d-md-block">
+                                                                                                                            <div class="cmp-imageblue bg-primary">
+
+                                                                                                                                <div class="field field--name-field-blog-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                                    <article class="media media--type-image media--view-mode-default">
+
+                                                                                                                                        <div class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                                            <img class="cmp-image" src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg" alt="servicecard" typeof="foaf:Image">
+
+                                                                                                                                        </div>
+
+                                                                                                                                    </article>
+                                                                                                                                </div>
+
+                                                                                                                            </div>
+                                                                                                                        </div>
+                                                                                                                    </div>
+                                                                                                                    <div class="cmp-latestcard__content">
+                                                                                                                        <h6 class="cmp-heading h6   ">
+
+                                                                                                                            <div class="field field--name-field-blog-headline field--type-string field--label-hidden field__item">
+                                                                                                                                FIVE WAYS TECHNOLOGY CAN HELP YOUR DEALERSHIP SERVICE
+                                                                                                                            </div>
+
+                                                                                                                        </h6>
+                                                                                                                        <span class="cmp-latestcard__more">
+                                                                                                                            <img src="/images/plus-orange.svg"
+                                                                                                                                alt="more">
+                                                                                                                        </span>
+                                                                                                                        <div class="cmp-text">
+
+                                                                                                                            <div class="clearfix text-formatted field field--name-field-blog-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                                                <p>At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales &amp; Business Development at ALLDATA...
+                                                                                                                                </p>
+                                                                                                                            </div>
+
+                                                                                                                        </div>
+                                                                                                                        <div class="cmp-cardlink">
+                                                                                                                            <div class="field field--name-field-blog-cta field--type-link field--label-hidden field__item">
+                                                                                                                                <a href="">LEARN
+                                                                                                                                    MORE</a>
+                                                                                                                            </div>
+                                                                                                                        </div>
+                                                                                                                    </div>
+                                                                                                                </div>
+                                                                                                            </article>
+                                                                                                        </div>
+
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+
+                                                                                    </div>
+                                                                                </div>
+                                                                                <div class="more-news d-none d-md-block">
+                                                                                    <button class="cmp-button btn btn-outline-secondary">
+                                                                                        <div
+                                                                                            class="field field--name-field-posts-block-cta field--type-link field--label-hidden field__item">
+                                                                                            <a href="">see this month's
+                                                                                                issue of alldata
+                                                                                                news</a></div>
+                                                                                    </button>
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </section>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+
+                                    </div>
+                                </article>
+
+                            </div>
+                        </div>
+
+                    </div>
+
+                </section>
+            </main>
+        </div>
+    </div>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div id="page">
+    {# <header id="header" class="header" role="banner" aria-label="Site header">
+        <div class="section layout-container clearfix">
+            <div class="clearfix region region-header">
+                <div id="block-sitebanner-2" data-block-plugin-id="block_content:86c19f2b-dc50-4858-a9c2-44423ebe325e"
+                    class="block block-block-content block-block-content86c19f2b-dc50-4858-a9c2-44423ebe325e">
+
+
+                    <div class="content">
+
+                        <div
+                            class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item">
+                            <div class="banner font">
+                                <div class="banner-text">Try ALLDATA Collisiion FREE for 5 DAYS. Start your free trial!
+                                </div>
+                                <span>X</span>
+                            </div>
+                        </div>
+
+                    </div>
+                </div>
+
+            </div>
+
+            <div class="region region-secondary-menu">
+                <nav role="navigation" aria-labelledby="block-alldata-account-menu-menu" id="block-alldata-account-menu"
+                    class="upper-menu block block-menu navigation menu--account"
+                    data-block-plugin-id="system_menu_block:account">
+
+                    <h2 class="visually-hidden" id="block-alldata-account-menu-menu">User account menu</h2>
+
+
+                    <div class="content">
+                        <div class="menu-toggle-target menu-toggle-target-show" id="show-block-alldata-account-menu">
+                        </div>
+                        <div class="menu-toggle-target" id="hide-block-alldata-account-menu"></div>
+                        <a class="menu-toggle" href="#show-block-alldata-account-menu">Show — User account menu</a>
+                        <a class="menu-toggle menu-toggle--hide" href="#hide-block-alldata-account-menu">Hide — User
+                            account menu</a>
+
+                        <ul data-region="secondary_menu" class="clearfix menu">
+                            <li class="menu-item">
+                                <a href="tel:800-697-2533">800-697-2533</a>
+                            </li>
+                            <li class="menu-item">
+                                <a href="">CONTACT A REP</a>
+                            </li>
+                            <li class="menu-item">
+                                <a href="/user/login" data-drupal-link-system-path="user/login">Log in</a>
+                            </li>
+                        </ul>
+
+
+
+                    </div>
+                </nav>
+
+            </div>
+
+            <div class="region region-primary-menu main-menu font">
+                <div id="block-alldata-branding"
+                    class="logo clearfix site-branding block block-system block-system-branding-block"
+                    data-block-plugin-id="system_branding_block">
+
+
+                    <a href="/" title="Home" rel="home" class="site-branding__logo">
+                        <img src="http://alldatadev.prod.acquia-sites.com/themes/custom/alldata/alldatalogo.png" alt="Home">
+                    </a>
+                    <hr class="sublogo">
+                </div>
+                <nav role="navigation" aria-labelledby="block-alldata-main-menu-menu" id="block-alldata-main-menu"
+                    data-block-plugin-id="system_menu_block:main" class="block block-menu navigation menu--main">
+
+                    <h2 class="visually-hidden" id="block-alldata-main-menu-menu">Main navigation</h2>
+
+
+                    <div class="content main-menu-content">
+                        <div class="menu-toggle-target menu-toggle-target-show" id="show-block-alldata-main-menu"></div>
+                        <div class="menu-toggle-target" id="hide-block-alldata-main-menu"></div>
+                        <a class="menu-toggle" href="#show-block-alldata-main-menu">Show — Main navigation</a>
+                        <a class="menu-toggle menu-toggle--hide" href="#hide-block-alldata-main-menu">Hide — Main
+                            navigation</a>
+
+
+                        <ul class="menu h-100 menu-level-0">
+
+                            <li class="menu-item h-100">
+                                <a href="" class="menulink">Products</a>
+
+
+                                <div
+                                    class="menu_link_content menu-link-contentmain view-mode-default menu-dropdown menu-dropdown-0 menu-type-default">
+                                    <div class="layout layout--fourcol-section collapsed-menu font">
+
+                                        <div class="layout__region layout__region--first collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Repair Information&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Repair Information</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Repair Information</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide — Repair
+                                                        Information</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Repair</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Collision</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Estimate Integration</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Mobile</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Community</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--second collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Diagnostics&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Diagnostics</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Diagnostics</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        Diagnostics</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Diagnostics</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Tech-Assist</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--third collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Shop Management&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Shop Management</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Shop Management</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide — Shop
+                                                        Management</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Manage Online</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Titan</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--fourth collapsed-content">
+
+                                            <div data-layout-content-preview-placeholder-label="&quot;Paragraph item 0&quot; block"
+                                                data-block-plugin-id="paragraph_field:menu_link_content:field_menu_link_and_image:0:main"
+                                                class="block block-paragraph-blocks block-paragraph-fieldmenu-link-contentfield-menu-link-and-image0main">
+
+
+                                                <div class="content">
+                                                    <div
+                                                        class="paragraph paragraph--type--header-menu-image-component paragraph--view-mode--default content-imag">
+                                                        <div>
+
+                                                            <img class="cmp-image"
+                                                                src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2019-12/alldata.png"
+                                                                width="574" height="428" alt="" typeof="foaf:Image">
+
+
+
+                                                            <p><a href="">What's right for my shop?</a></p>
+
+                                                        </div>
+                                                    </div>
+
+                                                </div>
+                                            </div>
+                                            <div data-layout-content-preview-placeholder-label="&quot;Paragraph item 1&quot; block"
+                                                data-block-plugin-id="paragraph_field:menu_link_content:field_menu_link_and_image:1:main"
+                                                class="block block-paragraph-blocks block-paragraph-fieldmenu-link-contentfield-menu-link-and-image1main">
+
+
+                                                <div class="content">
+                                                    <div
+                                                        class="paragraph paragraph--type--header-menu-image-component paragraph--view-mode--default content-imag">
+                                                        <div>
+
+                                                            <img class="cmp-image"
+                                                                src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2019-12/alldata.png"
+                                                                width="574" height="428" alt="" typeof="foaf:Image">
+
+
+
+                                                            <p><a href="">Testimonials</a></p>
+
+                                                        </div>
+                                                    </div>
+
+                                                </div>
+                                            </div>
+
+                                        </div>
+
+                                    </div>
+                                    <div class="layout layout--onecol">
+                                        <div>
+
+                                        </div>
+                                    </div>
+
+                                </div>
+
+
+
+                            </li>
+
+                            <li class="menu-item h-100">
+                                <a href="" class="menulink">Support</a>
+
+
+                                <div
+                                    class="menu_link_content menu-link-contentmain view-mode-default menu-dropdown menu-dropdown-0 menu-type-default">
+                                    <div class="layout layout--fourcol-section collapsed-menu font">
+
+                                        <div class="layout__region layout__region--first collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Popular Topics&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Popular Topics</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Popular Topics</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        Popular Topics</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">Getting Started</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Recover User Name or Password</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Vehicle Information Request</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Login Center</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--second collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Product Support&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Product Support</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Product Support</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        Product Support</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Repair</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Mobile</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Diagnostics</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Tech-Assist</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Manage Online</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Shop Management</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--third collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Account Billing &amp; Support&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Account Billing &amp; Support</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Account Billing &amp;
+                                                        Support</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        Account Billing &amp; Support</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">Billing Options</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Account Options</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Training and Certifications&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Training and Certifications</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Training and
+                                                        Certifications</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        Training and Certifications</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">Product Training</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Training Videos</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">On-demand Webinars</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">CAIS Certification Program</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--fourth collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Contact Customer Support&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Contact Customer Support</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Contact Customer
+                                                        Support</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        Contact Customer Support</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="tel:800-859-3282">800-859-3282</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                    </div>
+                                    <div class="layout layout--onecol">
+                                        <div>
+
+                                        </div>
+                                    </div>
+
+                                </div>
+
+
+
+                            </li>
+
+                            <li class="menu-item h-100">
+                                <a href="" class="menulink">Resources</a>
+
+
+                                <div
+                                    class="menu_link_content menu-link-contentmain view-mode-default menu-dropdown menu-dropdown-0 menu-type-default">
+                                    <div class="layout layout--fourcol-section collapsed-menu font">
+
+                                        <div class="layout__region layout__region--first collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Product Resources&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Product Resources</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Product Resources</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        Product Resources</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Repair</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Collision</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Mobile</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Diagnostics</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Tech-Assist</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Manage Online</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Shop Manager</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--second collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;ALLDATA News By Topic&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">ALLDATA News By Topic</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — ALLDATA News By
+                                                        Topic</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        ALLDATA News By Topic</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">General Auto Repair</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Collision Auto Repair</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Shop Management</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Best Practices</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Training</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">News</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Events</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--third collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;ALLDATA News&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">ALLDATA News</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — ALLDATA News</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        ALLDATA News</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">Latest Edition</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Tech Tips&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Tech Tips</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Tech Tips</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide — Tech
+                                                        Tips</a>
+
+                                                </div>
+                                            </nav>
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Industry Webinars&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="submenu-title" id="-menu">Industry Webinars</h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Industry Webinars</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide —
+                                                        Industry Webinars</a>
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+
+                                    </div>
+                                    <div class="layout layout--onecol">
+                                        <div>
+
+                                        </div>
+                                    </div>
+
+                                </div>
+
+
+
+                            </li>
+
+                            <li class="menu-item h-100">
+                                <a href="" class="menulink">About Us</a>
+
+
+                                <div
+                                    class="menu_link_content menu-link-contentmain view-mode-default menu-dropdown menu-dropdown-0 menu-type-default">
+                                    <div class="layout layout--fourcol-section collapsed-menu font">
+
+                                        <div class="layout__region layout__region--first collapsed-content">
+
+                                            <div data-layout-content-preview-placeholder-label="&quot;Paragraph item 0&quot; block"
+                                                data-block-plugin-id="paragraph_field:menu_link_content:field_menu_link_and_image:0:main"
+                                                class="block block-paragraph-blocks block-paragraph-fieldmenu-link-contentfield-menu-link-and-image0main">
+
+
+                                                <div class="content">
+                                                    <div
+                                                        class="paragraph paragraph--type--header-menu-image-component paragraph--view-mode--default content-imag">
+                                                        <div>
+
+                                                            <img class="cmp-image"
+                                                                src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2019-12/alldata.png"
+                                                                width="574" height="428" alt="" typeof="foaf:Image">
+
+
+
+                                                        </div>
+                                                    </div>
+
+                                                </div>
+                                            </div>
+
+                                        </div>
+
+                                        <div class="layout__region layout__region--second collapsed-content">
+
+                                            <nav role="navigation" aria-labelledby="-menu"
+                                                data-layout-content-preview-placeholder-label="&quot;Header Flyout Menu&quot; block"
+                                                data-block-plugin-id="menu_block:header-flyout-menu"
+                                                class="block block-menu navigation menu--header-flyout-menu">
+
+                                                <h4 class="visually-hidden submenu-title" id="-menu">Header Flyout Menu
+                                                </h4>
+
+
+                                                <div class="content">
+                                                    <div class="menu-toggle-target menu-toggle-target-show" id="show-">
+                                                    </div>
+                                                    <div class="menu-toggle-target" id="hide-"></div>
+                                                    <a class="menu-toggle" href="#show-">Show — Header Flyout Menu</a>
+                                                    <a class="menu-toggle menu-toggle--hide" href="#hide-">Hide — Header
+                                                        Flyout Menu</a>
+
+                                                    <ul class="clearfix menu">
+                                                        <li class="menu-item">
+                                                            <a href="">ALLDATA Leadership</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Partners</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Press</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Careers</a>
+                                                        </li>
+                                                        <li class="menu-item">
+                                                            <a href="">Contact</a>
+                                                        </li>
+                                                    </ul>
+
+
+
+                                                </div>
+                                            </nav>
+
+                                        </div>
+
+
+
+                                    </div>
+                                    <div class="layout layout--onecol">
+                                        <div>
+
+                                        </div>
+                                    </div>
+
+                                </div>
+
+
+
+                            </li>
+
+                            <li class="menu-item h-100">
+                                <a href="" class="menulink">Buy Now</a>
+
+
+                                <div
+                                    class="menu_link_content menu-link-contentmain view-mode-default menu-dropdown menu-dropdown-0 menu-type-default">
+                                    <div class="layout layout--onecol">
+                                        <div>
+
+                                        </div>
+                                    </div>
+
+                                </div>
+
+
+
+                            </li>
+                        </ul>
+
+
+                    </div>
+                </nav>
+                <div id="block-alldata-mainnavigation" data-block-plugin-id="we_megamenu_block:main"
+                    class="block block-we-megamenu block-we-megamenu-blockmain">
+
+
+                    <div class="content">
+
+
+                        <ul class="menu h-100 menu-level-">
+                        </ul>
+
+
+                    </div>
+                </div>
+
+            </div>
+
+        </div>
+    </header> #}
+    <div class="highlighted">
+        <aside class="layout-container section clearfix" role="complementary">
+            <div class="region region-highlighted">
+                <div data-drupal-messages-fallback="" class="hidden"></div>
+
+            </div>
+
+        </aside>
+    </div>
+    <div id="main-wrapper" class="layout-main-wrapper layout-container clearfix">
+        <div id="main" class="layout-main clearfix">
+
+            <main id="content" class="column main-content" role="main">
+                <section class="section">
+                    <a id="main-content" tabindex="-1"></a>
+                    <div class="region region-content">
+                        <div id="block-alldata-block"
+                            data-block-plugin-id="block_content:58ad31b5-cc64-4861-979a-11ae1a0f4ce4"
+                            class="block block-block-content block-block-content58ad31b5-cc64-4861-979a-11ae1a0f4ce4">
+
+
+                            <div class="content">
+
+                                <div
+                                    class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item">
+                                    <div id="google_translate_element">
+                                        <div class="skiptranslate goog-te-gadget" dir="ltr" style="">
+                                            <div id=":0.targetLanguage" class="goog-te-gadget-simple"
+                                                style="white-space: nowrap;"><img
+                                                    src="https://www.google.com/images/cleardot.gif"
+                                                    class="goog-te-gadget-icon" alt=""
+                                                    style="background-image: url(&quot;https://translate.googleapis.com/translate_static/img/te_ctrl3.gif&quot;); background-position: -65px 0px;"><span
+                                                    style="vertical-align: middle;"><a aria-haspopup="true"
+                                                        class="goog-te-menu-value"
+                                                        href="javascript:void(0)"><span>Select Language</span><img
+                                                            src="https://www.google.com/images/cleardot.gif" alt=""
+                                                            width="1" height="1"><span
+                                                            style="border-left: 1px solid rgb(187, 187, 187);">​</span><img
+                                                            src="https://www.google.com/images/cleardot.gif" alt=""
+                                                            width="1" height="1"><span aria-hidden="true"
+                                                            style="color: rgb(118, 118, 118);">▼</span></a></span></div>
+                                        </div>
+                                    </div>
+                                   
+                                </div>
+
+                            </div>
+                        </div>
+                        <div id="block-alldata-content" data-block-plugin-id="system_main_block"
+                            class="block block-system block-system-main-block">
+
+
+                            <div class="content">
+
+                                <article role="article" about="/home"
+                                    class="node node--type-alldata-landing-page node--promoted node--view-mode-full clearfix">
+                                    <header>
+
+
+                                    </header>
+                                    <div class="node__content clearfix">
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;Links&quot; field"
+                                                    data-block-plugin-id="extra_field_block:node:alldata_landing_page:links"
+                                                    class="block block-layout-builder block-extra-field-blocknodealldata-landing-pagelinks">
+
+
+                                                    <div class="content">
+
+                                                    </div>
+                                                </div>
+                                                <div data-layout-content-preview-placeholder-label="&quot;Hero slider&quot; block"
+                                                    data-block-plugin-id="block_content:3de97c39-092c-4949-a32a-07d55fde05a3"
+                                                    class="block block-block-content block-block-content3de97c39-092c-4949-a32a-07d55fde05a3">
+
+
+                                                    <div class="content">
+                                                        <section class="columns is-centered position-relative">
+                                                            <div class="cmp-hero">
+                                                                <div class="cmp-cols row  cols-1  cols-md-2">
+                                                                    <div id="carouselHeroSlider"
+                                                                        class="cmp-slider carousel slide   same-height  "
+                                                                        data-ride="carousel" data-interval="false">
+                                                                        <div class="cmp-slider-controls d-flex">
+                                                                            <a class="cmp-slider-prev"
+                                                                                href="#carouselHeroSlider" role="button"
+                                                                                data-slide="prev">
+                                                                                <svg xmlns="http://www.w3.org/2000/svg"
+                                                                                    aria-hidden="true" width="9"
+                                                                                    height="15" viewBox="0 0 9 15">
+                                                                                    <path fill-rule="evenodd"
+                                                                                        d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z">
+                                                                                    </path>
+                                                                                </svg>
+                                                                                <span class="sr-only">Previous</span>
+                                                                            </a>
+                                                                            <ol class="carousel-indicators">
+                                                                                <li data-target="#carouselHeroSlider"
+                                                                                    data-slide-to="0" class="active">
+                                                                                </li>
+                                                                                <li data-target="#carouselHeroSlider"
+                                                                                    data-slide-to="1" class=""></li>
+                                                                            </ol>
+                                                                            <a class="cmp-slider-next"
+                                                                                href="#carouselHeroSlider" role="button"
+                                                                                data-slide="next">
+                                                                                <svg xmlns="http://www.w3.org/2000/svg"
+                                                                                    aria-hidden="true" width="9"
+                                                                                    height="15" viewBox="0 0 9 15">
+                                                                                    <path fill-rule="evenodd"
+                                                                                        d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z">
+                                                                                    </path>
+                                                                                </svg>
+                                                                                <span class="sr-only">Next</span>
+                                                                            </a>
+                                                                        </div>
+                                                                        <div class="carousel-inner  left ">
+                                                                            <div class="carousel-item  active "
+                                                                                style="min-height: 347.4px;">
+                                                                                <div
+                                                                                    class="paragraph paragraph--type--slider-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-jumbo ">
+                                                                                        <h1
+                                                                                            class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-headline field--type-string field--label-hidden field__item">
+                                                                                                KYAUTOMOTIVE
+                                                                                                INTELLIGENCE</div>
+
+                                                                                        </h1>
+                                                                                        <svg class="cmp-threelines"
+                                                                                            xmlns="http://www.w3.org/2000/svg"
+                                                                                            width="61" height="17"
+                                                                                            viewBox="0 0 61 17">
+                                                                                            <g fill="#F16824"
+                                                                                                fill-rule="evenodd">
+                                                                                                <path
+                                                                                                    d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                                                </path>
+                                                                                            </g>
+                                                                                        </svg>
+                                                                                        <div class="cmp-text">
+
+                                                                                            <div
+                                                                                                class="clearfix text-formatted field field--name-field-slider-body field--type-text-long field--label-hidden field__item">
+                                                                                                <p>From providing shop
+                                                                                                    management software
+                                                                                                    to customer
+                                                                                                    communication tools,
+                                                                                                    we've been the
+                                                                                                    industry leader of
+                                                                                                    OEM auto repair
+                                                                                                    software since 1986.
+                                                                                                </p>
+                                                                                            </div>
+
+                                                                                        </div>
+                                                                                        <button
+                                                                                            class="cmp-button btn btn-outline-secondary">
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-cta field--type-link field--label-hidden field__item">
+                                                                                                <a href="">shop
+                                                                                                    products</a></div>
+                                                                                        </button>
+                                                                                    </div>
+
+                                                                                </div>
+
+                                                                            </div>
+                                                                            <div class="carousel-item   "
+                                                                                style="min-height: 347.4px;">
+                                                                                <div
+                                                                                    class="paragraph paragraph--type--slider-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-jumbo ">
+                                                                                        <h1
+                                                                                            class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-headline field--type-string field--label-hidden field__item">
+                                                                                                TESTING CAROUSEL</div>
+
+                                                                                        </h1>
+                                                                                        <svg class="cmp-threelines"
+                                                                                            xmlns="http://www.w3.org/2000/svg"
+                                                                                            width="61" height="17"
+                                                                                            viewBox="0 0 61 17">
+                                                                                            <g fill="#F16824"
+                                                                                                fill-rule="evenodd">
+                                                                                                <path
+                                                                                                    d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                                                </path>
+                                                                                            </g>
+                                                                                        </svg>
+                                                                                        <div class="cmp-text">
+
+                                                                                            <div
+                                                                                                class="clearfix text-formatted field field--name-field-slider-body field--type-text-long field--label-hidden field__item">
+                                                                                                <p>slider 2 - From
+                                                                                                    providing shop
+                                                                                                    management software
+                                                                                                    to customer
+                                                                                                    communication tools,
+                                                                                                    we've been the
+                                                                                                    industry leader of
+                                                                                                    OEM auto repair
+                                                                                                    software since 1986.
+                                                                                                </p>
+                                                                                            </div>
+
+                                                                                        </div>
+                                                                                        <button
+                                                                                            class="cmp-button btn btn-outline-secondary">
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-cta field--type-link field--label-hidden field__item">
+                                                                                                <a
+                                                                                                    href="http://www.google.com">shop
+                                                                                                    products</a></div>
+                                                                                        </button>
+                                                                                    </div>
+
+                                                                                </div>
+
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </section>
+
+
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;WHY ALLDATA&quot; block"
+                                                    data-block-plugin-id="block_content:235385cd-e571-4c08-9933-b62475485588"
+                                                    class="block block-block-content block-block-content235385cd-e571-4c08-9933-b62475485588">
+
+
+                                                    <div class="content">
+                                                        <section class="columns is-centered bg-primary">
+                                                            <div class="inner-section ">
+                                                                <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+                                                                    <div class="cmp-jumbo  cmp-jumbo__simple ">
+                                                                        <h2 class="cmp-heading h2 cmp-jumbo__heading">
+
+                                                                            <div
+                                                                                class="field field--name-field-brand-block-headline field--type-string field--label-hidden field__item">
+                                                                                WHY ALLDATA</div>
+
+                                                                        </h2>
+
+                                                                        <div
+                                                                            class="clearfix text-formatted field field--name-field-brand-block-body field--type-text-long field--label-hidden field__item">
+                                                                            <p>ALLDATA is the industry’s #1 choice for
+                                                                                OEM-accurate mechanical and collision
+                                                                                repair information, shop management
+                                                                                software, and support services, trusted
+                                                                                by more than 400,000 technicians in over
+                                                                                115,000 shops worldwide.</p>
+                                                                        </div>
+
+                                                                    </div>
+                                                                    <div class="cmp-cols row  cols-1   cols-lg-3">
+
+                                                                        <div
+                                                                            class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+                                                                            <div class="field__item">
+                                                                                <div
+                                                                                    class="paragraph paragraph--type--branding-section paragraph--view-mode--default">
+                                                                                    <div
+                                                                                        class="cmp-brandingcard text-center py-4 py-lg-4 px-lg-4">
+
+                                                                                        <div
+                                                                                            class="field field--name-field-brand-icon field--type-entity-reference field--label-hidden field__item">
+                                                                                            <article
+                                                                                                class="media media--type-image media--view-mode-default">
+
+
+                                                                                                <div
+                                                                                                    class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                    <img class="cmp-image"
+                                                                                                        src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/fill-4%403x.png"
+                                                                                                        {# width="222"
+                                                                                                        height="216" #}
+                                                                                                        alt="REPAIR INFORMATION"
+                                                                                                        typeof="foaf:Image">
+
+                                                                                                </div>
+
+                                                                                            </article>
+                                                                                        </div>
+
+                                                                                        <h3 class="cmp-heading h3">
+
+                                                                                            <div
+                                                                                                class="field field--name-field-brand-headline field--type-string field--label-hidden field__item">
+                                                                                                REPAIR INFORMATION</div>
+
+                                                                                        </h3>
+
+                                                                                        <div
+                                                                                            class="clearfix text-formatted field field--name-field-brand-body field--type-text-long field--label-hidden field__item">
+                                                                                            <p>Lorem ipsum dolor sit
+                                                                                                amet, consectetur
+                                                                                                adipiscing elit.
+                                                                                                Curabitur accumsan
+                                                                                                sapien a orci pharetra
+                                                                                                pretium.</p>
+                                                                                        </div>
+
+
+                                                                                        <hr
+                                                                                            class="cmp-brandingcard__line">
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                            <div class="field__item">
+                                                                                <div
+                                                                                    class="paragraph paragraph--type--branding-section paragraph--view-mode--default">
+                                                                                    <div
+                                                                                        class="cmp-brandingcard text-center py-4 py-lg-4 px-lg-4">
+
+                                                                                        <div
+                                                                                            class="field field--name-field-brand-icon field--type-entity-reference field--label-hidden field__item">
+                                                                                            <article
+                                                                                                class="media media--type-image media--view-mode-default">
+
+
+                                                                                                <div
+                                                                                                    class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                    <img class="cmp-image"
+                                                                                                        src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/fill-4%403x.png"
+                                                                                                        {# width="222"
+                                                                                                        height="216" #}
+                                                                                                        alt="REPAIR INFORMATION"
+                                                                                                        typeof="foaf:Image">
+
+                                                                                                </div>
+
+                                                                                            </article>
+                                                                                        </div>
+
+                                                                                        <h3 class="cmp-heading h3">
+
+                                                                                            <div
+                                                                                                class="field field--name-field-brand-headline field--type-string field--label-hidden field__item">
+                                                                                                DIAGNOSTICS</div>
+
+                                                                                        </h3>
+
+                                                                                        <div
+                                                                                            class="clearfix text-formatted field field--name-field-brand-body field--type-text-long field--label-hidden field__item">
+                                                                                            <p>Lorem ipsum dolor sit
+                                                                                                amet, consectetur
+                                                                                                adipiscing elit.
+                                                                                                Curabitur accumsan
+                                                                                                sapien a orci pharetra
+                                                                                                pretium.</p>
+                                                                                        </div>
+
+
+                                                                                        <hr
+                                                                                            class="cmp-brandingcard__line">
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                            <div class="field__item">
+                                                                                <div
+                                                                                    class="paragraph paragraph--type--branding-section paragraph--view-mode--default">
+                                                                                    <div
+                                                                                        class="cmp-brandingcard text-center py-4 py-lg-4 px-lg-4">
+
+                                                                                        <div
+                                                                                            class="field field--name-field-brand-icon field--type-entity-reference field--label-hidden field__item">
+                                                                                            <article
+                                                                                                class="media media--type-image media--view-mode-default">
+
+
+                                                                                                <div
+                                                                                                    class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                    <img class="cmp-image"
+                                                                                                        src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/fill-4%403x.png"
+                                                                                                        {# width="222"
+                                                                                                        height="216" #}
+                                                                                                        alt="REPAIR INFORMATION"
+                                                                                                        typeof="foaf:Image">
+
+                                                                                                </div>
+
+                                                                                            </article>
+                                                                                        </div>
+
+                                                                                        <h3 class="cmp-heading h3">
+
+                                                                                            <div
+                                                                                                class="field field--name-field-brand-headline field--type-string field--label-hidden field__item">
+                                                                                                SHOP MANAGEMENT</div>
+
+                                                                                        </h3>
+
+                                                                                        <div
+                                                                                            class="clearfix text-formatted field field--name-field-brand-body field--type-text-long field--label-hidden field__item">
+                                                                                            <p>Lorem ipsum dolor sit
+                                                                                                amet, consectetur
+                                                                                                adipiscing elit.
+                                                                                                Curabitur accumsan
+                                                                                                sapien a orci pharetra
+                                                                                                pretium.</p>
+                                                                                        </div>
+
+
+                                                                                        <hr
+                                                                                            class="cmp-brandingcard__line">
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+
+                                                                    </div>
+                                                                </div>
+
+                                                            </div>
+                                                        </section>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;Who We Serve&quot; block"
+                                                    data-block-plugin-id="block_content:74749b5a-76b9-4341-97a0-c4f77f29b4d4"
+                                                    class="block block-block-content block-block-content74749b5a-76b9-4341-97a0-c4f77f29b4d4">
+
+
+                                                    <div class="content">
+                                                        <section class="columns is-centered">
+                                                            <div class="cmp-servicescards">
+                                                                <div
+                                                                    class="cmp-jumbo  cmp-jumbo__No Button and no simple text ">
+                                                                    <h2
+                                                                        class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+
+                                                                        <div
+                                                                            class="field field--name-field-card-sec-headline field--type-string field--label-hidden field__item">
+                                                                            Who We Serve</div>
+
+                                                                    </h2>
+                                                                    <svg class="cmp-threelines"
+                                                                        xmlns="http://www.w3.org/2000/svg" width="61"
+                                                                        height="17" viewBox="0 0 61 17">
+                                                                        <g fill="#F16824" fill-rule="evenodd">
+                                                                            <path
+                                                                                d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                            </path>
+                                                                        </g>
+                                                                    </svg>
+                                                                </div>
+                                                                <div
+                                                                    class="cmp-servicescards__cardcontainer mx-sm-auto">
+
+                                                                    <div
+                                                                        class="field field--name-field-cards field--type-entity-reference field--label-hidden field__items">
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3661"
+                                                                                class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation"
+                                                                                        class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div
+                                                                                            class="cmp-servcard__image">
+                                                                                            <div
+                                                                                                class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article
+                                                                                                            class="media media--type-image media--view-mode-default">
+
+
+                                                                                                            <div
+                                                                                                                class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image"
+                                                                                                                    src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg"
+                                                                                                                    {# width="588"
+                                                                                                                    height="392" #}
+                                                                                                                    alt="servicecard"
+                                                                                                                    typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile"
+                                                                                                    style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div
+                                                                                            class="cmp-servcard__content">
+                                                                                            <h6
+                                                                                                class="cmp-heading h6   ">
+
+                                                                                                <div
+                                                                                                    class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    Independent
+                                                                                                    collision shops
+                                                                                                </div>
+
+                                                                                            </h6>
+                                                                                            <button
+                                                                                                class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block"
+                                                                                                aria-hidden="true"
+                                                                                                aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div
+                                                                                                        class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision
+                                                                                                            Advantage
+                                                                                                            integrates
+                                                                                                            with the
+                                                                                                            three major
+                                                                                                            estimating
+                                                                                                            systems,
+                                                                                                            analyzing
+                                                                                                            your
+                                                                                                            estimate in
+                                                                                                            seconds and
+                                                                                                            displaying
+                                                                                                            on a single
+                                                                                                            screen.</p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div
+                                                                                                    class="cmp-cardlink">
+
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3666"
+                                                                                class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation"
+                                                                                        class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div
+                                                                                            class="cmp-servcard__image">
+                                                                                            <div
+                                                                                                class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article
+                                                                                                            class="media media--type-image media--view-mode-default">
+
+
+                                                                                                            <div
+                                                                                                                class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image"
+                                                                                                                    src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg"
+                                                                                                                    {# width="588"
+                                                                                                                    height="392" #}
+                                                                                                                    alt="servicecard"
+                                                                                                                    typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile"
+                                                                                                    style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div
+                                                                                            class="cmp-servcard__content">
+                                                                                            <h6
+                                                                                                class="cmp-heading h6   ">
+
+                                                                                                <div
+                                                                                                    class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    INDEPENDENT REPAIR
+                                                                                                    SHOPS</div>
+
+                                                                                            </h6>
+                                                                                            <button
+                                                                                                class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block"
+                                                                                                aria-hidden="true"
+                                                                                                aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div
+                                                                                                        class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision
+                                                                                                            Advantage
+                                                                                                            integrates
+                                                                                                            with the
+                                                                                                            three major
+                                                                                                            estimating
+                                                                                                            systems,
+                                                                                                            analyzing
+                                                                                                            your
+                                                                                                            estimate in
+                                                                                                            seconds and
+                                                                                                            displaying
+                                                                                                            on a single
+                                                                                                            screen.</p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div
+                                                                                                    class="cmp-cardlink">
+
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3671"
+                                                                                class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation"
+                                                                                        class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div
+                                                                                            class="cmp-servcard__image">
+                                                                                            <div
+                                                                                                class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article
+                                                                                                            class="media media--type-image media--view-mode-default">
+
+
+                                                                                                            <div
+                                                                                                                class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image"
+                                                                                                                    src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg"
+                                                                                                                    {# width="588"
+                                                                                                                    height="392" #}
+                                                                                                                    alt="servicecard"
+                                                                                                                    typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile"
+                                                                                                    style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div
+                                                                                            class="cmp-servcard__content">
+                                                                                            <h6
+                                                                                                class="cmp-heading h6   ">
+
+                                                                                                <div
+                                                                                                    class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    MUTLI-SHOP</div>
+
+                                                                                            </h6>
+                                                                                            <button
+                                                                                                class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block"
+                                                                                                aria-hidden="true"
+                                                                                                aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div
+                                                                                                        class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision
+                                                                                                            Advantage
+                                                                                                            integrates
+                                                                                                            with the
+                                                                                                            three major
+                                                                                                            estimating
+                                                                                                            systems,
+                                                                                                            analyzing
+                                                                                                            your
+                                                                                                            estimate in
+                                                                                                            seconds and
+                                                                                                            displaying
+                                                                                                            on a single
+                                                                                                            screen.</p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div
+                                                                                                    class="cmp-cardlink">
+
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3676"
+                                                                                class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation"
+                                                                                        class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div
+                                                                                            class="cmp-servcard__image">
+                                                                                            <div
+                                                                                                class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article
+                                                                                                            class="media media--type-image media--view-mode-default">
+
+
+                                                                                                            <div
+                                                                                                                class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image"
+                                                                                                                    src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg"
+                                                                                                                    {# width="588"
+                                                                                                                    height="392" #}
+                                                                                                                    alt="servicecard"
+                                                                                                                    typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile"
+                                                                                                    style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div
+                                                                                            class="cmp-servcard__content">
+                                                                                            <h6
+                                                                                                class="cmp-heading h6   ">
+
+                                                                                                <div
+                                                                                                    class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    GOVERNMENT /
+                                                                                                    EDUCATION</div>
+
+                                                                                            </h6>
+                                                                                            <button
+                                                                                                class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block"
+                                                                                                aria-hidden="true"
+                                                                                                aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div
+                                                                                                        class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision
+                                                                                                            Advantage
+                                                                                                            integrates
+                                                                                                            with the
+                                                                                                            three major
+                                                                                                            estimating
+                                                                                                            systems,
+                                                                                                            analyzing
+                                                                                                            your
+                                                                                                            estimate in
+                                                                                                            seconds and
+                                                                                                            displaying
+                                                                                                            on a single
+                                                                                                            screen.</p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div
+                                                                                                    class="cmp-cardlink">
+
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3681"
+                                                                                class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation"
+                                                                                        class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div
+                                                                                            class="cmp-servcard__image">
+                                                                                            <div
+                                                                                                class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article
+                                                                                                            class="media media--type-image media--view-mode-default">
+
+
+                                                                                                            <div
+                                                                                                                class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image"
+                                                                                                                    src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg"
+                                                                                                                    {# width="588"
+                                                                                                                    height="392" #}
+                                                                                                                    alt="servicecard"
+                                                                                                                    typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile"
+                                                                                                    style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div
+                                                                                            class="cmp-servcard__content">
+                                                                                            <h6
+                                                                                                class="cmp-heading h6   ">
+
+                                                                                                <div
+                                                                                                    class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    Dealerships</div>
+
+                                                                                            </h6>
+                                                                                            <button
+                                                                                                class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block"
+                                                                                                aria-hidden="true"
+                                                                                                aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div
+                                                                                                        class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision
+                                                                                                            Advantage
+                                                                                                            integrates
+                                                                                                            with the
+                                                                                                            three major
+                                                                                                            estimating
+                                                                                                            systems,
+                                                                                                            analyzing
+                                                                                                            your
+                                                                                                            estimate in
+                                                                                                            seconds and
+                                                                                                            displaying
+                                                                                                            on a single
+                                                                                                            screen.</p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div
+                                                                                                    class="cmp-cardlink">
+
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Learn
+                                                                                                            More</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                        <div class="field__item">
+                                                                            <article role="article" about="/node/3686"
+                                                                                class="node node--type-persona node--promoted node--view-mode-persona-content-block clearfix">
+                                                                                <div class="node__content clearfix">
+                                                                                    <div role="presentation"
+                                                                                        class="cmp-servcard mobile-overflow mb-lg-5 mb-md-3 mb-sm-3 mb-3">
+                                                                                        <div
+                                                                                            class="cmp-servcard__image">
+                                                                                            <div
+                                                                                                class="cmp-imageblue bg-primary">
+                                                                                                <div class="desktop">
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                        <article
+                                                                                                            class="media media--type-image media--view-mode-default">
+
+
+                                                                                                            <div
+                                                                                                                class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                <img class="cmp-image"
+                                                                                                                    src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg"
+                                                                                                                    {# width="588"
+                                                                                                                    height="392" #}
+                                                                                                                    alt="servicecard"
+                                                                                                                    typeof="foaf:Image">
+
+                                                                                                            </div>
+
+                                                                                                        </article>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                                <div class="mobile"
+                                                                                                    style="display:none;">
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                        <div
+                                                                                            class="cmp-servcard__content">
+                                                                                            <h6
+                                                                                                class="cmp-heading h6   ">
+
+                                                                                                <div
+                                                                                                    class="field field--name-field-persona-headline field--type-string field--label-hidden field__item">
+                                                                                                    Single Vechicle
+                                                                                                    Subscriber</div>
+
+                                                                                            </h6>
+                                                                                            <button
+                                                                                                class="cmp-servcard__more"><img
+                                                                                                    src="/images/plus-orange.svg"
+                                                                                                    alt="more"></button>
+                                                                                            <div class="cmp-servcard__description  d-none d-lg-block"
+                                                                                                aria-hidden="true"
+                                                                                                aria-expanded="false">
+                                                                                                <div class="cmp-text">
+
+                                                                                                    <div
+                                                                                                        class="clearfix text-formatted field field--name-field-persona-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                        <p>Our Collision
+                                                                                                            Advantage
+                                                                                                            integrates
+                                                                                                            with the
+                                                                                                            three major
+                                                                                                            estimating
+                                                                                                            systems,
+                                                                                                            analyzing
+                                                                                                            your
+                                                                                                            estimate in
+                                                                                                            seconds and
+                                                                                                            displaying
+                                                                                                            on a single
+                                                                                                            screen.</p>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                                <div
+                                                                                                    class="cmp-cardlink">
+
+                                                                                                    <div
+                                                                                                        class="field field--name-field-persona-cta field--type-link field--label-hidden field__item">
+                                                                                                        <a href="">Go To
+                                                                                                            DIY Site</a>
+                                                                                                    </div>
+
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+                                                                                    </div>
+
+                                                                                </div>
+                                                                            </article>
+
+                                                                        </div>
+                                                                    </div>
+
+                                                                </div>
+                                                            </div>
+                                                        </section>
+
+                                                    </div>
+                                                </div>
+                                                <div data-layout-content-preview-placeholder-label="&quot;What we do&quot; block"
+                                                    data-block-plugin-id="block_content:8c71e36f-4184-4df5-b87d-e1529c3a2969"
+                                                    class="block block-block-content block-block-content8c71e36f-4184-4df5-b87d-e1529c3a2969">
+
+
+                                                    <div class="content">
+                                                        <section class="columns is-centered position-relative">
+                                                            <div class="cmp-hero">
+                                                                <div class="cmp-cols row  cols-1  cols-md-2">
+                                                                    <div id="carouselHeroSlider"
+                                                                        class="cmp-slider carousel slide   same-height  "
+                                                                        data-ride="carousel" data-interval="false">
+                                                                        <div class="carousel-inner single-slide right ">
+                                                                            <div class="carousel-item  active "
+                                                                                style="min-height: 269.8px;">
+                                                                                <div
+                                                                                    class="paragraph paragraph--type--slider-section paragraph--view-mode--default">
+                                                                                    <div class="cmp-jumbo ">
+                                                                                        <h1
+                                                                                            class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-headline field--type-string field--label-hidden field__item">
+                                                                                                WHAT WE DO</div>
+
+                                                                                        </h1>
+                                                                                        <svg class="cmp-threelines"
+                                                                                            xmlns="http://www.w3.org/2000/svg"
+                                                                                            width="61" height="17"
+                                                                                            viewBox="0 0 61 17">
+                                                                                            <g fill="#F16824"
+                                                                                                fill-rule="evenodd">
+                                                                                                <path
+                                                                                                    d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                                                </path>
+                                                                                            </g>
+                                                                                        </svg>
+                                                                                        <div class="cmp-text">
+
+                                                                                            <div
+                                                                                                class="clearfix text-formatted field field--name-field-slider-body field--type-text-long field--label-hidden field__item">
+                                                                                                <p>We are a
+                                                                                                    <strong>data-driven
+                                                                                                        solutions</strong>
+                                                                                                    provider working
+                                                                                                    <strong>hard</strong>
+                                                                                                    and
+                                                                                                    <strong>smart</strong>
+                                                                                                    to help automotive
+                                                                                                    repair shop and be
+                                                                                                    the <strong>best
+                                                                                                        they can
+                                                                                                        be</strong></p>
+                                                                                            </div>
+
+                                                                                        </div>
+                                                                                        <button
+                                                                                            class="cmp-button btn btn-outline-secondary">
+                                                                                            <div
+                                                                                                class="field field--name-field-slider-cta field--type-link field--label-hidden field__item">
+                                                                                                <a href="">ABOUT US</a>
+                                                                                            </div>
+                                                                                        </button>
+                                                                                    </div>
+
+                                                                                </div>
+
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </section>
+
+
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;Testimonial Section&quot; block"
+                                                    data-block-plugin-id="block_content:fbd40c5c-93ba-4065-8138-4787a00e8ae3"
+                                                    class="block block-block-content block-block-contentfbd40c5c-93ba-4065-8138-4787a00e8ae3">
+
+
+                                                    <div class="content">
+
+                                                        <section class="columns is-centered">
+                                                            <div class="inner-section ">
+                                                                <div class="cmp-testimonial">
+                                                                    <div class="cmp-testimonial-inner">
+                                                                        <div id="carouselTestimonialSlider"
+                                                                            class="cmp-slider carousel slide pointer-event"
+                                                                            data-ride="carousel" data-interval="false">
+                                                                            <div class="cmp-slider-controls d-flex">
+                                                                                <a class="cmp-slider-prev"
+                                                                                    href="#carouselTestimonialSlider"
+                                                                                    role="button" data-slide="prev">
+                                                                                    <svg xmlns="http://www.w3.org/2000/svg"
+                                                                                        aria-hidden="true" width="9"
+                                                                                        height="15" viewBox="0 0 9 15">
+                                                                                        <path fill-rule="evenodd"
+                                                                                            d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z">
+                                                                                        </path>
+                                                                                    </svg>
+                                                                                    <span
+                                                                                        class="sr-only">Previous</span>
+                                                                                </a>
+                                                                                <ol class="carousel-indicators">
+                                                                                    <li data-target="#carouselTestimonialSlider"
+                                                                                        data-slide-to="0"
+                                                                                        class="active"></li>
+                                                                                    <li data-target="#carouselTestimonialSlider"
+                                                                                        data-slide-to="1" class=""></li>
+                                                                                </ol>
+                                                                                <a class="cmp-slider-next"
+                                                                                    href="#carouselTestimonialSlider"
+                                                                                    role="button" data-slide="next">
+                                                                                    <svg xmlns="http://www.w3.org/2000/svg"
+                                                                                        aria-hidden="true" width="9"
+                                                                                        height="15" viewBox="0 0 9 15">
+                                                                                        <path fill-rule="evenodd"
+                                                                                            d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z">
+                                                                                        </path>
+                                                                                    </svg>
+                                                                                    <span class="sr-only">Next</span>
+                                                                                </a>
+                                                                            </div>
+
+                                                                            <div class="carousel-inner">
+                                                                                <div class="carousel-item  active ">
+
+                                                                                    <article role="article"
+                                                                                        about="/node/3651"
+                                                                                        class="node node--type-testimonial node--promoted node--view-mode-default">
+                                                                                        <div class="node__content">
+                                                                                            <div class="">
+                                                                                                <div
+                                                                                                    class="cmp-cols row  cols-1  cols-md-2">
+                                                                                                    <div
+                                                                                                        class="cmp-shadow-box-img">
+                                                                                                        <div
+                                                                                                            class="desktop">
+                                                                                                            <div
+                                                                                                                class="field field--name-field-testimonial-desk-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                <article
+                                                                                                                    class="media media--type-image media--view-mode-default">
+
+
+                                                                                                                    <div
+                                                                                                                        class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                        <img class="cmp-image"
+                                                                                                                            src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/richard.jpg"
+                                                                                                                            {# width="669"
+                                                                                                                            height="738" #}
+                                                                                                                            alt="Testimonial 1"
+                                                                                                                            typeof="foaf:Image">
+
+                                                                                                                    </div>
+
+                                                                                                                </article>
+                                                                                                            </div>
+                                                                                                        </div>
+                                                                                                        <div class="mobile"
+                                                                                                            style="display: none;">
+                                                                                                            <div
+                                                                                                                class="field field--name-field-testimonial-mobile-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                <article
+                                                                                                                    class="media media--type-image media--view-mode-default">
+
+
+                                                                                                                    <div
+                                                                                                                        class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                        <img class="cmp-image"
+                                                                                                                            src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/richard.jpg"
+                                                                                                                            width="669"
+                                                                                                                            height="738"
+                                                                                                                            alt="Testimonial 1"
+                                                                                                                            typeof="foaf:Image">
+
+                                                                                                                    </div>
+
+                                                                                                                </article>
+                                                                                                            </div>
+                                                                                                        </div>
+
+                                                                                                        <div
+                                                                                                            class="cmp-shadow-box-play-container">
+                                                                                                            <button
+                                                                                                                class="btn">
+                                                                                                                <img class="cmp-image "
+                                                                                                                    src="/images/play.svg"
+                                                                                                                    alt="">
+                                                                                                                <span
+                                                                                                                    class="sr-only"></span>
+                                                                                                            </button>
+                                                                                                        </div>
+                                                                                                    </div>
+                                                                                                    <div
+                                                                                                        class="cmp-shadow-box-quote">
+                                                                                                        <div
+                                                                                                            class="cmp-quote">
+                                                                                                            <img class="cmp-image "
+                                                                                                                src="/images/quote-start.svg"
+                                                                                                                alt="">
+                                                                                                            <blockquote
+                                                                                                                cite="https://www.huxley.net/bnw/four.html">
+                                                                                                                <p>
+                                                                                                                </p>
+                                                                                                                <div
+                                                                                                                    class="clearfix text-formatted field field--name-field-testimonial-quote field--type-text-long field--label-hidden field__item">
+                                                                                                                    <p>ALLDATA
+                                                                                                                        allows
+                                                                                                                        us
+                                                                                                                        to
+                                                                                                                        have
+                                                                                                                        access
+                                                                                                                        to
+                                                                                                                        the
+                                                                                                                        information
+                                                                                                                        we
+                                                                                                                        need,
+                                                                                                                        and
+                                                                                                                        it’s
+                                                                                                                        completely
+                                                                                                                        portable,
+                                                                                                                        so
+                                                                                                                        our
+                                                                                                                        techs
+                                                                                                                        have
+                                                                                                                        everything
+                                                                                                                        at
+                                                                                                                        their
+                                                                                                                        fingertips.
+                                                                                                                    </p>
+                                                                                                                </div>
+                                                                                                                <p></p>
+                                                                                                                <footer>
+                                                                                                                    <div
+                                                                                                                        class="field field--name-field-testimonial-cite field--type-string field--label-hidden field__item">
+                                                                                                                        Josh
+                                                                                                                        Kazdan,
+                                                                                                                        Autosphere
+                                                                                                                    </div>
+                                                                                                                </footer>
+                                                                                                            </blockquote>
+                                                                                                            <img class="cmp-image "
+                                                                                                                src="/images/quote-end.svg"
+                                                                                                                alt="">
+                                                                                                        </div>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+
+                                                                                    </article>
+
+                                                                                </div>
+                                                                                <div class="carousel-item   ">
+
+                                                                                    <article role="article"
+                                                                                        about="/node/3656"
+                                                                                        class="node node--type-testimonial node--promoted node--view-mode-default">
+                                                                                        <div class="node__content">
+                                                                                            <div class="">
+                                                                                                <div
+                                                                                                    class="cmp-cols row  cols-1  cols-md-2">
+                                                                                                    <div
+                                                                                                        class="cmp-shadow-box-img">
+                                                                                                        <div
+                                                                                                            class="desktop">
+                                                                                                            <div
+                                                                                                                class="field field--name-field-testimonial-desk-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                <article
+                                                                                                                    class="media media--type-image media--view-mode-default">
+
+
+                                                                                                                    <div
+                                                                                                                        class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                        <img class="cmp-image"
+                                                                                                                            src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/richard.jpg"
+                                                                                                                            width="669"
+                                                                                                                            height="738"
+                                                                                                                            alt="Testimonial 1"
+                                                                                                                            typeof="foaf:Image">
+
+                                                                                                                    </div>
+
+                                                                                                                </article>
+                                                                                                            </div>
+                                                                                                        </div>
+                                                                                                        <div class="mobile"
+                                                                                                            style="display: none;">
+                                                                                                            <div
+                                                                                                                class="field field--name-field-testimonial-mobile-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                <article
+                                                                                                                    class="media media--type-image media--view-mode-default">
+
+
+                                                                                                                    <div
+                                                                                                                        class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                        <img class="cmp-image"
+                                                                                                                            src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/richard.jpg"
+                                                                                                                            width="669"
+                                                                                                                            height="738"
+                                                                                                                            alt="Testimonial 1"
+                                                                                                                            typeof="foaf:Image">
+
+                                                                                                                    </div>
+
+                                                                                                                </article>
+                                                                                                            </div>
+                                                                                                        </div>
+
+                                                                                                        <div
+                                                                                                            class="cmp-shadow-box-play-container">
+                                                                                                            <button
+                                                                                                                class="btn">
+                                                                                                                <img class="cmp-image "
+                                                                                                                    src="/images/play.svg"
+                                                                                                                    alt="">
+                                                                                                                <span
+                                                                                                                    class="sr-only"></span>
+                                                                                                            </button>
+                                                                                                        </div>
+                                                                                                    </div>
+                                                                                                    <div
+                                                                                                        class="cmp-shadow-box-quote">
+                                                                                                        <div
+                                                                                                            class="cmp-quote">
+                                                                                                            <img class="cmp-image "
+                                                                                                                src="/images/quote-start.svg"
+                                                                                                                alt="">
+                                                                                                            <blockquote
+                                                                                                                cite="https://www.huxley.net/bnw/four.html">
+                                                                                                                <p>
+                                                                                                                </p>
+                                                                                                                <div
+                                                                                                                    class="clearfix text-formatted field field--name-field-testimonial-quote field--type-text-long field--label-hidden field__item">
+                                                                                                                    <p>2 -&nbsp;ALLDATA
+                                                                                                                        allows
+                                                                                                                        us
+                                                                                                                        to
+                                                                                                                        have
+                                                                                                                        access
+                                                                                                                        to
+                                                                                                                        the
+                                                                                                                        information
+                                                                                                                        we
+                                                                                                                        need,
+                                                                                                                        and
+                                                                                                                        it’s
+                                                                                                                        completely
+                                                                                                                        portable,
+                                                                                                                        so
+                                                                                                                        our
+                                                                                                                        techs
+                                                                                                                        have
+                                                                                                                        everything
+                                                                                                                        at
+                                                                                                                        their
+                                                                                                                        fingertips.
+                                                                                                                    </p>
+                                                                                                                </div>
+                                                                                                                <p></p>
+                                                                                                                <footer>
+                                                                                                                    <div
+                                                                                                                        class="field field--name-field-testimonial-cite field--type-string field--label-hidden field__item">
+                                                                                                                        2-
+                                                                                                                        Josh
+                                                                                                                        Kazdan,
+                                                                                                                        Autosphere
+                                                                                                                    </div>
+                                                                                                                </footer>
+                                                                                                            </blockquote>
+                                                                                                            <img class="cmp-image "
+                                                                                                                src="/images/quote-end.svg"
+                                                                                                                alt="">
+                                                                                                        </div>
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+
+                                                                                    </article>
+
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+                                                                        <div class="cmp-testimonial-footer">
+                                                                            <p class="cmp-text">
+
+                                                                            </p>
+                                                                            <div
+                                                                                class="clearfix text-formatted field field--name-field-shadowbox-description field--type-text-long field--label-hidden field__item">
+                                                                                <p>See what over 400,000 technicians
+                                                                                    can't work without.</p>
+                                                                            </div>
+
+                                                                            <p></p>
+                                                                            <button
+                                                                                class="cmp-button btn btn-outline-secondary">
+                                                                                <div
+                                                                                    class="field field--name-field-shadow-cta field--type-link field--label-hidden field__item">
+                                                                                    <a href="">Get Started</a></div>
+                                                                            </button>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </section>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+                                        <div class="layout layout--onecol">
+                                            <div class="layout__region layout__region--content">
+                                                <div data-layout-content-preview-placeholder-label="&quot;SEE THE LATEST&quot; block"
+                                                    data-block-plugin-id="block_content:7e55eb43-1569-4ff4-9de6-38a4d4cb5ff1"
+                                                    class="block block-block-content block-block-content7e55eb43-1569-4ff4-9de6-38a4d4cb5ff1">
+
+
+                                                    <div class="content">
+
+                                                        <section class="cmp-skew columns is-centered bg-primary-100  ">
+                                                            <div class="inner-section ">
+                                                                <div class="cmp-latest">
+                                                                    <div class="container">
+                                                                        <h2 class="cmp-heading h2 has-line ">
+
+                                                                            <div
+                                                                                class="field field--name-field-posts-headline field--type-string field--label-hidden field__item">
+                                                                                SEE THE LATEST</div>
+
+                                                                        </h2>
+                                                                        <svg class="cmp-threelines"
+                                                                            xmlns="http://www.w3.org/2000/svg"
+                                                                            width="61" height="17" viewBox="0 0 61 17">
+                                                                            <g fill="#F16824" fill-rule="evenodd">
+                                                                                <path
+                                                                                    d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z">
+                                                                                </path>
+                                                                            </g>
+                                                                        </svg>
+                                                                        <div class="cmp-latestcards__cardcontainer">
+                                                                            <div class="row">
+                                                                                <div
+                                                                                    class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
+                                                                                    <div class="cmp-latestcard">
+
+                                                                                        <div
+                                                                                            class="field field--name-field-recent-post-paragraph field--type-entity-reference-revisions field--label-hidden field__items">
+                                                                                            <div class="field__item">
+                                                                                                <div
+                                                                                                    class="paragraph paragraph--type--recent-posts-section paragraph--view-mode--default">
+
+                                                                                                    <div
+                                                                                                        class="cmp-latestHeading">
+                                                                                                        <h6
+                                                                                                            class="heading-title">
+                                                                                                            <div
+                                                                                                                class="field field--name-field-posts-headline field--type-string field--label-hidden field__item">
+                                                                                                                NEWS
+                                                                                                            </div>
+                                                                                                        </h6>
+                                                                                                        <button
+                                                                                                            class="heading-link">
+                                                                                                            <a class="heading-link"
+                                                                                                                href="/taxonomy/term/771"
+                                                                                                                target="_self">
+                                                                                                                SEE ALL
+                                                                                                                NEWS</a>
+                                                                                                        </button>
+                                                                                                    </div>
+                                                                                                    <div
+                                                                                                        class="cmp-latestcard-content">
+
+                                                                                                        <div
+                                                                                                            class="field field--name-field-posts-blog-post field--type-entity-reference field--label-hidden field__item">
+                                                                                                            <article
+                                                                                                                role="article"
+                                                                                                                about="/node/3701"
+                                                                                                                class="node node--type-blog-post node--promoted node--view-mode-recent-posts-block clearfix">
+                                                                                                                <div
+                                                                                                                    class="node__content clearfix">
+                                                                                                                    <div
+                                                                                                                        class="cmp-latestcard__image ">
+                                                                                                                        <div
+                                                                                                                            class="d-none d-md-block">
+                                                                                                                            <div
+                                                                                                                                class="cmp-imageblue bg-primary">
+
+                                                                                                                                <div
+                                                                                                                                    class="field field--name-field-blog-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                                    <article
+                                                                                                                                        class="media media--type-image media--view-mode-default">
+
+
+                                                                                                                                        <div
+                                                                                                                                            class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                                            <img class="cmp-image"
+                                                                                                                                                src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg"
+                                                                                                                                                {# width="588"
+                                                                                                                                                height="392" #}
+                                                                                                                                                alt="servicecard"
+                                                                                                                                                typeof="foaf:Image">
+
+                                                                                                                                        </div>
+
+                                                                                                                                    </article>
+                                                                                                                                </div>
+
+                                                                                                                            </div>
+                                                                                                                        </div>
+                                                                                                                    </div>
+                                                                                                                    <div
+                                                                                                                        class="cmp-latestcard__content">
+                                                                                                                        <h6
+                                                                                                                            class="cmp-heading h6   ">
+
+                                                                                                                            <div
+                                                                                                                                class="field field--name-field-blog-headline field--type-string field--label-hidden field__item">
+                                                                                                                                FIVE
+                                                                                                                                WAYS
+                                                                                                                                TECHNOLOGY
+                                                                                                                                CAN
+                                                                                                                                HELP
+                                                                                                                                YOUR
+                                                                                                                                DEALERSHIP
+                                                                                                                                SERVICE
+                                                                                                                            </div>
+
+                                                                                                                        </h6>
+                                                                                                                        <span
+                                                                                                                            class="cmp-latestcard__more">
+                                                                                                                            <img src="/images/plus-orange.svg"
+                                                                                                                                alt="more">
+                                                                                                                        </span>
+                                                                                                                        <div
+                                                                                                                            class="cmp-text">
+
+                                                                                                                            <div
+                                                                                                                                class="clearfix text-formatted field field--name-field-blog-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                                                <p>At
+                                                                                                                                    the
+                                                                                                                                    NIADA
+                                                                                                                                    Convention
+                                                                                                                                    and
+                                                                                                                                    Expo,
+                                                                                                                                    George
+                                                                                                                                    Verkamp
+                                                                                                                                    (shown
+                                                                                                                                    above),
+                                                                                                                                    Vice
+                                                                                                                                    President
+                                                                                                                                    of
+                                                                                                                                    Sales
+                                                                                                                                    &amp;
+                                                                                                                                    Business
+                                                                                                                                    Development
+                                                                                                                                    at
+                                                                                                                                    ALLDATA...
+                                                                                                                                </p>
+                                                                                                                            </div>
+
+                                                                                                                        </div>
+                                                                                                                        <div
+                                                                                                                            class="cmp-cardlink">
+                                                                                                                            <div
+                                                                                                                                class="field field--name-field-blog-cta field--type-link field--label-hidden field__item">
+                                                                                                                                <a
+                                                                                                                                    href="">LEARN
+                                                                                                                                    MORE</a>
+                                                                                                                            </div>
+                                                                                                                        </div>
+                                                                                                                    </div>
+                                                                                                                </div>
+                                                                                                            </article>
+                                                                                                        </div>
+
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                            </div>
+                                                                                            <div class="field__item">
+                                                                                                <div
+                                                                                                    class="paragraph paragraph--type--recent-posts-section paragraph--view-mode--default">
+
+                                                                                                    <div
+                                                                                                        class="cmp-latestHeading">
+                                                                                                        <h6
+                                                                                                            class="heading-title">
+                                                                                                            <div
+                                                                                                                class="field field--name-field-posts-headline field--type-string field--label-hidden field__item">
+                                                                                                                Teach
+                                                                                                                tips
+                                                                                                            </div>
+                                                                                                        </h6>
+                                                                                                        <button
+                                                                                                            class="heading-link">
+                                                                                                            <a class="heading-link"
+                                                                                                                href="/taxonomy/term/776"
+                                                                                                                target="_self">
+                                                                                                                SEE ALL
+                                                                                                                TEACH
+                                                                                                                TIPS</a>
+                                                                                                        </button>
+                                                                                                    </div>
+                                                                                                    <div
+                                                                                                        class="cmp-latestcard-content">
+
+                                                                                                        <div
+                                                                                                            class="field field--name-field-posts-blog-post field--type-entity-reference field--label-hidden field__item">
+                                                                                                            <article
+                                                                                                                role="article"
+                                                                                                                about="/node/3706"
+                                                                                                                class="node node--type-blog-post node--promoted node--view-mode-recent-posts-block clearfix">
+                                                                                                                <div
+                                                                                                                    class="node__content clearfix">
+                                                                                                                    <div
+                                                                                                                        class="cmp-latestcard__image ">
+                                                                                                                        <div
+                                                                                                                            class="d-none d-md-block">
+                                                                                                                            <div
+                                                                                                                                class="cmp-imageblue bg-primary">
+
+                                                                                                                                <div
+                                                                                                                                    class="field field--name-field-blog-desktop-image field--type-entity-reference field--label-hidden field__item">
+                                                                                                                                    <article
+                                                                                                                                        class="media media--type-image media--view-mode-default">
+
+
+                                                                                                                                        <div
+                                                                                                                                            class="field field--name-image field--type-image field--label-hidden field__item">
+                                                                                                                                            <img class="cmp-image"
+                                                                                                                                                src="http://alldatadev.prod.acquia-sites.com/sites/default/files/2020-01/carfix.jpg"
+                                                                                                                                                {# width="588"
+                                                                                                                                                height="392" #}
+                                                                                                                                                alt="servicecard"
+                                                                                                                                                typeof="foaf:Image">
+
+                                                                                                                                        </div>
+
+                                                                                                                                    </article>
+                                                                                                                                </div>
+
+                                                                                                                            </div>
+                                                                                                                        </div>
+                                                                                                                    </div>
+                                                                                                                    <div
+                                                                                                                        class="cmp-latestcard__content">
+                                                                                                                        <h6
+                                                                                                                            class="cmp-heading h6   ">
+
+                                                                                                                            <div
+                                                                                                                                class="field field--name-field-blog-headline field--type-string field--label-hidden field__item">
+                                                                                                                                FIVE
+                                                                                                                                WAYS
+                                                                                                                                TECHNOLOGY
+                                                                                                                                CAN
+                                                                                                                                HELP
+                                                                                                                                YOUR
+                                                                                                                                DEALERSHIP
+                                                                                                                                SERVICE
+                                                                                                                            </div>
+
+                                                                                                                        </h6>
+                                                                                                                        <span
+                                                                                                                            class="cmp-latestcard__more">
+                                                                                                                            <img src="/images/plus-orange.svg"
+                                                                                                                                alt="more">
+                                                                                                                        </span>
+                                                                                                                        <div
+                                                                                                                            class="cmp-text">
+
+                                                                                                                            <div
+                                                                                                                                class="clearfix text-formatted field field--name-field-blog-abstract field--type-text-long field--label-hidden field__item">
+                                                                                                                                <p>At
+                                                                                                                                    the
+                                                                                                                                    NIADA
+                                                                                                                                    Convention
+                                                                                                                                    and
+                                                                                                                                    Expo,
+                                                                                                                                    George
+                                                                                                                                    Verkamp
+                                                                                                                                    (shown
+                                                                                                                                    above),
+                                                                                                                                    Vice
+                                                                                                                                    President
+                                                                                                                                    of
+                                                                                                                                    Sales
+                                                                                                                                    &amp;
+                                                                                                                                    Business
+                                                                                                                                    Development
+                                                                                                                                    at
+                                                                                                                                    ALLDATA...
+                                                                                                                                </p>
+                                                                                                                            </div>
+
+                                                                                                                        </div>
+                                                                                                                        <div
+                                                                                                                            class="cmp-cardlink">
+                                                                                                                            <div
+                                                                                                                                class="field field--name-field-blog-cta field--type-link field--label-hidden field__item">
+                                                                                                                                <a
+                                                                                                                                    href="">LEARN
+                                                                                                                                    MORE</a>
+                                                                                                                            </div>
+                                                                                                                        </div>
+                                                                                                                    </div>
+                                                                                                                </div>
+                                                                                                            </article>
+                                                                                                        </div>
+
+                                                                                                    </div>
+                                                                                                </div>
+                                                                                            </div>
+                                                                                        </div>
+
+                                                                                    </div>
+                                                                                </div>
+                                                                                <div
+                                                                                    class="more-news d-none d-md-block">
+                                                                                    <button
+                                                                                        class="cmp-button btn btn-outline-secondary">
+                                                                                        <div
+                                                                                            class="field field--name-field-posts-block-cta field--type-link field--label-hidden field__item">
+                                                                                            <a href="">see this month's
+                                                                                                issue of alldata
+                                                                                                news</a></div>
+                                                                                    </button>
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </section>
+                                                    </div>
+                                                </div>
+
+                                            </div>
+                                        </div>
+
+                                    </div>
+                                </article>
+
+                            </div>
+                        </div>
+
+                    </div>
+
+                </section>
+            </main>
+        </div>
+    </div>
+    {# <footer class="site-footer">
+        <div class="layout-container">
+            <div class="site-footer__top clearfix">
+
+
+
+                <div class="region region-footer-fourth main-footer">
+                    <nav role="navigation" aria-labelledby="block-alldata-footertopmenu-menu"
+                        id="block-alldata-footertopmenu"
+                        class="footer-container block block-menu navigation menu--footer-top-menu"
+                        data-block-plugin-id="menu_block:footer-top-menu">
+
+                        <h2 class="visually-hidden" id="block-alldata-footertopmenu-menu">Footer Top Menu - Products
+                        </h2>
+
+
+                        <div class="content">
+                            <div class="menu-toggle-target menu-toggle-target-show"
+                                id="show-block-alldata-footertopmenu"></div>
+                            <div class="menu-toggle-target" id="hide-block-alldata-footertopmenu"></div>
+                            <a class="menu-toggle" href="#show-block-alldata-footertopmenu">Show — Footer Top Menu -
+                                Products</a>
+                            <a class="menu-toggle menu-toggle--hide" href="#hide-block-alldata-footertopmenu">Hide —
+                                Footer Top Menu - Products</a>
+
+                            <ul data-region="footer_fourth" class="clearfix menu">
+                                <li class="menu-item">
+                                    <a href="">Products</a>
+                                </li>
+                                <li class="menu-item">
+                                    <a href="">ALLDATA Repair</a>
+                                </li>
+                            </ul>
+
+
+
+                        </div>
+                    </nav>
+                    <nav role="navigation" aria-labelledby="block-footertopmenu-2-menu" id="block-footertopmenu-2"
+                        class="footer-container block block-menu navigation menu--footer-top-menu"
+                        data-block-plugin-id="menu_block:footer-top-menu">
+
+                        <h2 class="visually-hidden" id="block-footertopmenu-2-menu">Footer Top Menu - Support</h2>
+
+
+                        <div class="content">
+                            <div class="menu-toggle-target menu-toggle-target-show" id="show-block-footertopmenu-2">
+                            </div>
+                            <div class="menu-toggle-target" id="hide-block-footertopmenu-2"></div>
+                            <a class="menu-toggle" href="#show-block-footertopmenu-2">Show — Footer Top Menu -
+                                Support</a>
+                            <a class="menu-toggle menu-toggle--hide" href="#hide-block-footertopmenu-2">Hide — Footer
+                                Top Menu - Support</a>
+
+                            <ul data-region="footer_fourth" class="clearfix menu">
+                                <li class="menu-item">
+                                    <a href="">Support</a>
+                                </li>
+                                <li class="menu-item">
+                                    <a href="">Popular Topics</a>
+                                </li>
+                            </ul>
+
+
+
+                        </div>
+                    </nav>
+                    <nav role="navigation" aria-labelledby="block-footertopmenu-3-menu" id="block-footertopmenu-3"
+                        class="footer-container block block-menu navigation menu--footer-top-menu"
+                        data-block-plugin-id="menu_block:footer-top-menu">
+
+                        <h2 class="visually-hidden" id="block-footertopmenu-3-menu">Footer Top Menu - Resources</h2>
+
+
+                        <div class="content">
+                            <div class="menu-toggle-target menu-toggle-target-show" id="show-block-footertopmenu-3">
+                            </div>
+                            <div class="menu-toggle-target" id="hide-block-footertopmenu-3"></div>
+                            <a class="menu-toggle" href="#show-block-footertopmenu-3">Show — Footer Top Menu -
+                                Resources</a>
+                            <a class="menu-toggle menu-toggle--hide" href="#hide-block-footertopmenu-3">Hide — Footer
+                                Top Menu - Resources</a>
+
+                            <ul data-region="footer_fourth" class="clearfix menu">
+                                <li class="menu-item">
+                                    <a href="">Resources</a>
+                                </li>
+                                <li class="menu-item">
+                                    <a href="">Product Resources</a>
+                                </li>
+                            </ul>
+
+
+
+                        </div>
+                    </nav>
+                    <nav role="navigation" aria-labelledby="block-footertopmenu-4-menu" id="block-footertopmenu-4"
+                        class="footer-container block block-menu navigation menu--footer-top-menu"
+                        data-block-plugin-id="menu_block:footer-top-menu">
+
+                        <h2 class="visually-hidden" id="block-footertopmenu-4-menu">Footer Top Menu - About Us</h2>
+
+
+                        <div class="content">
+                            <div class="menu-toggle-target menu-toggle-target-show" id="show-block-footertopmenu-4">
+                            </div>
+                            <div class="menu-toggle-target" id="hide-block-footertopmenu-4"></div>
+                            <a class="menu-toggle" href="#show-block-footertopmenu-4">Show — Footer Top Menu - About
+                                Us</a>
+                            <a class="menu-toggle menu-toggle--hide" href="#hide-block-footertopmenu-4">Hide — Footer
+                                Top Menu - About Us</a>
+
+                            <ul data-region="footer_fourth" class="clearfix menu">
+                                <li class="menu-item">
+                                    <a href="">About Us</a>
+                                </li>
+                                <li class="menu-item">
+                                    <a href="">Partner</a>
+                                </li>
+                            </ul>
+
+
+
+                        </div>
+                    </nav>
+                    <nav role="navigation" aria-labelledby="block-footertopmenu-5-menu" id="block-footertopmenu-5"
+                        class="footer-container block block-menu navigation menu--footer-top-menu"
+                        data-block-plugin-id="menu_block:footer-top-menu">
+
+                        <h2 class="visually-hidden" id="block-footertopmenu-5-menu">Footer Top Menu - Contact us</h2>
+
+
+                        <div class="content">
+                            <div class="menu-toggle-target menu-toggle-target-show" id="show-block-footertopmenu-5">
+                            </div>
+                            <div class="menu-toggle-target" id="hide-block-footertopmenu-5"></div>
+                            <a class="menu-toggle" href="#show-block-footertopmenu-5">Show — Footer Top Menu - Contact
+                                us</a>
+                            <a class="menu-toggle menu-toggle--hide" href="#hide-block-footertopmenu-5">Hide — Footer
+                                Top Menu - Contact us</a>
+
+                            <ul data-region="footer_fourth" class="clearfix menu">
+                                <li class="menu-item">
+                                    <a href="">Contact Us</a>
+                                </li>
+                                <li class="menu-item">
+                                    <a href="tel:800-697-2533">800-697-2533</a>
+                                </li>
+                            </ul>
+
+
+
+                        </div>
+                    </nav>
+                    <nav role="navigation" aria-labelledby="block-footertopmenu-6-menu" id="block-footertopmenu-6"
+                        class="footer-container block block-menu navigation menu--footer-top-menu"
+                        data-block-plugin-id="menu_block:footer-top-menu">
+
+                        <h2 class="visually-hidden" id="block-footertopmenu-6-menu">Footer Top Menu - Related Sites</h2>
+
+
+                        <div class="content">
+                            <div class="menu-toggle-target menu-toggle-target-show" id="show-block-footertopmenu-6">
+                            </div>
+                            <div class="menu-toggle-target" id="hide-block-footertopmenu-6"></div>
+                            <a class="menu-toggle" href="#show-block-footertopmenu-6">Show — Footer Top Menu - Related
+                                Sites</a>
+                            <a class="menu-toggle menu-toggle--hide" href="#hide-block-footertopmenu-6">Hide — Footer
+                                Top Menu - Related Sites</a>
+
+                            <ul data-region="footer_fourth" class="clearfix menu">
+                                <li class="menu-item">
+                                    <a href="">Related Sites</a>
+                                </li>
+                                <li class="menu-item">
+                                    <a href="">ALLDATA Mexico</a>
+                                </li>
+                            </ul>
+
+
+
+                        </div>
+                    </nav>
+                    <div id="block-socialmedialinks"
+                        class="footer-container social block-social-media-links block block-social-media-links-block"
+                        data-block-plugin-id="social_media_links_block">
+
+                        <h2>Follow Us</h2>
+
+                        <div class="content">
+
+
+                            <ul class="social-media-links--platforms platforms inline horizontal">
+                                <li>
+                                    <a href="https://www.linkedin.com/home" aria-label="Follow Us" title="Follow Us">
+                                        <span class="fa fa-linkedin fa-2x"></span>
+                                    </a>
+
+                                </li>
+                            </ul>
+
+                        </div>
+                    </div>
+
+                </div>
+
+            </div>
+            <div class="site-footer__bottom">
+                <div class="region region-footer-fifth sub-footer listless">
+                    <nav role="navigation" aria-labelledby="block-alldata-footerbottommenu-menu"
+                        id="block-alldata-footerbottommenu" data-block-plugin-id="menu_block:footer-bottom-menu"
+                        class="block block-menu navigation menu--footer-bottom-menu">
+
+                        <h2 class="visually-hidden" id="block-alldata-footerbottommenu-menu">Footer Bottom Menu</h2>
+
+
+                        <div class="content">
+                            <div class="menu-toggle-target menu-toggle-target-show"
+                                id="show-block-alldata-footerbottommenu"></div>
+                            <div class="menu-toggle-target" id="hide-block-alldata-footerbottommenu"></div>
+                            <a class="menu-toggle" href="#show-block-alldata-footerbottommenu">Show — Footer Bottom
+                                Menu</a>
+                            <a class="menu-toggle menu-toggle--hide" href="#hide-block-alldata-footerbottommenu">Hide —
+                                Footer Bottom Menu</a>
+
+                            <ul data-region="footer_fifth" class="clearfix menu">
+                                <li class="menu-item">
+                                    <span>© ALLDATA</span>
+                                </li>
+                                <li class="menu-item">
+                                    <span> An AutoZone Company</span>
+                                </li>
+                                <li class="menu-item">
+                                    <a href="">Trademarks</a>
+                                </li>
+                                <li class="menu-item">
+                                    <a href=""> Terms of Use</a>
+                                </li>
+                                <li class="menu-item">
+                                    <a href="">Privacy Policy</a>
+                                </li>
+                            </ul>
+
+
+
+                        </div>
+                    </nav>
+
+                </div>
+
+            </div>
+        </div>
+    </footer> #}
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an demo01172020 component!",
+  "heading": "My heading"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Demo01172020
+ */
+
+/* STARTER CODE
+
+class Demo01172020 {
+    constructor($inst) {
+        cponsole.log('Initializing Demo01172020')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/demo01172020/demo01172020.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/pages/demo01172020/demo01172020.js
+                
    • 
+                
  • 
+                    Size:
+                    193 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Demo01172020
+ */
+
+// BEGIN OF DRUPAL SITE MARKUP STYLES
+
+.field__items > *:not([class*=" col"]):not([class^="col"]),
+.cmp-cols.cols-lg-1
+  > *:not([class*=" col"]):not([class^="col"]):not(.field__items) {
+  position: relative;
+  width: 100%;
+  padding-right: 15px;
+  padding-left: 15px;
+}
+/**
+ * Container
+ */
+.layout-container {
+  box-sizing: border-box;
+  max-width: 860px;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+@media all and (min-width: 851px) {
+  .layout-container {
+    max-width: 1290px;
+  }
+}
+
+/**
+ * Main
+ */
+.layout-main-wrapper {
+  min-height: 300px;
+}
+.layout-main {
+  margin-top: 20px;
+  margin-bottom: 40px;
+}
+
+/**
+ * @file
+ * Visual styles for Bartik's main-content component.
+ */
+
+.main-content .section {
+  padding: 0 15px;
+}
+.main-content h2 {
+  margin-bottom: 2px;
+  font-size: 1.429em;
+  line-height: 1.4;
+}
+
+@media all and (min-width: 851px) {
+  .main-content {
+    position: relative;
+    float: left; /* LTR */
+  }
+  [dir="rtl"] .main-content {
+    float: right;
+  }
+  .layout-two-sidebars .main-content {
+    width: 50%;
+    margin-right: 25%;
+    margin-left: 25%;
+  }
+  .layout-one-sidebar .main-content {
+    width: 75%;
+  }
+  .layout-no-sidebars .main-content {
+    width: 100%;
+  }
+  .layout-sidebar-first .main-content {
+    margin-right: 0; /* LTR */
+    margin-left: 25%; /* LTR */
+  }
+  [dir="rtl"] .layout-sidebar-first .main-content {
+    margin-right: 25%;
+    margin-left: 0;
+  }
+  .layout-sidebar-second .main-content {
+    margin-right: 25%; /* LTR */
+    margin-left: 0; /* LTR */
+  }
+  [dir="rtl"] .layout-sidebar-second .main-content {
+    margin-right: 0;
+    margin-left: 25%;
+  }
+}
+
+/**
+ * @file
+ * Visual styles for Bartik's field components.
+ */
+
+.field--type-entity-reference {
+  margin: 0 0 1.2em;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+.field--type-entity-reference .field__label {
+  margin: 0;
+  padding-right: 5px; /* LTR */
+  font-weight: normal;
+}
+[dir="rtl"] .field--type-entity-reference .field__label {
+  padding-right: 0;
+  padding-left: 5px;
+}
+.field--type-entity-reference .field__label,
+.field--type-entity-reference ul.links {
+  font-size: 0.8em;
+}
+.node--view-mode-teaser .field--type-entity-reference .field__label,
+.node--view-mode-teaser .field--type-entity-reference ul.links {
+  font-size: 0.821em;
+}
+.field--type-entity-reference ul.links {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+/* This is required to win over specificity of [dir="rtl"] .region-content ul */
+[dir="rtl"] .field--type-entity-reference ul.links {
+  padding: 0;
+}
+.field--type-entity-reference ul.links li {
+  float: left; /* LTR */
+  padding: 0 1em 0 0; /* LTR */
+  white-space: nowrap;
+}
+[dir="rtl"] .field--type-entity-reference ul.links li {
+  float: right;
+  padding: 0 0 0 1em;
+}
+
+@media all and (min-width: 560px) {
+  .node .field--type-image {
+    float: left; /* LTR */
+    margin: 0 1em 0 0; /* LTR */
+  }
+  [dir="rtl"] .node .field--type-image {
+    float: right;
+    margin: 0 0 0 1em;
+  }
+  .node .field--type-image + .field--type-image {
+    clear: both;
+  }
+}
+.field--type-image img,
+.field--name-user-picture img {
+  margin: 0 0 1em;
+}
+.field--type-image a {
+  border-bottom: none;
+}
+.field--name-field-tags {
+  margin: 0 0 1.2em;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+.field--name-field-tags .field__label {
+  margin: 0;
+  padding-right: 5px; /* LTR */
+  font-weight: normal;
+}
+[dir="rtl"] .field--name-field-tags .field__label {
+  padding-right: 0;
+  padding-left: 5px;
+}
+.field--name-field-tags .field__label,
+.field--name-field-tags ul.links {
+  font-size: 0.8em;
+}
+.node--view-mode-teaser .field--name-field-tags .field__label,
+.node--view-mode-teaser .field--name-field-tags ul.links {
+  font-size: 0.821em;
+}
+.field--name-field-tags ul.links {
+  margin: 0;
+  padding: 0;
+}
+.field--name-field-tags ul.links li {
+  float: left; /* LTR */
+  padding: 0 1em 0 0; /* LTR */
+  white-space: nowrap;
+}
+[dir="rtl"] .field--name-field-tags ul.links li {
+  float: right;
+  padding: 0 0 0 1em;
+}
+
+/**
+ * @file
+ * Visual styles for Bartik's blocks.
+ */
+
+/* Block has its own content wrapper. */
+.block .content {
+  margin-top: 10px;
+}
+
+/*
+ * @file
+ * Provides the layout styles for layout_onecol.
+ */
+.layout--onecol .layout__region {
+  width: 100%;
+}
+
+blockquote {
+  margin: 1.5em 10px;
+  padding: 0.5em 10px;
+  border-left: 1px solid #bbb;
+  background: #f7f7f7;
+  font-style: italic;
+}
+blockquote:before {
+  margin-right: 0.2em;
+  content: "\201C";
+  vertical-align: -0.4em;
+  color: #bbb;
+  font-size: 3em;
+  line-height: 0.1em;
+}
+blockquote .small:before,
+blockquote footer:before,
+blockquote small:before {
+  content: "\2014 \00A0";
+}
+@media (min-width: 768px) {
+  .cmp-cols.cols-md-2
+    .field__items
+    > *:not([class*=" col"]):not([class^="col"]),
+  .cmp-cols.cols-md-2
+    > *:not([class*=" col"]):not([class^="col"]):not(.field__items) {
+    -webkit-box-flex: 0;
+    flex: 0 0 50%;
+    max-width: 50%;
+  }
+}
+
+//END OF DRUPAL MARKUP STYLES
+
+#page {
+  .cmp-servicescards__cardcontainer {
+    .field__items {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: space-between;
+
+      > .field__item {
+        @media (min-width: 992px) {
+          flex: 0 0 28%;
+        }
+        .field.field--name-image.field--type-image.field--label-hidden.field__item {
+          margin: 0;
+        }
+        @media (max-width: 999px) {
+          .cmp-servcard {
+            width: 100%;
+          }
+        }
+      }
+    }
+
+    @media (min-width: 992px) {
+      .cmp-servcard,
+      .last-card {
+        min-width: 100%;
+      }
+    }
+  }
+
+  .cmp-brandingcard {
+    .clearfix.text-formatted.field.field--name-field-brand-body.field--type-text-long.field--label-hidden.field__item
+      p {
+      opacity: 0.6;
+      font-size: 0.875rem;
+    }
+    .field--name-image {
+      @extend .mx-auto;
+      .cmp-image {
+        @media (max-width: 999px) {
+          width: 50%;
+        }
+      }
+    }
+  }
+
+  .cmp-testimonial {
+    blockquote {
+      margin: 0 0 1rem;
+      padding: 0;
+      border-left: none;
+      background: white;
+      font-style: normal;
+    }
+    blockquote:before {
+      content: none;
+    }
+  }
+
+  .cmp-shadow-box-quote {
+    align-self: center;
+  }
+
+  .cmp-shadow-box-img {
+    // .field--name-field-testimonial-desk-image {
+
+    //     .field--name-image{
+    //         max-width: 100%;
+    //     }
+    // }
+  }
+
+  .cmp-image {
+    max-width: 100%;
+  }
+  .cmp-latest {
+    .container {
+      @media (min-width: 992px) {
+        max-width: 1200px;
+        padding: 0;
+      }
+    }
+    .cmp-latestcards__cardcontainer {
+      width: 100%;
+      .cmp-latestcard {
+        width: 100%;
+      }
+      .cmp-latestcard:hover {
+        box-shadow: none;
+      }
+      .cmp-latestcard:hover .cmp-imageblue .cmp-image {
+        opacity: 0.5;
+      }
+      .cmp-latestcard:hover .cmp-cardlink {
+        text-decoration: none;
+        cursor: pointer;
+        border-bottom: none;
+      }
+      .row {
+        display: grid;
+      }
+      .col-xs-12.col-sm-12.col-md-6.col-lg-6 {
+        width: 100%;
+        max-width: 100%;
+        padding: 0;
+        .cmp-latestcard {
+          .cmp-latestcard-content {
+            .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item {
+              flex: 0 0 100%;
+              max-width: 100%;
+              display: flex;
+              flex-wrap: wrap;
+              margin: 0;
+            }
+          }
+          .field__item {
+            @media (min-width: 992px) {
+              display: inline-flex;
+              flex: 0 0 45%;
+              max-width: 45%;
+              margin: 0 1.5rem;
+              padding: 0;
+              .heading-title
+                .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item {
+                min-width: 140px;
+              }
+              button.heading-link:hover {
+                border: none;
+              }
+            }
+          }
+          .field__item:hover {
+            box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+          }
+          .field__item:hover .cmp-imageblue .cmp-image {
+            opacity: 1;
+            transition: 0.3;
+          }
+          .field__item:hover .cmp-cardlink {
+            border-bottom: 2px solid #f16824;
+          }
+          .cmp-imageblue.bg-primary
+            .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item,
+          .cmp-imageblue.bg-primary
+            .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item
+            .field.field--name-image.field--type-image.field--label-hidden.field__item,
+          .cmp-latestcard__content
+            .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+          .cmp-text
+            .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+          .cmp-cardlink
+            .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item {
+            flex: 0 0 100%;
+            max-width: 100%;
+            margin: 0;
+          }
+          .cmp-text
+            .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover {
+            box-shadow: none;
+          }
+          .cmp-cardlink
+            .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item
+            a:hover {
+            text-decoration: none;
+            color: #1b3d6e;
+          }
+        }
+      }
+      .more-new.d-none.d-md-block {
+        width: 100%;
+      }
+      .more-news a {
+        color: white;
+      }
+      .more-news a:hover {
+        text-decoration: none;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/demo01172020/demo01172020.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/pages/demo01172020/demo01172020.scss
+                
    • 
+                
  • 
+                    Size:
+                    9.8 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/drupalitemsfacade.html b/components/detail/drupalitemsfacade.html
new file mode 100644
index 0000000..4f3b850
--- /dev/null
+++ b/components/detail/drupalitemsfacade.html
@@ -0,0 +1,2045 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+drupalitemsfacade component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            drupalitemsfacade component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+	{{items}}
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an drupalitemsfacade component!",
+  "heading": "My heading"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Drupalitemsfacade
+ */
+
+/* STARTER CODE
+
+class Drupalitemsfacade {
+    constructor($inst) {
+        cponsole.log('Initializing Drupalitemsfacade')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/drupalitemsfacade/drupalitemsfacade.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/drupalitemsfacade/drupalitemsfacade.js
+                
    • 
+                
  • 
+                    Size:
+                    208 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Drupalitemsfacade
+ */
+
+.cmp-drupalitemsfacade {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/drupalitemsfacade/drupalitemsfacade.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/drupalitemsfacade/drupalitemsfacade.scss
+                
    • 
+                
  • 
+                    Size:
+                    71 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/footer.html b/components/detail/footer.html
new file mode 100644
index 0000000..9765bea
--- /dev/null
+++ b/components/detail/footer.html
@@ -0,0 +1,2646 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+footer component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            footer component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-footer skew-0">
+    <div class="cmp-footer__main row">
+        <div class="cmp-footer__main-lists-continer card-columns col-lg-8">
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Products
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            ALLDATA Repair
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDTA Collision</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Mobile</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Diagnostics</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Tech-Assits</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Manage Online</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Shop Manager</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Support
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">Popular Topics</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Product Support</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Account Support</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Training & Certificacions</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Resources
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">Product Resources</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Teach tips</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA News</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    About Us
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">Partners </a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Press</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Carrers</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Contact us
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">800-697-2533</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Email Customer Support</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Request a Demo </a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">More Options</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Related sites
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">ALLDATA Mexico</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDTA Canada</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Europe</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA DIY</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">AutoZone</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+        </div>
+
+        <div class="cmp-footer__main-social col-lg-4 p-lg-0">
+            <p class="cmp-text">
+                Sign up to receive email updates
+            </p>
+            <img src="../../images/updateArrow.svg" alt="Sing Up">
+            <div class="cmp-footer__social-media">
+                <p class="cmp-text">
+                    Follow Us
+                </p>
+                <a class="mr-3" href="www.youtube.com">
+
+
+
+
+    <img class="cmp-image " src="/images/socialyt.svg" alt="visit our channel!">
+
+</a>
+                <a class="mr-3" href="www.linkedin.com">
+
+
+
+
+    <img class="cmp-image " src="/images/sociallink.svg" alt="visit our channel!">
+
+</a>
+                <a class="mr-3" href="www.twitter.com">
+
+
+
+
+    <img class="cmp-image " src="/images/socialtw.svg" alt="visit our channel!">
+
+</a>
+                <a class="mr-3" href="www.instagram.com">
+
+
+
+
+    <img class="cmp-image " src="/images/socialins.svg" alt="visit our channel!">
+
+</a>
+            </div>
+        </div>
+    </div>
+    <div class="cmp-footer__secondary">
+        <ul>
+            <li class="mr-lg-5"><a href="link">© 2019 ALLDATA</a></li>
+            <li class="mr-lg-5"><a href="link">An <strong>AutoZone</strong> Company</a></li>
+            <li class="mr-lg-5"><a href="link">Trademarks</a></li>
+            <li class="mr-lg-5"><a href="link">Terms of Use</a></li>
+            <li class="mr-lg-5"><a href="link">Privacy Policy</a></li>
+        </ul>
+        <div>
+        </div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-footer skew-0">
+    <div class="cmp-footer__main row">
+        <div class="cmp-footer__main-lists-continer card-columns col-lg-8">
+            {% for menu in footerMenu %}
+                {% include "@collapse-list" with menu %}
+            {% endfor %}
+        </div>
+       
+        <div class="cmp-footer__main-social col-lg-4 p-lg-0">
+            {% include "@simpletext" with {text:singUpMessage} %}
+            <img src="{{'/images/updateArrow.svg' |path}}" alt="Sing Up">
+             {% if socialMedia %}
+             <div class="cmp-footer__social-media">
+                {% include "@simpletext" with {text:"Follow Us"} %}
+                {% for media in socialLinks %}
+                    {% if media.mediaAvaliable %}
+                       <a class="mr-3" href="{{media.link}}">{% include "@image" with {src:media.logo,alt: media.message} %}</a>
+                    {% endif %}
+                {% endfor %}
+             </div>
+            {% endif %}
+        </div>
+    </div>
+    <div class="cmp-footer__secondary">
+        <ul>
+            {% for item in subfooterList %}
+            <li class="mr-lg-5"><a href="{{item.link}}">{{item.text}}</a></li>
+            {% endfor %}
+        </ul>
+    <div>
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "footerMenu": [
+    {
+      "listTitle": "Products",
+      "listContents": [
+        {
+          "listText": "ALLDATA Repair"
+        },
+        {
+          "listText": "ALLDTA Collision",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDATA Mobile",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDATA Diagnostics",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDATA Tech-Assits",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDATA Manage Online",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDATA Shop Manager",
+          "listLink": "www.google.com"
+        }
+      ]
+    },
+    {
+      "listTitle": "Support",
+      "listContents": [
+        {
+          "listText": "Popular Topics",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "Product Support",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "Account Support",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "Training & Certificacions",
+          "listLink": "www.google.com"
+        }
+      ]
+    },
+    {
+      "listTitle": "Resources",
+      "listContents": [
+        {
+          "listText": "Product Resources",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "Teach tips",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDATA News",
+          "listLink": "www.google.com"
+        }
+      ]
+    },
+    {
+      "listTitle": "About Us",
+      "listContents": [
+        {
+          "listText": "Partners ",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "Press",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "Carrers",
+          "listLink": "www.google.com"
+        }
+      ]
+    },
+    {
+      "listTitle": "Contact us",
+      "listContents": [
+        {
+          "listText": "800-697-2533",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "Email Customer Support",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "Request a Demo ",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "More Options",
+          "listLink": "www.google.com"
+        }
+      ]
+    },
+    {
+      "listTitle": "Related sites",
+      "listContents": [
+        {
+          "listText": "ALLDATA Mexico",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDTA Canada",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDATA Europe",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "ALLDATA DIY",
+          "listLink": "www.google.com"
+        },
+        {
+          "listText": "AutoZone",
+          "listLink": "www.google.com"
+        }
+      ]
+    }
+  ],
+  "singUpMessage": "Sign up to receive email updates ",
+  "socialMedia": true,
+  "socialLinks": [
+    {
+      "mediaAvaliable": true,
+      "link": "www.youtube.com",
+      "logo": "/images/socialyt.svg",
+      "message": "visit our channel!"
+    },
+    {
+      "mediaAvaliable": false,
+      "link": "www.facebook.com",
+      "logo": "/images/socialfb.svg",
+      "message": "visit our channel!"
+    },
+    {
+      "mediaAvaliable": true,
+      "link": "www.linkedin.com",
+      "logo": "/images/sociallink.svg",
+      "message": "visit our channel!"
+    },
+    {
+      "mediaAvaliable": true,
+      "link": "www.twitter.com",
+      "logo": "/images/socialtw.svg",
+      "message": "visit our channel!"
+    },
+    {
+      "mediaAvaliable": true,
+      "link": "www.instagram.com",
+      "logo": "/images/socialins.svg",
+      "message": "visit our channel!"
+    }
+  ],
+  "subfooterList": [
+    {
+      "text": "© 2019 ALLDATA",
+      "link": "link"
+    },
+    {
+      "text": "An <strong>AutoZone</strong> Company",
+      "link": "link"
+    },
+    {
+      "text": "Trademarks",
+      "link": "link"
+    },
+    {
+      "text": "Terms of Use",
+      "link": "link"
+    },
+    {
+      "text": "Privacy Policy",
+      "link": "link"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Footer
+ */
+
+/* STARTER CODE
+
+class Footer {
+    constructor($inst) {
+        cponsole.log('Initializing Footer')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/footer/footer.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/footer/footer.js
+                
    • 
+                
  • 
+                    Size:
+                    174 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Footer
+ */
+
+.cmp-footer {
+  color: white;
+  
+  &__main{
+    width: 100%;
+    margin: 0;
+    padding: 40px 15px;
+    background-color: #1b3e6f;
+
+    .cmp-footer__main-lists-continer.card-columns{
+      column-count: 1;
+      margin-bottom: 50px;
+    }
+  }
+  &__secondary{
+    background-color: #1d3359; 
+  }
+  &__main-social{
+    font-size: 14px;
+    letter-spacing: 0.18px;
+    text-transform: uppercase;
+    .cmp-text{
+      width: 280px;
+      display: inline-block;
+    }
+  }
+  &__social-media{
+    margin-top: 25px;
+    .cmp-text{
+      width: 100%;
+
+    }
+  }
+  &__secondary{
+    padding: 40px 0px 15px;
+    font-size: 12px;
+    font-weight: 300;
+    text-align: center;
+    ul{
+      padding: 0px;
+      margin: 0px;
+    }
+    li{
+      list-style: none;
+      margin-bottom: 25px;
+      
+    }
+    a{
+      color: white;
+    }
+    a:hover{
+      text-decoration: none;
+      cursor: pointer;
+    }
+
+  }
+}
+
+@include  media-breakpoint-up(lg){
+  .cmp-footer {
+    &__main{
+      padding: 40px 20px;
+      .cmp-footer__main-lists-continer.card-columns{
+        column-count: 4;
+        margin-bottom: 0px;
+        .cmp-collapse-list{
+          display: inline-block;
+          .cmp-collapse-list__title{
+            margin-bottom: 20px;
+          }
+          .cmp-collapse-list__content li{
+            margin-bottom: 10px;
+          }
+        }
+      }
+    }
+    &__secondary{
+      padding: 20px 40px 40px;
+      text-align: left;
+      
+      li {
+        margin-bottom: 0;
+        float: left;
+      }
+    }
+  }
+
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/footer/footer.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/footer/footer.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.5 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/header.html b/components/detail/header.html
new file mode 100644
index 0000000..e082789
--- /dev/null
+++ b/components/detail/header.html
@@ -0,0 +1,3728 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+header component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            header component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
+<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
+<header class="cmp-header">
+
+    <!-- DESKTOP -->
+    <div class="cmp-header__desktop d-none d-lg-block">
+        <div class="cmp-header__nav-setup">
+            <nav class="navbar navbar-expand-lg mx-lg-3">
+                <div class="collapse navbar-collapse" id="nav-setup">
+                    <ul class="navbar-nav ml-auto">
+                        <li class="nav-setup-item nav-item ml-lg-3">
+                            <a class="nav-link">
+                                    800-697-2533
+                                </a>
+                        </li>
+                        <li class="nav-setup-item nav-item ml-lg-3">
+                            <a class="nav-link">
+                                    CONTACT A REP
+                                </a>
+                        </li>
+                        <li class="nav-setup-item nav-item dropdown ml-lg-3">
+                            <a class="nav-link dropdown-toggle" id="US" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                    US
+                                </a>
+                            <div class="dropdown-menu" aria-labelledby="US">
+                                <a class="dropdown-item px-2">
+                                        Canada
+                                    </a>
+                                <a class="dropdown-item px-2">
+                                        Europe
+                                    </a>
+                                <a class="dropdown-item px-2">
+                                        Mexico
+                                    </a>
+                                <a class="dropdown-item px-2">
+                                        US
+                                    </a>
+                            </div>
+                        </li>
+                        <li class="nav-setup-item nav-item dropdown ml-lg-3">
+                            <a class="nav-link dropdown-toggle" id="ENGLISH" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                    ENGLISH
+                                </a>
+                            <div class="dropdown-menu" aria-labelledby="ENGLISH">
+                                <a class="dropdown-item px-2">
+                                        English
+                                    </a>
+                                <a class="dropdown-item px-2">
+                                        Español
+                                    </a>
+                                <a class="dropdown-item px-2">
+                                        Français
+                                    </a>
+                            </div>
+                        </li>
+                        <li class="nav-setup-item nav-item ml-lg-3">
+                            <a class="nav-link">
+                                    LOGIN
+                                </a>
+                        </li>
+                    </ul>
+                </div>
+            </nav>
+        </div>
+        <div class="cmp-header__nav-menu">
+            <nav class="navbar navbar-expand-lg" role="navigation" aria-label="main navigation">
+                <div class="logo">
+                    <a class="navbar-brand" href="/"><img src="/images/logo.png"></a>
+                    <hr class="sublogo">
+                </div>
+
+                <div id="nav-menu" class="navbar-menu navbar-collapse">
+                    <ul class="nav navbar-nav" role="menu">
+                        <li class="nav-menu-item nav-item pl-lg-1 pr-lg-4 px-xl-4 has-dropdown" role="presentation">
+                            <a href="" class="nav-link has-dropdown" id="PRODUCTS" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" tabindex="0">
+                                    PRODUCTS
+                                </a>
+                            <div class="nav-submenu" id="PRODUCTS-submenu" aria-labelledby="PRODUCTS" aria-hidden="true">
+                                <div class="col-lg-1"></div>
+                                <div class="card-columns col-lg-9 mt-lg-5">
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">Repair Information</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">ALLDATA Repair</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Collision</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Mobile</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">Diagnostics</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">ALLDATA Manage Onlie</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Diagnostics</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Tech-Assist</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">shop management</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">ALLDATA Manage Onlie</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Titan</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <img src="/images/workshop.png" alt="What's Right For My Shop">
+                                        <h6><a href="" class="submenu-title">What's Right For My Shop</a></h6>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <img src="/images/workshop.png" alt="Testimonials">
+                                        <h6><a href="" class="submenu-title">Testimonials</a></h6>
+                                    </div>
+
+                                </div>
+
+                            </div>
+                        </li>
+                        <li class="nav-menu-item nav-item pl-lg-1 pr-lg-4 px-xl-4 has-dropdown" role="presentation">
+                            <a href="" class="nav-link has-dropdown" id="SUPPORT" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" tabindex="0">
+                                    SUPPORT
+                                </a>
+                            <div class="nav-submenu" id="SUPPORT-submenu" aria-labelledby="SUPPORT" aria-hidden="true">
+                                <div class="col-lg-1"></div>
+                                <div class="card-columns col-lg-9 mt-lg-5">
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">Popular Topics</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">Getting Started</a></li>
+                                            <li><a href="" class="submenu-link">Recover User Name or Password</a></li>
+                                            <li><a href="" class="submenu-link">Vehicle Information Request</a></li>
+                                            <li><a href="" class="submenu-link">Login Center</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">product support</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">ALLDATA Repair</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Collision</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Mobile</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Manage Onlie</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Diagnostics</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Tech-Assist</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">Account & billing support</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">Billing Options</a></li>
+                                            <li><a href="" class="submenu-link">Account Options</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">Training & certifications</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">Product Training</a></li>
+                                            <li><a href="" class="submenu-link">Traninig Videos</a></li>
+                                            <li><a href="" class="submenu-link">On-Demand Webinars</a></li>
+                                            <li><a href="" class="submenu-link">CAIS Certificaiton Program</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">Contact customer support</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">800-859-3282</a></li>
+                                        </ul>
+                                    </div>
+
+                                </div>
+
+                            </div>
+                        </li>
+                        <li class="nav-menu-item nav-item pl-lg-1 pr-lg-4 px-xl-4 has-dropdown" role="presentation">
+                            <a href="" class="nav-link has-dropdown" id="RESOURCES" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" tabindex="0">
+                                    RESOURCES
+                                </a>
+                            <div class="nav-submenu" id="RESOURCES-submenu" aria-labelledby="RESOURCES" aria-hidden="true">
+                                <div class="col-lg-1"></div>
+                                <div class="card-columns col-lg-9 mt-lg-5">
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">product resources</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">ALLDATA Repair</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Collision</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Mobile</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Manage Onlie</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Diagnostics</a></li>
+                                            <li><a href="" class="submenu-link">ALLDATA Tech-Assist</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">ALLDATA news by topic</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">General Auto Repair</a></li>
+                                            <li><a href="" class="submenu-link">Collision Auto Repair</a></li>
+                                            <li><a href="" class="submenu-link">Shop Management</a></li>
+                                            <li><a href="" class="submenu-link">Best Practices</a></li>
+                                            <li><a href="" class="submenu-link">Training</a></li>
+                                            <li><a href="" class="submenu-link">News</a></li>
+                                            <li><a href="" class="submenu-link">Events</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">ALLDATA News</a></h6>
+                                        <ul>
+                                            <li><a href="" class="submenu-link">Latest Edition</a></li>
+                                        </ul>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">Tech Tips</a></h6>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">Industry Webinars</a></h6>
+                                    </div>
+
+                                </div>
+
+                            </div>
+                        </li>
+                        <li class="nav-menu-item nav-item pl-lg-1 pr-lg-4 px-xl-4 has-dropdown" role="presentation">
+                            <a href="" class="nav-link has-dropdown" id="ABOUT US" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" tabindex="0">
+                                    ABOUT US
+                                </a>
+                            <div class="nav-submenu" id="ABOUT US-submenu" aria-labelledby="ABOUT US" aria-hidden="true">
+                                <div class="col-lg-1"></div>
+                                <div class="col-lg-4 mt-lg-5">
+                                    <img src="/images/team.png" alt="ABOUT US">
+                                </div>
+
+                                <div class="col-lg-4 mt-lg-5">
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">ALLDATA LEADERSHIP</a></h6>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">PARNERS</a></h6>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">PRESS</a></h6>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">CARRERS</a></h6>
+                                    </div>
+
+                                    <div class="nav-group">
+
+                                        <h6><a href="" class="submenu-title">CONTACT</a></h6>
+                                    </div>
+
+                                </div>
+
+                            </div>
+                        </li>
+                        <li class="nav-menu-item nav-item pl-lg-1 pr-lg-4 px-xl-4 no-dropdown">
+                            <a href="" class="nav-link no-submenu">
+                                    BUY NOW
+                                </a>
+                        </li>
+                    </ul>
+                </div>
+                <div class="navbar-end float-right">
+                    <span role="button" class="icon icon-seach mr-lg-3">
+                    
+
+
+
+
+    <img class="cmp-image " src="/images/search.svg" alt="Search">
+
+                    </span>
+                    <span role="button" class="icon icon-cart mr-lg-5">
+                    
+
+
+
+
+    <img class="cmp-image " src="/images/cart.svg" alt="Cart">
+
+                    </span>
+                </div>
+            </nav>
+        </div>
+        <div class="blue-filler d-none"></div>
+    </div>
+    <!-- MOBILE -->
+    <div class="cmp-header__mobile d-lg-none">
+        <div class="mobile-header">
+            <a role="button" class="navbar-item burger-icon p-0 col-1">
+
+
+
+
+    <img class="cmp-image " src="/images/burguermenu.svg" alt="Menu">
+
+</a>
+            <a class="navbar-item logo col-7 mr-3 mr-md-5" href="/">
+
+
+
+
+    <img class="cmp-image " src="/images/logo.png" alt="ALLDATA Logo"    >
+
+    
+    
+
+</a>
+            <a role="button" class="navbar-item cart-icon col-1 p-0 float-right">
+
+
+
+
+    <img class="cmp-image " src="/images/cart.svg" alt="Cart">
+
+</a>
+            <a role="button" class="navbar-item search-icon col-1 mr-2 mr-md-3 p-0 float-right">
+
+
+
+
+    <img class="cmp-image " src="/images/search.svg" alt="Search">
+
+</a>
+            <hr class="sublogo">
+        </div>
+        <div class="cmp-header-mobile__nav-setup">
+            <nav class="navbar">
+                <ul class="navbar-menu">
+                    <div class="menu-head">
+                        <span role="button" class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                    </div>
+                    <li class="main-navbar-item">
+                        <a href="#">PRODUCTS 
+                                                            
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/menu_go.svg" alt="PRODUCTS">
+
+                                                        </a>
+                    </li>
+                    <div class="submenu-navbar">
+                        <div class="menu-head">
+                            <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                            <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                        </div>
+                        <ul>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Repair Information
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Repair Information">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Repair Information">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Repair</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Collision</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Mobile</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Diagnostics
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Diagnostics">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Diagnostics">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Manage Onlie</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Diagnostics</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Tech-Assist</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">shop management
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="shop management">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="shop management">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Manage Onlie</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Titan</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">What's Right For My Shop
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="What's Right For My Shop">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="What's Right For My Shop">
+                                <ul>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Testimonials
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Testimonials">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Testimonials">
+                                <ul>
+
+                                </ul>
+                            </div>
+
+                        </ul>
+                    </div>
+                    <li class="main-navbar-item">
+                        <a href="#">SUPPORT 
+                                                            
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/menu_go.svg" alt="SUPPORT">
+
+                                                        </a>
+                    </li>
+                    <div class="submenu-navbar">
+                        <div class="menu-head">
+                            <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                            <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                        </div>
+                        <ul>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Popular Topics
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Popular Topics">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Popular Topics">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Getting Started</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Recover User Name or Password</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Vehicle Information Request</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Login Center</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">product support
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="product support">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="product support">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Repair</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Collision</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Mobile</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Manage Onlie</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Diagnostics</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Tech-Assist</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Account & billing support
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Account & billing support">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Account & billing support">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Billing Options</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Account Options</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Training & certifications
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Training & certifications">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Training & certifications">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Product Training</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Traninig Videos</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">On-Demand Webinars</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">CAIS Certificaiton Program</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Contact customer support
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Contact customer support">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Contact customer support">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">800-859-3282</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+
+                        </ul>
+                    </div>
+                    <li class="main-navbar-item">
+                        <a href="#">RESOURCES 
+                                                            
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/menu_go.svg" alt="RESOURCES">
+
+                                                        </a>
+                    </li>
+                    <div class="submenu-navbar">
+                        <div class="menu-head">
+                            <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                            <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                        </div>
+                        <ul>
+                            <li class="submenu-navbar-item">
+                                <a href="#">product resources
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="product resources">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="product resources">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Repair</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Collision</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Mobile</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Manage Onlie</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Diagnostics</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">ALLDATA Tech-Assist</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">ALLDATA news by topic
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="ALLDATA news by topic">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="ALLDATA news by topic">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">General Auto Repair</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Collision Auto Repair</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Shop Management</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Best Practices</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Training</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">News</a>
+                                    </li>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Events</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">ALLDATA News
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="ALLDATA News">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="ALLDATA News">
+                                <ul>
+                                    <li class="lastLevel-navbar-item">
+                                        <a href="#">Latest Edition</a>
+                                    </li>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Tech Tips
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Tech Tips">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Tech Tips">
+                                <ul>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Industry Webinars
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="Industry Webinars">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="Industry Webinars">
+                                <ul>
+
+                                </ul>
+                            </div>
+
+                        </ul>
+                    </div>
+                    <li class="main-navbar-item">
+                        <a href="#">ABOUT US 
+                                                            
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/menu_go.svg" alt="ABOUT US">
+
+                                                        </a>
+                    </li>
+                    <div class="submenu-navbar">
+                        <div class="menu-head">
+                            <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                            <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                        </div>
+                        <ul>
+                            <li class="submenu-navbar-item">
+                                <a href="#">ALLDATA LEADERSHIP
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="ALLDATA LEADERSHIP">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="ALLDATA LEADERSHIP">
+                                <ul>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">PARNERS
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="PARNERS">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="PARNERS">
+                                <ul>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">PRESS
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="PRESS">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="PRESS">
+                                <ul>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">CARRERS
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="CARRERS">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="CARRERS">
+                                <ul>
+
+                                </ul>
+                            </div>
+                            <li class="submenu-navbar-item">
+                                <a href="#">CONTACT
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/submenuclosed.svg" alt="CONTACT">
+
+</a>
+                            </li>
+                            <div class="lastLevel-navbar" id="CONTACT">
+                                <ul>
+
+                                </ul>
+                            </div>
+
+                        </ul>
+                    </div>
+                    <li class="main-navbar-item">
+                        <a href="#">BUY NOW 
+                                                        </a>
+                    </li>
+                    <div class="submenu-navbar">
+                        <div class="menu-head">
+                            <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                            <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                        </div>
+                        <ul>
+
+                        </ul>
+                    </div>
+                    <li class="secondary-navbar-item">
+                        <a href="">
+                                    800-697-2533
+                                </a>
+                    </li>
+                    <li class="secondary-navbar-item">
+                        <a href="">
+                                    CONTACT A REP
+                                </a>
+                    </li>
+                    <li class="main-navbar-item">
+                        <a href="#">US
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/menu_go.svg" alt="US">
+
+</a>
+                    </li>
+                    <div class="submenu-navbar">
+                        <div class="menu-head">
+                            <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                            <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                        </div>
+                        <ul>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Canada</a>
+                            </li>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Europe</a>
+                            </li>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Mexico</a>
+                            </li>
+                            <li class="submenu-navbar-item">
+                                <a href="#">US</a>
+                            </li>
+
+                        </ul>
+                    </div>
+                    <li class="main-navbar-item">
+                        <a href="#">ENGLISH
+
+
+
+
+    <img class="cmp-image  float-right " src="/images/menu_go.svg" alt="ENGLISH">
+
+</a>
+                    </li>
+                    <div class="submenu-navbar">
+                        <div class="menu-head">
+                            <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                            <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                        </div>
+                        <ul>
+                            <li class="submenu-navbar-item">
+                                <a href="#">English</a>
+                            </li>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Español</a>
+                            </li>
+                            <li class="submenu-navbar-item">
+                                <a href="#">Français</a>
+                            </li>
+
+                        </ul>
+                    </div>
+                    <li class="secondary-navbar-item">
+                        <a href="">
+                                    LOGIN
+                                </a>
+                    </li>
+                </ul>
+            </nav>
+        </div>
+    </div>
+</header>

+        
+    
+

+
+    
+    

+    
+        
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
+<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
+<header class="cmp-header">
+   
+    <!-- DESKTOP -->
+    <div class="cmp-header__desktop d-none d-lg-block">
+        <div class="cmp-header__nav-setup">
+            <nav class="navbar navbar-expand-lg mx-lg-3">
+                <div class="collapse navbar-collapse" id="nav-setup">
+                    <ul class="navbar-nav ml-auto">
+                        {% for menu in menusSetup %}
+                            {% if menu.submenus.length %}
+                            <li class="nav-setup-item nav-item dropdown ml-lg-3">
+                                <a class="nav-link dropdown-toggle" id="{{menu.name}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                    {{menu.name}}
+                                </a>
+                                <div class="dropdown-menu" aria-labelledby="{{menu.name}}">
+                                    {% for submenu in menu.submenus %}
+                                    <a class="dropdown-item px-2">
+                                        {{submenu}}
+                                    </a>
+                                    {% endfor %}
+                                </div>
+                            </li>
+                            {% else %}
+                            <li class="nav-setup-item nav-item ml-lg-3">
+                                <a class="nav-link">
+                                    {{menu.name}}
+                                </a>
+                            </li>
+                            {% endif %}
+                        {% endfor %}
+                    </ul>
+                </div>
+            </nav>
+        </div>
+        <div class="cmp-header__nav-menu">
+            <nav class="navbar navbar-expand-lg" role="navigation" aria-label="main navigation">
+                <div class="logo">
+                    <a class="navbar-brand" href="/"><img src="/images/logo.png"></a>
+                    <hr class="sublogo">
+                </div>
+                
+                <div id="nav-menu" class="navbar-menu navbar-collapse">
+                    <ul class="nav navbar-nav" role="menu">
+                        {% for menu in menus %}
+                            {% if menu.submenus.length %}
+                            <li class="nav-menu-item nav-item pl-lg-1 pr-lg-4 px-xl-4 has-dropdown" role="presentation">
+                                <a href="" class="nav-link has-dropdown" id="{{menu.name}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" tabindex="0">
+                                    {{menu.name}}
+                                </a>
+                                <div class="nav-submenu" id="{{menu.name}}-submenu" aria-labelledby="{{menu.name}}" aria-hidden="true">
+                                    <div class="col-lg-1"></div>
+                                    {% if menu.image %}
+                                    <div class="col-lg-4 mt-lg-5">
+                                        <img src="{{menu.image}}" alt="{{menu.name}}">
+                                    </div>
+                                    
+                                    {% endif %}
+                                    {% if menu.name == "ABOUT US" %}
+                                        <div class="col-lg-4 mt-lg-5">
+                                    {% else %}
+                                        <div class="card-columns col-lg-9 mt-lg-5">
+                                    {% endif %}
+                                    
+                                    {% for submenu in menu.submenus %}
+                                        <div class="nav-group">
+                                            {# {% include "@image" with {src:submenu.image, alt:submenu.name} %} #}
+                                            {% if submenu.topicImage %}
+                                            <img src="{{submenu.topicImage}}" alt="{{submenu.name}}">
+                                            {% endif %}
+                                            <h6><a href="" class="submenu-title">{{submenu.name}}</a></h6>
+                                            {% if submenu.submenus.length %}
+                                            <ul>
+                                            {% for topic in submenu.submenus %}
+                                                <li><a href="" class="submenu-link">{{topic}}</a></li>
+                                            {% endfor %}
+                                            </ul>
+                                            {% endif %}
+                                        </div>
+                                        
+                                    {% endfor %}
+                                    </div>
+                                    
+                                    
+                                    
+                                </div>
+                            </li>
+                            {% else %}
+                            <li class="nav-menu-item nav-item pl-lg-1 pr-lg-4 px-xl-4 no-dropdown">
+                                <a href="" class="nav-link no-submenu">
+                                    {{menu.name}}
+                                </a>
+                            </li>
+                            {% endif %}
+                        {% endfor %}
+                    </ul>
+                </div>
+                <div class="navbar-end float-right">
+                    <span role="button" class="icon icon-seach mr-lg-3">
+                    {% include "@image" with {src: "/images/search.svg", alt:"Search"}%}
+                    </span>
+                    <span role="button" class="icon icon-cart mr-lg-5">
+                    {% include "@image" with {src: "/images/cart.svg", alt:"Cart"}%}
+                    </span>
+                </div>
+            </nav>
+        </div>
+        <div class="blue-filler d-none"></div>
+    </div>
+    <!-- MOBILE -->
+    <div class="cmp-header__mobile d-lg-none">
+        <div class="mobile-header">
+            <a role="button" class="navbar-item burger-icon p-0 col-1">{% include "@image" with {src: "/images/burguermenu.svg", alt:"Menu"}%}</a>
+            <a class="navbar-item logo col-7 mr-3 mr-md-5" href="/">{% include "@image" with {src: "/images/logo.png", alt:"ALLDATA Logo"}%}</a>
+            <a role="button" class="navbar-item cart-icon col-1 p-0 float-right">{% include "@image" with {src: "/images/cart.svg", alt:"Cart"}%}</a>
+            <a role="button" class="navbar-item search-icon col-1 mr-2 mr-md-3 p-0 float-right">{% include "@image" with {src: "/images/search.svg", alt:"Search"}%}</a>
+            <hr class="sublogo">
+        </div>
+        <div class="cmp-header-mobile__nav-setup">
+            <nav class="navbar">
+                <ul class="navbar-menu">
+                    <div class="menu-head">
+                        <span role="button" class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                    </div>
+                    {% for menu in menus %}
+                        <li class="main-navbar-item">
+                            <a href="#">{{menu.name}} 
+                            {% if menu.name != "BUY NOW"  %}
+                                {% include "@image" with {classes:"float-right", src:"/images/menu_go.svg", alt:menu.name }%}
+                            {% endif %}
+                            </a>
+                        </li>
+                        <div class="submenu-navbar">
+                            <div class="menu-head">
+                                <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                                <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                            </div>
+                            <ul>
+                                {% for submenu in menu.submenus %}
+                                    <li class="submenu-navbar-item">
+                                        <a href="#">{{submenu.name}}{% include "@image" with {classes:"float-right", src:"/images/submenuclosed.svg", alt:submenu.name }%}</a> 
+                                    </li>
+                                    <div class="lastLevel-navbar" id="{{submenu.name}}">
+                                        <ul>
+                                            {% for submenu in submenu.submenus %}
+                                                <li class="lastLevel-navbar-item">
+                                                    <a href="#">{{submenu}}</a>
+                                                </li>
+                                            {% endfor %} 
+                                        </ul>
+                                    </div>
+                                {% endfor %} 
+                            </ul>
+                        </div>
+                    {% endfor %}
+                    {% for menu in menusSetup %}
+                        {% if menu.submenus.length %}
+                            <li class="main-navbar-item">
+                                <a href="#">{{menu.name}}{% include "@image" with {classes:"float-right", src:"/images/menu_go.svg", alt:menu.name }%}</a>
+                            </li>
+                            <div class="submenu-navbar">
+                                <div class="menu-head">
+                                    <span class="menu-back"><img src="/images/menu-back.svg" alt="back"></span>
+                                    <span class="close-menu"><img src="/images/closemenu.svg" alt="close"></span>
+                                </div>
+                                <ul>
+                                    {% for submenu in menu.submenus %}
+                                        <li class="submenu-navbar-item">
+                                            <a href="#">{{submenu}}</a> 
+                                        </li>
+                                    {% endfor %} 
+                                </ul>
+                            </div>
+                        {% else %}
+                            <li class="secondary-navbar-item">
+                                <a href="">
+                                    {{menu.name}}
+                                </a>
+                            </li>
+                        {% endif %}
+                    {% endfor %}
+                </ul>
+            </nav>
+        </div>
+    </div>
+</header>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an header component!",
+  "heading": "My heading",
+  "menus": [
+    {
+      "url": "/PRODUCTS",
+      "name": "PRODUCTS",
+      "submenus": [
+        {
+          "name": "Repair Information",
+          "submenus": [
+            "ALLDATA Repair",
+            "ALLDATA Collision",
+            "ALLDATA Mobile"
+          ]
+        },
+        {
+          "name": "Diagnostics",
+          "submenus": [
+            "ALLDATA Manage Onlie",
+            "ALLDATA Diagnostics",
+            "ALLDATA Tech-Assist"
+          ]
+        },
+        {
+          "name": "shop management",
+          "submenus": [
+            "ALLDATA Manage Onlie",
+            "ALLDATA Titan"
+          ]
+        },
+        {
+          "name": "What's Right For My Shop",
+          "submenus": [],
+          "topicImage": "/images/workshop.png"
+        },
+        {
+          "name": "Testimonials",
+          "submenus": [],
+          "topicImage": "/images/workshop.png"
+        }
+      ]
+    },
+    {
+      "url": "/SUPPORT",
+      "name": "SUPPORT",
+      "submenus": [
+        {
+          "name": "Popular Topics",
+          "submenus": [
+            "Getting Started",
+            "Recover User Name or Password",
+            "Vehicle Information Request",
+            "Login Center"
+          ]
+        },
+        {
+          "name": "product support",
+          "submenus": [
+            "ALLDATA Repair",
+            "ALLDATA Collision",
+            "ALLDATA Mobile",
+            "ALLDATA Manage Onlie",
+            "ALLDATA Diagnostics",
+            "ALLDATA Tech-Assist"
+          ]
+        },
+        {
+          "name": "Account & billing support",
+          "submenus": [
+            "Billing Options",
+            "Account Options"
+          ]
+        },
+        {
+          "name": "Training & certifications",
+          "submenus": [
+            "Product Training",
+            "Traninig Videos",
+            "On-Demand Webinars",
+            "CAIS Certificaiton Program"
+          ]
+        },
+        {
+          "name": "Contact customer support",
+          "submenus": [
+            "800-859-3282"
+          ]
+        }
+      ]
+    },
+    {
+      "url": "/RESOURCES",
+      "name": "RESOURCES",
+      "submenus": [
+        {
+          "name": "product resources",
+          "submenus": [
+            "ALLDATA Repair",
+            "ALLDATA Collision",
+            "ALLDATA Mobile",
+            "ALLDATA Manage Onlie",
+            "ALLDATA Diagnostics",
+            "ALLDATA Tech-Assist"
+          ]
+        },
+        {
+          "name": "ALLDATA news by topic",
+          "submenus": [
+            "General Auto Repair",
+            "Collision Auto Repair",
+            "Shop Management",
+            "Best Practices",
+            "Training",
+            "News",
+            "Events"
+          ]
+        },
+        {
+          "name": "ALLDATA News",
+          "submenus": [
+            "Latest Edition"
+          ]
+        },
+        {
+          "name": "Tech Tips",
+          "submenus": []
+        },
+        {
+          "name": "Industry Webinars",
+          "submenus": []
+        }
+      ]
+    },
+    {
+      "url": "/ABOUT US",
+      "name": "ABOUT US",
+      "image": "/images/team.png",
+      "submenus": [
+        {
+          "name": "ALLDATA LEADERSHIP"
+        },
+        {
+          "name": "PARNERS"
+        },
+        {
+          "name": "PRESS"
+        },
+        {
+          "name": "CARRERS"
+        },
+        {
+          "name": "CONTACT"
+        }
+      ]
+    },
+    {
+      "url": "/BUY NOW",
+      "name": "BUY NOW",
+      "submenus": []
+    }
+  ],
+  "menusSetup": [
+    {
+      "url": "/call",
+      "name": "800-697-2533",
+      "submenus": []
+    },
+    {
+      "url": "/rep",
+      "name": "CONTACT A REP",
+      "submenus": []
+    },
+    {
+      "url": "/RESOURCES",
+      "name": "US",
+      "submenus": [
+        "Canada",
+        "Europe",
+        "Mexico",
+        "US"
+      ]
+    },
+    {
+      "url": "/ABOUT US",
+      "name": "ENGLISH",
+      "submenus": [
+        "English",
+        "Español",
+        "Français"
+      ]
+    },
+    {
+      "url": "/login",
+      "name": "LOGIN",
+      "submenus": []
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+import $ from "jquery";
+// DESKTOP
+if ($(window).width() > 991) {
+  var arraySubmenus = $(".nav.navbar-nav").find(".nav-submenu");
+  var arrayMenus = $(".nav.navbar-nav").find(".nav-link.has-dropdown");
+  var currentSub;
+  var currentMenu;
+  $(".navbar.navbar-expand-lg").focusin(function() {
+    var elem = $(this).find(":focus");
+    if (elem.hasClass("nav-link has-dropdown")) {
+      currentMenu = elem;
+      var submenu = elem.parent().children(".nav-submenu");
+      arraySubmenus.css({ display: "none", "z-index": 0 });
+      arraySubmenus.attr("aria-hidden", "true");
+      arrayMenus.attr("aria-expanded", "false");
+      elem.attr("aria-expanded", "true");
+      submenu.attr("aria-hidden", "false");
+      submenu.css({ display: "flex", "z-index": 1 });
+      $(".cmp-header__desktop .blue-filler").removeClass("d-none");
+    } else if (
+      elem.hasClass("submenu-link") ||
+      elem.hasClass("submenu-title")
+    ) {
+    } else {
+      $(".cmp-header__desktop .blue-filler").addClass("d-none");
+
+      arraySubmenus.css({ display: "none", "z-index": 0 });
+      arraySubmenus.attr("aria-hidden", "true");
+      arrayMenus.attr("aria-expanded", "false");
+    }
+  });
+
+  $(".nav-submenu").on("keydown", function(event) {
+    if (event.which == 27) {
+      arraySubmenus.css({ display: "none", "z-index": 0 });
+      arraySubmenus.attr("aria-hidden", "true");
+      arrayMenus.attr("aria-expanded", "false");
+    }
+  });
+
+  $(".nav-menu-item.nav-item.has-dropdown").hover(
+    function() {
+      $(".cmp-header__desktop .blue-filler").removeClass("d-none");
+    },
+    function() {
+      $(".cmp-header__desktop .blue-filler").addClass("d-none");
+    }
+  );
+}
+// MOBILE
+$(".burger-icon, .close-menu").on("click", function() {
+  var mobileMenu = $(".cmp-header-mobile__nav-setup");
+  var submenu = $(".submenu-navbar");
+
+  if (mobileMenu.css("display") === "none") {
+    mobileMenu.show();
+    submenu.hide();
+    setTimeout(function() {
+      mobileMenu.css("width", "100%");
+    }, 100);
+  } else {
+    mobileMenu.css("width", "0");
+    setTimeout(function() {
+      mobileMenu.hide();
+      submenu.hide();
+    }, 550);
+  }
+});
+
+$(".main-navbar-item, .secondary-navbar-item").on("click", function() {
+  var submenu = $(this).next(".submenu-navbar");
+
+  if (submenu.css("display") === "none") {
+    submenu.show();
+  } else {
+    submenu.hide();
+  }
+});
+
+$(".secondary-navbar-item").on("click", function() {
+  console.log("ok");
+  var submenu = $(this).find(".navbar-dropdown");
+  var items = submenu.find(".secondary-dropdown-item").length;
+  var itemHeight = $(this).innerHeight();
+
+  if (submenu.css("height") === "0px") {
+    submenu.css("height", itemHeight * items + items + "px");
+  } else {
+    submenu.css("height", "0");
+  }
+});
+
+$(".submenu-navbar-item").on("click", function() {
+  var submenu = $(this).next(".lastLevel-navbar");
+  var items = submenu.find(".lastLevel-navbar-item").length;
+  var itemHeight = $(this).innerHeight();
+
+  if (submenu.css("height") === "0px") {
+    $(this).addClass("selected-item");
+    submenu.css("height", itemHeight * items + items + "px");
+  } else {
+    $(this).removeClass("selected-item");
+    submenu.css("height", "0");
+  }
+});
+
+$(".menu-back").on("click", function() {
+  var submenu = $(".submenu-navbar");
+  submenu.hide();
+});
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/header/header.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/header/header.js
+                
    • 
+                
  • 
+                    Size:
+                    3.3 KB
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Header
+ */
+
+.cmp-header {
+  + .cmp-skew {
+    // to overlay on top of that section
+    z-index: -1;
+  }
+
+  color: $blue;
+  .navbar-link:not(.is-arrowless)::after {
+    right: 2.025em;
+    font-size: 0.7rem;
+    margin-top: -0.475em;
+  }
+
+  .cmp-header__nav-setup {
+    nav {
+      z-index: 32;
+    }
+
+    ul {
+      justify-content: flex-end;
+    }
+  }
+
+  .cmp-header__nav-setup {
+    font-size: 12px;
+
+    .dropdown-menu.show {
+      padding: 0;
+      color: #1b3d6e;
+      font-size: 12px;
+      border: none;
+      box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.2);
+      .dropdown-item:hover,
+      .dropdown-item:focus {
+        color: white;
+        text-decoration: none;
+        background-color: #f16824;
+      }
+    }
+  }
+
+  .cmp-header__nav-menu {
+    .navbar {
+      padding: 0px;
+      align-items: flex-start;
+      box-shadow: 0px 23px 37px -30px rgba(0, 0, 0, 1);
+    }
+    .navbar-brand {
+      width: 280px;
+      text-align: center;
+      img {
+        width: 196px;
+      }
+    }
+    .logo {
+      height: 90px;
+      hr.sublogo {
+        border: 4px solid #1b3e6f;
+        position: absolute;
+        top: 100%;
+        left: 0;
+        z-index: 32;
+        margin-top: 0;
+        width: 275px;
+      }
+    }
+    .nav-menu-item {
+      .nav-link.dropdown-toggle::after {
+        content: none;
+      }
+      .nav-link {
+        padding: 11px 0px;
+      }
+      .nav-link:hover {
+        padding-bottom: 9px;
+        border-bottom: 2px solid #f16824;
+      }
+      .nav-link.no-submenu {
+        padding: 10px 35px;
+        border: 2px solid #f16824;
+      }
+
+      .nav-submenu {
+        background-color: white;
+        .submenu-empty-filler {
+          -webkit-box-flex: 0;
+          flex: 0 0 10%;
+          max-width: 10%;
+        }
+        .card-columns.col-lg-9.mt-lg-5 {
+          column-count: 4 !important;
+        }
+        .nav-group {
+          display: inline-block;
+          width: 100%;
+          font-size: 14px;
+          .submenu-title {
+            line-height: 2.43;
+            letter-spacing: 0.78px;
+            text-transform: uppercase;
+          }
+          ul {
+            list-style: none;
+            padding: 0;
+          }
+          li a {
+            line-height: 2.14;
+            font-weight: 300;
+          }
+        }
+      }
+    }
+
+    .navbar-end {
+      padding-top: 11px;
+    }
+
+    .nav-menu-item.nav-item {
+      padding-bottom: 42px;
+      // margin-top: 40px;
+    }
+    .nav-menu-item.nav-item.no-dropdown {
+      // margin-top: 30px;
+    }
+    .nav-submenu {
+      display: none;
+      position: absolute;
+      left: 0;
+      right: 0;
+      margin-top: 44px;
+      padding: 0 15px 40px;
+      min-height: 340px;
+    }
+    .nav-menu-item.nav-item:hover .nav-submenu {
+      display: flex;
+      z-index: 1;
+    }
+  }
+
+  .blue-filler {
+    // display: none;
+    // position: absolute;
+    background-color: #1b3e6f;
+    opacity: 0.7;
+    width: 100%;
+    height: 1000px;
+  }
+
+  .cmp-header__mobile {
+    a:hover {
+      text-decoration: none;
+      color: #1b3d6e;
+    }
+    .mobile-header {
+      height: 70px;
+      position: relative;
+      padding: 20px 15px;
+      hr.sublogo {
+        border: 4px solid #1b3d6e;
+        position: absolute;
+        top: 100%;
+        left: 0;
+        margin-top: 0;
+        width: 60%;
+      }
+
+      .navbar-item {
+        display: inline-block;
+      }
+      .logo {
+        padding-right: 0;
+        text-align: center;
+        .cmp-image {
+          width: 100%;
+          max-width: 140px;
+        }
+      }
+      .search-icon,
+      .cart-icon {
+        max-width: 24px;
+      }
+    }
+    .cmp-header-mobile__nav-setup {
+      background: white;
+      display: none;
+      overflow: hidden;
+      position: absolute;
+      top: 0;
+      right: 0;
+      left: 0;
+      width: 0;
+      transition: 0.5s;
+
+      ul {
+        padding: 0;
+      }
+
+      .navbar {
+        padding: 0;
+      }
+
+      .navbar-dropdown {
+        height: 0;
+        overflow: hidden;
+        transition: 0.3s;
+      }
+
+      .navbar-menu {
+        width: 100%;
+      }
+
+      .menu-head {
+        height: 0;
+        padding: 24px;
+
+        .close-menu,
+        .menu-back {
+          font-size: 40px;
+          margin-top: -30px;
+        }
+
+        .close-menu {
+          float: right;
+        }
+
+        .menu-back {
+          float: left;
+        }
+      }
+
+      .main-navbar-item,
+      .secondary-navbar-item,
+      .submenu-navbar-item,
+      .lastLevel-navbar-item,
+      .secondary-dropdown-item {
+        list-style: none;
+        font-size: 14px;
+        padding: 24px;
+        text-transform: uppercase;
+        width: 100%;
+      }
+
+      .selected-item {
+        background-color: #1b3d6e;
+        a {
+          color: white;
+        }
+      }
+
+      .lastLevel-navbar-item,
+      .secondary-dropdown-item {
+        font-weight: 300;
+        padding-left: 64px;
+        color: #54565a;
+      }
+
+      .submenu-navbar {
+        background: white;
+        display: none;
+        position: absolute;
+        top: 0;
+        right: 0;
+        left: 0;
+        bottom: 0;
+
+        .lastLevel-navbar {
+          height: 0;
+          overflow: hidden;
+          transition: 0.3s;
+        }
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/header/header.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/header/header.scss
+                
    • 
+                
  • 
+                    Size:
+                    5.2 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/heading--default.html b/components/detail/heading--default.html
new file mode 100644
index 0000000..41b5420
--- /dev/null
+++ b/components/detail/heading--default.html
@@ -0,0 +1,2153 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+heading component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            heading component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<h1 class="cmp-heading h1   ">
+    My h1 heading
+</h1>

+        
+    
+

+
+    
+    

+    
+        
<{{headingLevel}} class="cmp-heading {{headingLevel}} {% if classes %} {{classes}} {% endif %}  {% if threelines %} has-line {% endif %}">
+    {{heading}}
+ </{{headingLevel}}>
+
+   {% if threelines %}
+      {# {% include ('@components/01-units/threelines/threelines.twig') %} #}
+      {% include '@threelines' %}
+
+   {% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "My h1 heading",
+  "headingLevel": "h1"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Heading
+ */
+
+/* STARTER CODE
+
+class Heading {
+    constructor($inst) {
+        cponsole.log('Initializing Heading')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.js
+                
    • 
+                
  • 
+                    Size:
+                    178 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Heading
+ */
+
+.cmp-heading {
+  text-transform: uppercase;
+  margin-bottom: 2rem;
+
+  &.h1.has-line {
+    margin-bottom: 2rem;
+  }
+
+  &.h2.has-line {
+    margin-bottom: 1.75rem;
+  }
+
+  &.h3.has-line {
+    margin-bottom: 1.5rem;
+  }
+
+  &.h4.has-line {
+    margin-bottom: 1.25rem;
+  }
+
+  &.h5.has-line {
+    margin-bottom: 1rem;
+  }
+
+  &.h6.has-line {
+    margin-bottom: 0.75rem;
+  }
+
+  @include media-breakpoint-up(lg) {
+    margin-bottom: 1.5rem;
+    h1 {
+    }
+    h2 {
+    }
+    h3 {
+    }
+    h4 {
+    }
+    h5 {
+    }
+    h6 {
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.scss
+                
    • 
+                
  • 
+                    Size:
+                    561 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/heading--h2.html b/components/detail/heading--h2.html
new file mode 100644
index 0000000..d8d3c36
--- /dev/null
+++ b/components/detail/heading--h2.html
@@ -0,0 +1,2128 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+heading component: H 2 | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            heading component: H 2
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<h2 class="cmp-heading h2   ">
+    My h2 heading
+</h2>

+        
+    
+

+
+    
+    

+    
+        
<{{headingLevel}} class="cmp-heading {{headingLevel}} {% if classes %} {{classes}} {% endif %}  {% if threelines %} has-line {% endif %}">
+    {{heading}}
+ </{{headingLevel}}>
+
+   {% if threelines %}
+      {# {% include ('@components/01-units/threelines/threelines.twig') %} #}
+      {% include '@threelines' %}
+
+   {% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "My h2 heading",
+  "headingLevel": "h2"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Heading
+ */
+
+/* STARTER CODE
+
+class Heading {
+    constructor($inst) {
+        cponsole.log('Initializing Heading')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.js
+                
    • 
+                
  • 
+                    Size:
+                    178 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Heading
+ */
+
+.cmp-heading {
+  text-transform: uppercase;
+  margin-bottom: 2rem;
+
+  &.h1.has-line {
+    margin-bottom: 2rem;
+  }
+
+  &.h2.has-line {
+    margin-bottom: 1.75rem;
+  }
+
+  &.h3.has-line {
+    margin-bottom: 1.5rem;
+  }
+
+  &.h4.has-line {
+    margin-bottom: 1.25rem;
+  }
+
+  &.h5.has-line {
+    margin-bottom: 1rem;
+  }
+
+  &.h6.has-line {
+    margin-bottom: 0.75rem;
+  }
+
+  @include media-breakpoint-up(lg) {
+    margin-bottom: 1.5rem;
+    h1 {
+    }
+    h2 {
+    }
+    h3 {
+    }
+    h4 {
+    }
+    h5 {
+    }
+    h6 {
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.scss
+                
    • 
+                
  • 
+                    Size:
+                    561 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/heading--h3.html b/components/detail/heading--h3.html
new file mode 100644
index 0000000..9b025df
--- /dev/null
+++ b/components/detail/heading--h3.html
@@ -0,0 +1,2128 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+heading component: H 3 | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            heading component: H 3
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<h3 class="cmp-heading h3   ">
+    My h3 heading
+</h3>

+        
+    
+

+
+    
+    

+    
+        
<{{headingLevel}} class="cmp-heading {{headingLevel}} {% if classes %} {{classes}} {% endif %}  {% if threelines %} has-line {% endif %}">
+    {{heading}}
+ </{{headingLevel}}>
+
+   {% if threelines %}
+      {# {% include ('@components/01-units/threelines/threelines.twig') %} #}
+      {% include '@threelines' %}
+
+   {% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "My h3 heading",
+  "headingLevel": "h3"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Heading
+ */
+
+/* STARTER CODE
+
+class Heading {
+    constructor($inst) {
+        cponsole.log('Initializing Heading')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.js
+                
    • 
+                
  • 
+                    Size:
+                    178 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Heading
+ */
+
+.cmp-heading {
+  text-transform: uppercase;
+  margin-bottom: 2rem;
+
+  &.h1.has-line {
+    margin-bottom: 2rem;
+  }
+
+  &.h2.has-line {
+    margin-bottom: 1.75rem;
+  }
+
+  &.h3.has-line {
+    margin-bottom: 1.5rem;
+  }
+
+  &.h4.has-line {
+    margin-bottom: 1.25rem;
+  }
+
+  &.h5.has-line {
+    margin-bottom: 1rem;
+  }
+
+  &.h6.has-line {
+    margin-bottom: 0.75rem;
+  }
+
+  @include media-breakpoint-up(lg) {
+    margin-bottom: 1.5rem;
+    h1 {
+    }
+    h2 {
+    }
+    h3 {
+    }
+    h4 {
+    }
+    h5 {
+    }
+    h6 {
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.scss
+                
    • 
+                
  • 
+                    Size:
+                    561 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/heading--h4.html b/components/detail/heading--h4.html
new file mode 100644
index 0000000..c6c3335
--- /dev/null
+++ b/components/detail/heading--h4.html
@@ -0,0 +1,2128 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+heading component: H 4 | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            heading component: H 4
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<h4 class="cmp-heading h4   ">
+    My h4 heading
+</h4>

+        
+    
+

+
+    
+    

+    
+        
<{{headingLevel}} class="cmp-heading {{headingLevel}} {% if classes %} {{classes}} {% endif %}  {% if threelines %} has-line {% endif %}">
+    {{heading}}
+ </{{headingLevel}}>
+
+   {% if threelines %}
+      {# {% include ('@components/01-units/threelines/threelines.twig') %} #}
+      {% include '@threelines' %}
+
+   {% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "My h4 heading",
+  "headingLevel": "h4"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Heading
+ */
+
+/* STARTER CODE
+
+class Heading {
+    constructor($inst) {
+        cponsole.log('Initializing Heading')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.js
+                
    • 
+                
  • 
+                    Size:
+                    178 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Heading
+ */
+
+.cmp-heading {
+  text-transform: uppercase;
+  margin-bottom: 2rem;
+
+  &.h1.has-line {
+    margin-bottom: 2rem;
+  }
+
+  &.h2.has-line {
+    margin-bottom: 1.75rem;
+  }
+
+  &.h3.has-line {
+    margin-bottom: 1.5rem;
+  }
+
+  &.h4.has-line {
+    margin-bottom: 1.25rem;
+  }
+
+  &.h5.has-line {
+    margin-bottom: 1rem;
+  }
+
+  &.h6.has-line {
+    margin-bottom: 0.75rem;
+  }
+
+  @include media-breakpoint-up(lg) {
+    margin-bottom: 1.5rem;
+    h1 {
+    }
+    h2 {
+    }
+    h3 {
+    }
+    h4 {
+    }
+    h5 {
+    }
+    h6 {
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.scss
+                
    • 
+                
  • 
+                    Size:
+                    561 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/heading--h5.html b/components/detail/heading--h5.html
new file mode 100644
index 0000000..3c0a695
--- /dev/null
+++ b/components/detail/heading--h5.html
@@ -0,0 +1,2128 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+heading component: H 5 | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            heading component: H 5
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<h5 class="cmp-heading h5   ">
+    My h5 heading
+</h5>

+        
+    
+

+
+    
+    

+    
+        
<{{headingLevel}} class="cmp-heading {{headingLevel}} {% if classes %} {{classes}} {% endif %}  {% if threelines %} has-line {% endif %}">
+    {{heading}}
+ </{{headingLevel}}>
+
+   {% if threelines %}
+      {# {% include ('@components/01-units/threelines/threelines.twig') %} #}
+      {% include '@threelines' %}
+
+   {% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "My h5 heading",
+  "headingLevel": "h5"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Heading
+ */
+
+/* STARTER CODE
+
+class Heading {
+    constructor($inst) {
+        cponsole.log('Initializing Heading')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.js
+                
    • 
+                
  • 
+                    Size:
+                    178 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Heading
+ */
+
+.cmp-heading {
+  text-transform: uppercase;
+  margin-bottom: 2rem;
+
+  &.h1.has-line {
+    margin-bottom: 2rem;
+  }
+
+  &.h2.has-line {
+    margin-bottom: 1.75rem;
+  }
+
+  &.h3.has-line {
+    margin-bottom: 1.5rem;
+  }
+
+  &.h4.has-line {
+    margin-bottom: 1.25rem;
+  }
+
+  &.h5.has-line {
+    margin-bottom: 1rem;
+  }
+
+  &.h6.has-line {
+    margin-bottom: 0.75rem;
+  }
+
+  @include media-breakpoint-up(lg) {
+    margin-bottom: 1.5rem;
+    h1 {
+    }
+    h2 {
+    }
+    h3 {
+    }
+    h4 {
+    }
+    h5 {
+    }
+    h6 {
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.scss
+                
    • 
+                
  • 
+                    Size:
+                    561 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/heading--h6.html b/components/detail/heading--h6.html
new file mode 100644
index 0000000..9b93b3b
--- /dev/null
+++ b/components/detail/heading--h6.html
@@ -0,0 +1,2128 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+heading component: H 6 | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            heading component: H 6
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<h6 class="cmp-heading h6   ">
+    My h6 heading
+</h6>

+        
+    
+

+
+    
+    

+    
+        
<{{headingLevel}} class="cmp-heading {{headingLevel}} {% if classes %} {{classes}} {% endif %}  {% if threelines %} has-line {% endif %}">
+    {{heading}}
+ </{{headingLevel}}>
+
+   {% if threelines %}
+      {# {% include ('@components/01-units/threelines/threelines.twig') %} #}
+      {% include '@threelines' %}
+
+   {% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "My h6 heading",
+  "headingLevel": "h6"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Heading
+ */
+
+/* STARTER CODE
+
+class Heading {
+    constructor($inst) {
+        cponsole.log('Initializing Heading')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.js
+                
    • 
+                
  • 
+                    Size:
+                    178 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Heading
+ */
+
+.cmp-heading {
+  text-transform: uppercase;
+  margin-bottom: 2rem;
+
+  &.h1.has-line {
+    margin-bottom: 2rem;
+  }
+
+  &.h2.has-line {
+    margin-bottom: 1.75rem;
+  }
+
+  &.h3.has-line {
+    margin-bottom: 1.5rem;
+  }
+
+  &.h4.has-line {
+    margin-bottom: 1.25rem;
+  }
+
+  &.h5.has-line {
+    margin-bottom: 1rem;
+  }
+
+  &.h6.has-line {
+    margin-bottom: 0.75rem;
+  }
+
+  @include media-breakpoint-up(lg) {
+    margin-bottom: 1.5rem;
+    h1 {
+    }
+    h2 {
+    }
+    h3 {
+    }
+    h4 {
+    }
+    h5 {
+    }
+    h6 {
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.scss
+                
    • 
+                
  • 
+                    Size:
+                    561 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/heading.html b/components/detail/heading.html
new file mode 100644
index 0000000..72c54cc
--- /dev/null
+++ b/components/detail/heading.html
@@ -0,0 +1,2357 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+heading component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            heading component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
+            
<!-- Default -->
+<h1 class="cmp-heading h1   ">
+    My h1 heading
+</h1>
+
+

+        
+            
<!-- H 2 -->
+<h2 class="cmp-heading h2   ">
+    My h2 heading
+</h2>
+
+

+        
+            
<!-- H 3 -->
+<h3 class="cmp-heading h3   ">
+    My h3 heading
+</h3>
+
+

+        
+            
<!-- H 4 -->
+<h4 class="cmp-heading h4   ">
+    My h4 heading
+</h4>
+
+

+        
+            
<!-- H 5 -->
+<h5 class="cmp-heading h5   ">
+    My h5 heading
+</h5>
+
+

+        
+            
<!-- H 6 -->
+<h6 class="cmp-heading h6   ">
+    My h6 heading
+</h6>
+
+

+        
+            
<!-- H 2 -->
+<h2 class="cmp-heading h2    has-line ">
+    My h2 heading
+</h2>
+
+<svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+

+        
+            
<!-- H 3 -->
+<h3 class="cmp-heading h3    has-line ">
+    My h3 heading
+</h3>
+
+<svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+

+        
+            
<!-- H 4 -->
+<h4 class="cmp-heading h4    has-line ">
+    My h4 heading
+</h4>
+
+<svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+

+        
+            
<!-- H 5 -->
+<h5 class="cmp-heading h5    has-line ">
+    My h5 heading
+</h5>
+
+<svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+

+        
+            
<!-- H 6 -->
+<h6 class="cmp-heading h6    has-line ">
+    My h6 heading
+</h6>
+
+<svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+

+        
+        
+    
+

+
+    
+    

+    
+        
<{{headingLevel}} class="cmp-heading {{headingLevel}} {% if classes %} {{classes}} {% endif %}  {% if threelines %} has-line {% endif %}">
+    {{heading}}
+ </{{headingLevel}}>
+
+   {% if threelines %}
+      {# {% include ('@components/01-units/threelines/threelines.twig') %} #}
+      {% include '@threelines' %}
+
+   {% endif %}

+    
+

+
+    
+    

+    
+        
+        
+            
+/* Default */
+{
+  "heading": "My h1 heading",
+  "headingLevel": "h1"
+}
+
+

+        
+            
+/* H 2 */
+{
+  "heading": "My h2 heading",
+  "headingLevel": "h2"
+}
+
+

+        
+            
+/* H 3 */
+{
+  "heading": "My h3 heading",
+  "headingLevel": "h3"
+}
+
+

+        
+            
+/* H 4 */
+{
+  "heading": "My h4 heading",
+  "headingLevel": "h4"
+}
+
+

+        
+            
+/* H 5 */
+{
+  "heading": "My h5 heading",
+  "headingLevel": "h5"
+}
+
+

+        
+            
+/* H 6 */
+{
+  "heading": "My h6 heading",
+  "headingLevel": "h6"
+}
+
+

+        
+            
+/* H 2 */
+{
+  "heading": "My h2 heading",
+  "headingLevel": "h2",
+  "threelines": true
+}
+
+

+        
+            
+/* H 3 */
+{
+  "heading": "My h3 heading",
+  "headingLevel": "h3",
+  "threelines": true
+}
+
+

+        
+            
+/* H 4 */
+{
+  "heading": "My h4 heading",
+  "headingLevel": "h4",
+  "threelines": true
+}
+
+

+        
+            
+/* H 5 */
+{
+  "heading": "My h5 heading",
+  "headingLevel": "h5",
+  "threelines": true
+}
+
+

+        
+            
+/* H 6 */
+{
+  "heading": "My h6 heading",
+  "headingLevel": "h6",
+  "threelines": true
+}
+
+

+        
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Heading
+ */
+
+/* STARTER CODE
+
+class Heading {
+    constructor($inst) {
+        cponsole.log('Initializing Heading')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.js
+                
    • 
+                
  • 
+                    Size:
+                    178 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Heading
+ */
+
+.cmp-heading {
+  text-transform: uppercase;
+  margin-bottom: 2rem;
+
+  &.h1.has-line {
+    margin-bottom: 2rem;
+  }
+
+  &.h2.has-line {
+    margin-bottom: 1.75rem;
+  }
+
+  &.h3.has-line {
+    margin-bottom: 1.5rem;
+  }
+
+  &.h4.has-line {
+    margin-bottom: 1.25rem;
+  }
+
+  &.h5.has-line {
+    margin-bottom: 1rem;
+  }
+
+  &.h6.has-line {
+    margin-bottom: 0.75rem;
+  }
+
+  @include media-breakpoint-up(lg) {
+    margin-bottom: 1.5rem;
+    h1 {
+    }
+    h2 {
+    }
+    h3 {
+    }
+    h4 {
+    }
+    h5 {
+    }
+    h6 {
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/heading/heading.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/heading/heading.scss
+                
    • 
+                
  • 
+                    Size:
+                    561 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/hero--default.html b/components/detail/hero--default.html
new file mode 100644
index 0000000..725eb0c
--- /dev/null
+++ b/components/detail/hero--default.html
@@ -0,0 +1,2139 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+hero component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            hero component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered   position-relative bg-transparent   ">
+
+    <img class="cmp-image " src="https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg" alt="hero" sizes="100vw" srcset="https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w">
+
+    <div class="cmp-tricolor__position">
+        <div class="tricolor-layer  cmp-tricolor_start"></div>
+        <div class="tricolor-layer cmp-tricolor_middle"></div>
+        <div class="tricolor-layer cmp-tricolor_end"></div>
+
+    </div>
+    <div class="cmp-hero py-4 px-4">
+
+        <div class="cmp-cols  cols-1  cols-md-2   ">
+
+            <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                <div class="cmp-jumbo ">
+
+                    <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+                        AUTOMOTIVE INTELLIGENCE
+                    </h1>
+
+                    <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                    <p class="cmp-text">
+                        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+                    </p>
+
+                    <button class="cmp-button btn btn-outline-secondary">shop products</button>
+
+                    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                </div>
+
+            </div>
+
+        </div>
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
{% set columContent %}
+  {# <h4>columncontent</h4> #}
+    {% include "@jumbo" %}  
+{% endset %}
+
+{% set drupal %}
+  {% include "@drupalitemsfacade" with {items:columContent} %}
+{% endset %}
+
+
+{% set skewContent %}
+
+  {% include "@tricolor--position" %}
+  <div class="cmp-hero py-4 px-4">
+    {% include "@cols" with {content : drupal, mobileModifier: "1", tabletModifier: "2", } only %}
+  </div>
+{% endset %}
+
+{% include "@skew" with {content: skewContent } %}
+
+{# {{content}} #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+  "heading": "AUTOMOTIVE INTELLIGENCE",
+  "headingLevel": "h1",
+  "btnText": "shop products",
+  "threelines": true,
+  "bgImage": true,
+  "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg",
+  "sizes": "100vw",
+  "alt": "hero",
+  "srcset": "https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Hero
+ */
+
+/* STARTER CODE
+
+class Hero {
+    constructor($inst) {
+        cponsole.log('Initializing Hero')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/hero/hero.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/hero/hero.js
+                
    • 
+                
  • 
+                    Size:
+                    168 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Hero
+ */
+
+ $bsGap: 15px;
+
+.cmp-hero {
+    padding-top: fromPxtoRem(93);
+    padding-left: 1.5rem ;
+    padding-right: 1.5rem ;
+    @extend .skew-padding-bottom-6;
+
+    .cmp-slider{
+        padding-bottom: fromPxtoRem(110);
+        .cmp-slider-controls {
+            justify-content: start ;
+            margin-left: $bsGap
+        }
+
+    }
+
+}
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/hero/hero.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/hero/hero.scss
+                
    • 
+                
  • 
+                    Size:
+                    365 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
Questions

+
    
+
  • do the background Image Changes when we change the slide or just the copy and the button??
    • 
+

+
+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/hero--slider.html b/components/detail/hero--slider.html
new file mode 100644
index 0000000..a696a46
--- /dev/null
+++ b/components/detail/hero--slider.html
@@ -0,0 +1,2222 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+hero component: Slider | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            hero component: Slider
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered   position-relative bg-transparent  overlap-next-6 ">
+
+    <img class="cmp-image  overlap-next-6 " src="https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg" alt="hero" sizes="100vw" srcset="https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w">
+
+    <div class="cmp-tricolor__position">
+        <div class="tricolor-layer  cmp-tricolor_start"></div>
+        <div class="tricolor-layer cmp-tricolor_middle"></div>
+        <div class="tricolor-layer cmp-tricolor_end"></div>
+
+    </div>
+    <div class="cmp-hero">
+
+        <div class="cmp-cols  cols-1  cols-md-2   ">
+
+            <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                <div id="carouselHeroSlider" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+                    <div class="cmp-slider-controls d-flex">
+                        <a class="cmp-slider-prev" href="#carouselHeroSlider" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                        <ol class="carousel-indicators">
+                            <li data-target="#carouselHeroSlider" data-slide-to="0" class="active"></li>
+                            <li data-target="#carouselHeroSlider" data-slide-to="1"></li>
+                        </ol>
+                        <a class="cmp-slider-next" href="#carouselHeroSlider" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                    </div>
+
+                    <div class="carousel-inner">
+
+                        <div class="carousel-item  active ">
+
+                            <div class="cmp-jumbo ">
+
+                                <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+                                    KYAUTOMOTIVE INTELLIGENCE
+                                </h1>
+
+                                <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                                <p class="cmp-text">
+                                    From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+                                </p>
+
+                                <button class="cmp-button btn btn-outline-secondary">shop products</button>
+
+                                <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                            </div>
+
+                        </div>
+                        <div class="carousel-item ">
+
+                            <div class="cmp-jumbo ">
+
+                                <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+                                    Testing Carousel
+                                </h1>
+
+                                <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                                <p class="cmp-text">
+                                    From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+                                </p>
+
+                                <button class="cmp-button btn btn-outline-secondary">hello world</button>
+
+                                <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                            </div>
+
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+
+        </div>
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
{% set columContent %}
+  {# <h4>columncontent</h4> #}
+    {% set carouselId = "carouselHeroSlider" %}
+    {% set extraData = {extrainfo: 'hero-slides'} %}
+    {% set template = "jumbo" %}
+    {% include "@slider--dyn" with {carouselId:carouselId, models : heroes, sameHeight: true, template : template, extraData: extraData} %}
+{% endset %}
+
+{% set drupal %}
+  {% include "@drupalitemsfacade" with {items:columContent} %}
+{% endset %}
+
+{% set skewContent %}
+
+  {% include "@tricolor--position" %}
+  <div class="cmp-hero">
+    {% include "@cols" with {content : drupal, mobileModifier: "1", tabletModifier: "2", } only %}
+  </div>
+{% endset %}
+
+{% include "@skew" with {content: skewContent, classes: 'overlap-next-6' } %}
+
+{# {{content}} #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+  "heading": "AUTOMOTIVE INTELLIGENCE",
+  "headingLevel": "h1",
+  "btnText": "shop products",
+  "threelines": true,
+  "bgImage": true,
+  "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg",
+  "sizes": "100vw",
+  "alt": "hero",
+  "srcset": "https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w",
+  "heroes": [
+    {
+      "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+      "heading": "KYAUTOMOTIVE INTELLIGENCE",
+      "headingLevel": "h1",
+      "btnText": "shop products",
+      "threelines": true,
+      "bgImage": true
+    },
+    {
+      "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+      "heading": "Testing Carousel",
+      "headingLevel": "h1",
+      "btnText": "hello world",
+      "threelines": true,
+      "bgImage": true
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Hero
+ */
+
+/* STARTER CODE
+
+class Hero {
+    constructor($inst) {
+        cponsole.log('Initializing Hero')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/hero/hero.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/hero/hero.js
+                
    • 
+                
  • 
+                    Size:
+                    168 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Hero
+ */
+
+ $bsGap: 15px;
+
+.cmp-hero {
+    padding-top: fromPxtoRem(93);
+    padding-left: 1.5rem ;
+    padding-right: 1.5rem ;
+    @extend .skew-padding-bottom-6;
+
+    .cmp-slider{
+        padding-bottom: fromPxtoRem(110);
+        .cmp-slider-controls {
+            justify-content: start ;
+            margin-left: $bsGap
+        }
+
+    }
+
+}
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/hero/hero.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/hero/hero.scss
+                
    • 
+                
  • 
+                    Size:
+                    365 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
Questions

+
    
+
  • do the background Image Changes when we change the slide or just the copy and the button??
    • 
+

+
+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/hero.html b/components/detail/hero.html
new file mode 100644
index 0000000..614dfe0
--- /dev/null
+++ b/components/detail/hero.html
@@ -0,0 +1,2148 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+hero component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            hero component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered   position-relative bg-transparent   ">
+
+    <img class="cmp-image " src="https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg" alt="hero" sizes="100vw" srcset="https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w">
+
+    <div class="cmp-tricolor__position">
+        <div class="tricolor-layer  cmp-tricolor_start"></div>
+        <div class="tricolor-layer cmp-tricolor_middle"></div>
+        <div class="tricolor-layer cmp-tricolor_end"></div>
+
+    </div>
+    <div class="cmp-hero py-4 px-4">
+
+        <div class="cmp-cols  cols-1  cols-md-2   ">
+
+            <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                <div class="cmp-jumbo ">
+
+                    <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+                        AUTOMOTIVE INTELLIGENCE
+                    </h1>
+
+                    <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                    <p class="cmp-text">
+                        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+                    </p>
+
+                    <button class="cmp-button btn btn-outline-secondary">shop products</button>
+
+                    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                </div>
+
+            </div>
+
+        </div>
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
{% set columContent %}
+  {# <h4>columncontent</h4> #}
+    {% include "@jumbo" %}  
+{% endset %}
+
+{% set drupal %}
+  {% include "@drupalitemsfacade" with {items:columContent} %}
+{% endset %}
+
+
+{% set skewContent %}
+
+  {% include "@tricolor--position" %}
+  <div class="cmp-hero py-4 px-4">
+    {% include "@cols" with {content : drupal, mobileModifier: "1", tabletModifier: "2", } only %}
+  </div>
+{% endset %}
+
+{% include "@skew" with {content: skewContent } %}
+
+{# {{content}} #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+  "heading": "AUTOMOTIVE INTELLIGENCE",
+  "headingLevel": "h1",
+  "btnText": "shop products",
+  "threelines": true,
+  "bgImage": true,
+  "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg",
+  "sizes": "100vw",
+  "alt": "hero",
+  "srcset": "https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Hero
+ */
+
+/* STARTER CODE
+
+class Hero {
+    constructor($inst) {
+        cponsole.log('Initializing Hero')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/hero/hero.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/hero/hero.js
+                
    • 
+                
  • 
+                    Size:
+                    168 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Hero
+ */
+
+ $bsGap: 15px;
+
+.cmp-hero {
+    padding-top: fromPxtoRem(93);
+    padding-left: 1.5rem ;
+    padding-right: 1.5rem ;
+    @extend .skew-padding-bottom-6;
+
+    .cmp-slider{
+        padding-bottom: fromPxtoRem(110);
+        .cmp-slider-controls {
+            justify-content: start ;
+            margin-left: $bsGap
+        }
+
+    }
+
+}
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/hero/hero.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/hero/hero.scss
+                
    • 
+                
  • 
+                    Size:
+                    365 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
Questions

+
    
+
  • do the background Image Changes when we change the slide or just the copy and the button??
    • 
+

+
+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/homepage.html b/components/detail/homepage.html
new file mode 100644
index 0000000..8e69466
--- /dev/null
+++ b/components/detail/homepage.html
@@ -0,0 +1,3753 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+homePage component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            homePage component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered   position-relative bg-transparent  overlap-next-6 ">
+
+    <img class="cmp-image  overlap-next-6 " src="https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg" alt="hero" sizes="100vw" srcset="https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w">
+
+    <div class="cmp-tricolor__position">
+        <div class="tricolor-layer  cmp-tricolor_start"></div>
+        <div class="tricolor-layer cmp-tricolor_middle"></div>
+        <div class="tricolor-layer cmp-tricolor_end"></div>
+
+    </div>
+    <div class="cmp-hero">
+
+        <div class="cmp-cols  cols-1  cols-md-2   ">
+
+            <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                <div id="carouselHeroSlider" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+                    <div class="cmp-slider-controls d-flex">
+                        <a class="cmp-slider-prev" href="#carouselHeroSlider" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                        <ol class="carousel-indicators">
+                            <li data-target="#carouselHeroSlider" data-slide-to="0" class="active"></li>
+                            <li data-target="#carouselHeroSlider" data-slide-to="1"></li>
+                        </ol>
+                        <a class="cmp-slider-next" href="#carouselHeroSlider" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                    </div>
+
+                    <div class="carousel-inner">
+
+                        <div class="carousel-item  active ">
+
+                            <div class="cmp-jumbo ">
+
+                                <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+                                    KYAUTOMOTIVE INTELLIGENCE
+                                </h1>
+
+                                <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                                <p class="cmp-text">
+                                    From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+                                </p>
+
+                                <button class="cmp-button btn btn-outline-secondary">shop products</button>
+
+                                <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                            </div>
+
+                        </div>
+                        <div class="carousel-item ">
+
+                            <div class="cmp-jumbo ">
+
+                                <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+                                    Testing Carousel
+                                </h1>
+
+                                <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                                <p class="cmp-text">
+                                    From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+                                </p>
+
+                                <button class="cmp-button btn btn-outline-secondary">hello world</button>
+
+                                <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                            </div>
+
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+
+        </div>
+    </div>
+
+</section>
+
+<section class="cmp-skew columns is-centered skew-6 branding   bg-primary  ">
+
+    <div class="inner-section ">
+
+        <div class="cmp-branding text-white py-4 px-5 pb-lg-0">
+
+            <div class="cmp-jumbo  cmp-jumbo__simple ">
+
+                <h2 class="cmp-heading h2  cmp-jumbo__heading   ">
+                    Why ALLDATA
+                </h2>
+
+                <p class="cmp-text">
+                    ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+                </p>
+
+            </div>
+
+            <div class="cmp-cols  cols-1   cols-lg-3  ">
+
+                <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/mechanic.svg" alt="mechanic">
+
+                        <h3 class="cmp-heading h3   ">
+                            Repair Information
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/tyre.svg" alt="tyre">
+
+                        <h3 class="cmp-heading h3   ">
+                            diagnostics
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                    <div class="cmp-brandingcard text-center             
+                                          
+                        
+                                          
+                                                      
+            
+                
+        py-4 py-lg-4 px-lg-4
+      ">
+
+                        <img class="cmp-image " src="/images/key.svg" alt="key">
+
+                        <h3 class="cmp-heading h3   ">
+                            shop management
+                        </h3>
+
+                        <p class="cmp-text">
+                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+                        </p>
+
+                        <hr class="cmp-brandingcard__line">
+                    </div>
+
+                </div>
+
+            </div>
+        </div>
+
+    </div>
+
+</section>
+
+<section class="cmp-serve-wedo">
+
+    <div class="cmp-tricolor__position-inverted">
+        <div class="tricolor-layer  cmp-tricolor_start"></div>
+        <div class="tricolor-layer cmp-tricolor_middle"></div>
+        <div class="tricolor-layer cmp-tricolor_end"></div>
+
+    </div>
+    <div class="cmp-whoweserve col-11 col-lg-11 mx-auto">
+
+        <div class="cmp-jumbo  cmp-jumbo__No Button and no simple text ">
+
+            <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+                Who we serve
+            </h2>
+
+            <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+        </div>
+
+        <div class="cmp-cardscontainer  ">
+
+            <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds
+                                and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  last-card  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description-lastcard  " aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Go to diy site</a>
+
+                        </div>
+                    </div>
+
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="cmp-image-separator d-block d-lg-none col-12 my-5">
+
+        <img class="cmp-image " src="/images/carfix2.jpg" alt="">
+
+    </div>
+    <div class="cmp-what-wedo">
+        <div class="cmp-what-wedo__about-us col-11 col-sm-8 col-md-7 col-lg-5 mx-auto">
+
+            <div class="cmp-jumbo ">
+
+                <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+                    WHA WE DO
+                </h2>
+
+                <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                <p class="cmp-text">
+                    We are a <strong>data-driven solutions provider</strong> working <strong>hard</strong> and <strong>smart</strong> to help automotive repair shops be the <strong>best they can be</strong>.
+                </p>
+
+                <button class="cmp-button btn btn-outline-secondary">About Us</button>
+
+                <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+            </div>
+
+        </div>
+    </div>
+</section>
+
+<section class="cmp-skew columns is-centered skew-md-6 overlap-prev-section    " style=" background-image: url(/images/testimonialbg.png); background-size: cover; border-bottom: 1px solid white; ">
+
+    <div class="inner-section ">
+        <div class="cmp-testimonial">
+            <div class="cmp-testimonial-inner">
+
+                <div id="carouselTestimonialSlider" class="cmp-slider carousel slide  " data-ride="carousel" data-interval="false">
+                    <div class="cmp-slider-controls d-flex">
+                        <a class="cmp-slider-prev" href="#carouselTestimonialSlider" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                        <ol class="carousel-indicators">
+                            <li data-target="#carouselTestimonialSlider" data-slide-to="0" class="active"></li>
+                            <li data-target="#carouselTestimonialSlider" data-slide-to="1"></li>
+                        </ol>
+                        <a class="cmp-slider-next" href="#carouselTestimonialSlider" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                    </div>
+
+                    <div class="carousel-inner">
+
+                        <div class="carousel-item  active ">
+
+                            <div class="cmp-shadow-box">
+
+                                <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+                                    <div class="cmp-shadow-box-img">
+
+                                        <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+                                        <div class="cmp-shadow-box-play-container">
+                                            <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+                                        </div>
+
+                                    </div>
+                                    <div class="cmp-shadow-box-quote">
+                                        <div class="cmp-quote">
+
+                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                                                <footer>Josh Kazdan, Autosphere</footer>
+                                            </blockquote>
+
+                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+
+                        </div>
+                        <div class="carousel-item ">
+
+                            <div class="cmp-shadow-box">
+
+                                <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+                                    <div class="cmp-shadow-box-img">
+
+                                        <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+                                        <div class="cmp-shadow-box-play-container">
+                                            <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+                                        </div>
+
+                                    </div>
+                                    <div class="cmp-shadow-box-quote">
+                                        <div class="cmp-quote">
+
+                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                                                <footer>Josh Kazdan, Autosphere</footer>
+                                            </blockquote>
+
+                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+
+                        </div>
+
+                    </div>
+                </div>
+                <div class="cmp-testimonial-footer">
+                    <p class="cmp-text">
+                        See what over 400,000 technicians can't work without.
+                    </p>
+                    <button class="cmp-button btn btn-outline-secondary">Get Started</button>
+
+                    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                </div>
+            </div>
+        </div>
+
+    </div>
+
+</section>
+<div class="cmp-Affilliations mx-4 px-lg-5 mx-lg-3">
+
+    <div class="cmp-jumbo  cmp-jumbo__No Button ">
+
+        <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+            working with <br> the industry’s best
+        </h2>
+
+        <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+        <p class="cmp-text">
+            ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.
+        </p>
+
+    </div>
+
+    <div class="cmp-companies cmp-companies__bs">
+        <div class="cmp-companies-sm d-lg-none">
+
+            <div id="carouselCompanyMB" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+
+                <div class="carousel-inner">
+
+                    <div class="carousel-item  active ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/asa-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/bosch-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/jiffy-lube.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">customer</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+                    <div class="carousel-item ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+
+                </div>
+                <div class="cmp-slider-controls d-flex bottom">
+                    <a class="cmp-slider-prev" href="#carouselCompanyMB" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                    <ol class="carousel-indicators">
+                        <li data-target="#carouselCompanyMB" data-slide-to="0" class="active"></li>
+                        <li data-target="#carouselCompanyMB" data-slide-to="1"></li>
+                    </ol>
+                    <a class="cmp-slider-next" href="#carouselCompanyMB" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                </div>
+            </div>
+
+        </div>
+
+        <div class="cmp-companies-lg d-none d-lg-block">
+
+            <div id="carouselCompanyDK" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+                <div class="cmp-slider-controls d-flex">
+                    <a class="cmp-slider-prev" href="#carouselCompanyDK" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                    <ol class="carousel-indicators">
+                        <li data-target="#carouselCompanyDK" data-slide-to="0" class="active"></li>
+                        <li data-target="#carouselCompanyDK" data-slide-to="1"></li>
+                        <li data-target="#carouselCompanyDK" data-slide-to="2"></li>
+                    </ol>
+                    <a class="cmp-slider-next" href="#carouselCompanyDK" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                </div>
+
+                <div class="carousel-inner">
+
+                    <div class="carousel-item  active ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/asa-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/bosch-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/jiffy-lube.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">customer</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+                    <div class="carousel-item ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/3-m-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Association</small>
+                                </div>
+                            </div>
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/key.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">Associaiton</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+                    <div class="carousel-item ">
+                        <div class="cmp-companies-page text-center">
+                            <div class="cmp-companies-company">
+                                <div class="cmp-companies-logo my-auto my-lg-0">
+
+                                    <img class="cmp-image " src="/images/carmax-logo.svg" alt="">
+
+                                    <small class="cmp-company-affiliation mt-3 mt-lg-0 mb-lg-3">integration partner</small>
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+
+                </div>
+            </div>
+        </div>
+
+    </div>
+    <div class="cmp-affiliations-button">
+        <button class="cmp-button btn btn-outline-secondary">see all</button>
+
+        <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+    </div>
+</div>
+
+<section class="cmp-skew columns is-centered skew-6   bg-primary-100  ">
+
+    <div class="inner-section ">
+        <div class="cmp-latest">
+            <div class="container">
+
+                <h2 class="cmp-heading h2    has-line ">
+                    see the latest
+                </h2>
+
+                <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                <div class="cmp-latestcards__cardcontainer">
+                    <div class="row">
+                        <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
+                            <div class="cmp-latestcard">
+
+                                <div class="cmp-latestHeading">
+                                    <h6 class="heading-title">News</h6>
+                                    <button class="heading-link">see all news</button>
+                                </div>
+
+                                <div class="cmp-latestcard-content">
+                                    <div class="cmp-latestcard__image ">
+                                        <div class="d-none d-md-block">
+
+                                            <div class="cmp-imageblue bg-primary">
+
+                                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                                            </div>
+                                        </div>
+                                        <div class="d-md-none">
+
+                                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                                        </div>
+                                    </div>
+                                    <div class="cmp-latestcard__content">
+
+                                        <h6 class="cmp-heading h6   ">
+                                            Five ways technology can help your dealership service
+                                        </h6>
+
+                                        <span class="cmp-latestcard__more">
+                <img src=../../images/plus-orange.svg alt="more">
+            </span>
+                                        <p class="cmp-text">
+                                            At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+                                        </p>
+
+                                        <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
+                            <div class="cmp-latestcard">
+
+                                <div class="cmp-latestHeading">
+                                    <h6 class="heading-title">Teach tips</h6>
+                                    <button class="heading-link">See all tips</button>
+                                </div>
+
+                                <div class="cmp-latestcard-content">
+                                    <div class="cmp-latestcard__image ">
+                                        <div class="d-none d-md-block">
+
+                                            <div class="cmp-imageblue bg-primary">
+
+                                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                                            </div>
+                                        </div>
+                                        <div class="d-md-none">
+
+                                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                                        </div>
+                                    </div>
+                                    <div class="cmp-latestcard__content">
+
+                                        <h6 class="cmp-heading h6   ">
+                                            Five ways technology can help your dealership service
+                                        </h6>
+
+                                        <span class="cmp-latestcard__more">
+                <img src=../../images/plus-orange.svg alt="more">
+            </span>
+                                        <p class="cmp-text">
+                                            At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+                                        </p>
+
+                                        <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="more-news d-none d-md-block">
+                            <button class="cmp-button btn btn-outline-secondary">see this month's issue of alldata news</button>
+
+                            <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+
+    </div>
+
+</section>
+<div class="cmp-footer skew-0">
+    <div class="cmp-footer__main row">
+        <div class="cmp-footer__main-lists-continer card-columns col-lg-8">
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Products
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            ALLDATA Repair
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDTA Collision</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Mobile</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Diagnostics</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Tech-Assits</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Manage Online</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Shop Manager</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Support
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">Popular Topics</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Product Support</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Account Support</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Training & Certificacions</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Resources
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">Product Resources</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Teach tips</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA News</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    About Us
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">Partners </a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Press</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Carrers</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Contact us
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">800-697-2533</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Email Customer Support</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">Request a Demo </a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">More Options</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+            <div class="cmp-collapse-list">
+                <div class="cmp-collapse-list__title">
+                    Related sites
+                    <button class="cmp-collapse-list-button__show-more  d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_more.svg" alt="show more">
+
+        </button>
+                    <button class="cmp-collapse-list-button__show-less  d-none d-lg-none">
+            
+
+
+
+
+    <img class="cmp-image " src="/images/list_close.svg" alt="show less">
+
+        </button>
+                </div>
+                <div class="cmp-collapse-list__content list-closed" aria-hidden="true" aria-expanded="false">
+                    <ul>
+                        <li>
+                            <a href="www.google.com">ALLDATA Mexico</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDTA Canada</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA Europe</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">ALLDATA DIY</a>
+                        </li>
+                        <li>
+                            <a href="www.google.com">AutoZone</a>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+
+        </div>
+
+        <div class="cmp-footer__main-social col-lg-4 p-lg-0">
+            <p class="cmp-text">
+                Sign up to receive email updates
+            </p>
+            <img src="../../images/updateArrow.svg" alt="Sing Up">
+            <div class="cmp-footer__social-media">
+                <p class="cmp-text">
+                    Follow Us
+                </p>
+                <a class="mr-3" href="www.youtube.com">
+
+
+
+
+    <img class="cmp-image " src="/images/socialyt.svg" alt="visit our channel!">
+
+</a>
+                <a class="mr-3" href="www.linkedin.com">
+
+
+
+
+    <img class="cmp-image " src="/images/sociallink.svg" alt="visit our channel!">
+
+</a>
+                <a class="mr-3" href="www.twitter.com">
+
+
+
+
+    <img class="cmp-image " src="/images/socialtw.svg" alt="visit our channel!">
+
+</a>
+                <a class="mr-3" href="www.instagram.com">
+
+
+
+
+    <img class="cmp-image " src="/images/socialins.svg" alt="visit our channel!">
+
+</a>
+            </div>
+        </div>
+    </div>
+    <div class="cmp-footer__secondary">
+        <ul>
+            <li class="mr-lg-5"><a href="link">© 2019 ALLDATA</a></li>
+            <li class="mr-lg-5"><a href="link">An <strong>AutoZone</strong> Company</a></li>
+            <li class="mr-lg-5"><a href="link">Trademarks</a></li>
+            <li class="mr-lg-5"><a href="link">Terms of Use</a></li>
+            <li class="mr-lg-5"><a href="link">Privacy Policy</a></li>
+        </ul>
+        <div>
+        </div>

+        
+    
+

+
+    
+    

+    
+        
{% include "@hero--slider" with hero only %}
+{% include "@branding" with branding only %}
+{% include "@serve-wedo" with servewedo %}
+{% include "@testimonial" with testimonial  only %}
+{% include "@affilliations" with affilliations %}
+{% include "@latest" with latest %}
+{% include "@footer" with footer %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "hero": {
+    "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+    "heading": "AUTOMOTIVE INTELLIGENCE",
+    "headingLevel": "h1",
+    "btnText": "shop products",
+    "threelines": true,
+    "bgImage": true,
+    "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg",
+    "sizes": "100vw",
+    "alt": "hero",
+    "srcset": "https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w",
+    "heroes": [
+      {
+        "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+        "heading": "KYAUTOMOTIVE INTELLIGENCE",
+        "headingLevel": "h1",
+        "btnText": "shop products",
+        "threelines": true,
+        "bgImage": true
+      },
+      {
+        "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+        "heading": "Testing Carousel",
+        "headingLevel": "h1",
+        "btnText": "hello world",
+        "threelines": true,
+        "bgImage": true
+      }
+    ]
+  },
+  "branding": {
+    "heading": "Why ALLDATA",
+    "text": "ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.",
+    "mobileModifier": "1",
+    "desktopModifier": "3",
+    "overlapPrev": false,
+    "cards": [
+      {
+        "heading": "Repair Information",
+        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+        "headingLevel": "h3",
+        "alt": "mechanic",
+        "src": "/images/mechanic.svg"
+      },
+      {
+        "heading": "diagnostics",
+        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+        "headingLevel": "h3",
+        "alt": "tyre",
+        "src": "/images/tyre.svg"
+      },
+      {
+        "heading": "shop management",
+        "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
+        "headingLevel": "h3",
+        "alt": "key",
+        "src": "/images/key.svg"
+      }
+    ]
+  },
+  "servewedo": {
+    "heading": "Who we serve",
+    "cards": [
+      {
+        "src": "/images/carfix.jpg",
+        "heading": "Independent collision shops",
+        "headingLevel": "h6",
+        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+        "textLink": "Learn More",
+        "link": "https://www.google.com"
+      },
+      {
+        "src": "/images/carfix.jpg",
+        "heading": "Independent collision shops",
+        "headingLevel": "h6",
+        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+        "textLink": "Learn More",
+        "link": "https://www.google.com",
+        "middlePos": true
+      },
+      {
+        "src": "/images/carfix.jpg",
+        "heading": "Independent collision shops",
+        "headingLevel": "h6",
+        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+        "textLink": "Learn More",
+        "link": "https://www.google.com"
+      },
+      {
+        "src": "/images/carfix.jpg",
+        "heading": "Independent collision shops",
+        "headingLevel": "h6",
+        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+        "textLink": "Learn More",
+        "link": "https://www.google.com"
+      },
+      {
+        "src": "/images/carfix.jpg",
+        "heading": "Independent collision shops",
+        "headingLevel": "h6",
+        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+        "textLink": "Learn More",
+        "link": "https://www.google.com",
+        "middlePos": true
+      },
+      {
+        "src": "/images/carfix.jpg",
+        "heading": "Independent collision shops",
+        "headingLevel": "h6",
+        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+        "textLink": "Go to diy site",
+        "link": "https://www.google.com",
+        "lastCard": true
+      }
+    ],
+    "inlineBgImage": "/images/carfix2.jpg",
+    "jumboContent": {
+      "heading": "WHA WE DO",
+      "headingLevel": "h2",
+      "btnText": "About Us",
+      "threelines": true,
+      "text": "We are a <strong>data-driven solutions provider</strong> working <strong>hard</strong> and <strong>smart</strong> to help automotive repair shops be the <strong>best they can be</strong>."
+    }
+  },
+  "testimonial": {
+    "testimonials": [
+      {
+        "text": "This is an shadow-box component!",
+        "image": {
+          "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+          "alt": "happy man"
+        },
+        "quote": {
+          "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+          "footer": "Josh Kazdan, Autosphere"
+        }
+      },
+      {
+        "text": "This is an shadow-box component!",
+        "image": {
+          "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+          "alt": "happy man"
+        },
+        "quote": {
+          "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+          "footer": "Josh Kazdan, Autosphere"
+        }
+      }
+    ],
+    "text": "See what over 400,000 technicians can't work without.",
+    "btnText": "Get Started",
+    "inlineBgImage": "/images/testimonialbg.png",
+    "overlapPrev": true
+  },
+  "affilliations": {
+    "text": "ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.",
+    "heading": "working with <br> the industry’s best",
+    "companies": {
+      "companies": [
+        {
+          "affiliation": "Association",
+          "src": "/images/3-m-logo.svg"
+        },
+        {
+          "affiliation": "association",
+          "src": "/images/asa-logo.svg"
+        },
+        {
+          "affiliation": "integration partner",
+          "src": "/images/carmax-logo.svg"
+        },
+        {
+          "affiliation": "Associaiton",
+          "src": "/images/bosch-logo.svg"
+        },
+        {
+          "affiliation": "customer",
+          "src": "/images/jiffy-lube.svg"
+        },
+        {
+          "affiliation": "Associaiton",
+          "src": "/images/key.svg"
+        },
+        {
+          "affiliation": "Association",
+          "src": "/images/3-m-logo.svg"
+        },
+        {
+          "affiliation": "Associaiton",
+          "src": "/images/key.svg"
+        },
+        {
+          "affiliation": "Association",
+          "src": "/images/3-m-logo.svg"
+        },
+        {
+          "affiliation": "Associaiton",
+          "src": "/images/key.svg"
+        },
+        {
+          "affiliation": "integration partner",
+          "src": "/images/carmax-logo.svg"
+        }
+      ]
+    },
+    "btnText": "see all"
+  },
+  "latest": {
+    "heading": "see the latest",
+    "btnText": "see this month's issue of alldata news",
+    "cards": [
+      {
+        "latestTitle": "News",
+        "latestLink": "see all news",
+        "src": "/images/carfix.jpg",
+        "heading": "Five ways technology can help your dealership service",
+        "headingLevel": "h6",
+        "text": "At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...",
+        "textLink": "Learn More",
+        "link": "https://www.google.com"
+      },
+      {
+        "latestTitle": "Teach tips",
+        "latestLink": "See all tips",
+        "src": "/images/carfix.jpg",
+        "heading": "Five ways technology can help your dealership service",
+        "headingLevel": "h6",
+        "text": "At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...",
+        "textLink": "Learn More",
+        "link": "https://www.google.com"
+      }
+    ]
+  },
+  "footer": {
+    "footerMenu": [
+      {
+        "listTitle": "Products",
+        "listContents": [
+          {
+            "listText": "ALLDATA Repair"
+          },
+          {
+            "listText": "ALLDTA Collision",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDATA Mobile",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDATA Diagnostics",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDATA Tech-Assits",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDATA Manage Online",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDATA Shop Manager",
+            "listLink": "www.google.com"
+          }
+        ]
+      },
+      {
+        "listTitle": "Support",
+        "listContents": [
+          {
+            "listText": "Popular Topics",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "Product Support",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "Account Support",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "Training & Certificacions",
+            "listLink": "www.google.com"
+          }
+        ]
+      },
+      {
+        "listTitle": "Resources",
+        "listContents": [
+          {
+            "listText": "Product Resources",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "Teach tips",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDATA News",
+            "listLink": "www.google.com"
+          }
+        ]
+      },
+      {
+        "listTitle": "About Us",
+        "listContents": [
+          {
+            "listText": "Partners ",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "Press",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "Carrers",
+            "listLink": "www.google.com"
+          }
+        ]
+      },
+      {
+        "listTitle": "Contact us",
+        "listContents": [
+          {
+            "listText": "800-697-2533",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "Email Customer Support",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "Request a Demo ",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "More Options",
+            "listLink": "www.google.com"
+          }
+        ]
+      },
+      {
+        "listTitle": "Related sites",
+        "listContents": [
+          {
+            "listText": "ALLDATA Mexico",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDTA Canada",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDATA Europe",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "ALLDATA DIY",
+            "listLink": "www.google.com"
+          },
+          {
+            "listText": "AutoZone",
+            "listLink": "www.google.com"
+          }
+        ]
+      }
+    ],
+    "singUpMessage": "Sign up to receive email updates ",
+    "socialMedia": true,
+    "socialLinks": [
+      {
+        "mediaAvaliable": true,
+        "link": "www.youtube.com",
+        "logo": "/images/socialyt.svg",
+        "message": "visit our channel!"
+      },
+      {
+        "mediaAvaliable": false,
+        "link": "www.facebook.com",
+        "logo": "/images/socialfb.svg",
+        "message": "visit our channel!"
+      },
+      {
+        "mediaAvaliable": true,
+        "link": "www.linkedin.com",
+        "logo": "/images/sociallink.svg",
+        "message": "visit our channel!"
+      },
+      {
+        "mediaAvaliable": true,
+        "link": "www.twitter.com",
+        "logo": "/images/socialtw.svg",
+        "message": "visit our channel!"
+      },
+      {
+        "mediaAvaliable": true,
+        "link": "www.instagram.com",
+        "logo": "/images/socialins.svg",
+        "message": "visit our channel!"
+      }
+    ],
+    "subfooterList": [
+      {
+        "text": "© 2019 ALLDATA",
+        "link": "link"
+      },
+      {
+        "text": "An <strong>AutoZone</strong> Company",
+        "link": "link"
+      },
+      {
+        "text": "Trademarks",
+        "link": "link"
+      },
+      {
+        "text": "Terms of Use",
+        "link": "link"
+      },
+      {
+        "text": "Privacy Policy",
+        "link": "link"
+      }
+    ]
+  }
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for HomePage
+ */
+
+/* STARTER CODE
+
+class HomePage {
+    constructor($inst) {
+        cponsole.log('Initializing HomePage')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/homepage/homePage.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/pages/homePage/homePage.js
+                
    • 
+                
  • 
+                    Size:
+                    180 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for HomePage
+ */
+
+.serve{
+    height: 400px;
+    border: red solid 1px;
+}
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/homepage/homePage.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/pages/homePage/homePage.scss
+                
    • 
+                
  • 
+                    Size:
+                    92 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/image--default.html b/components/detail/image--default.html
new file mode 100644
index 0000000..1320edb
--- /dev/null
+++ b/components/detail/image--default.html
@@ -0,0 +1,2081 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+image component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            image component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<img class="cmp-image " src="/images/mechanic.png" alt="mechanic" sizes="(max-width:767px) 50vw,(min-width:768px) 10vw" srcset="/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w,">

+        
+    
+

+
+    
+    

+    
+        
{# php logic if is an svg image clear the sizes and srcset variables, we dont need them #}
+
+
+
+{% if src ends with '.svg' %}
+    <img class="cmp-image {% if classes %} {{classes}} {% endif %}" src="{{src}}" alt="{{alt}}">
+{% else %}
+    <img class="cmp-image {% if classes %} {{classes}} {% endif %}" src="{{src}}" alt="{{alt}}" {% if sizes %} sizes="{{sizes}}" {% endif %} {% if srcset %} srcset="{{srcset}}" {% endif %}  >
+
+    
+    
+{% endif %}
+
+{# $0.currentSrc #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "alt": "mechanic",
+  "sizes": "(max-width:767px) 50vw,(min-width:768px) 10vw",
+  "src": "/images/mechanic.png",
+  "srcset": "/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w,"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Image
+ */
+
+/* STARTER CODE
+
+class Image {
+    constructor($inst) {
+        cponsole.log('Initializing Image')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/image/image.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/image/image.js
+                
    • 
+                
  • 
+                    Size:
+                    172 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Image
+ */
+
+.cmp-image {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/image/image.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/image/image.scss
+                
    • 
+                
  • 
+                    Size:
+                    47 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/image--svg.html b/components/detail/image--svg.html
new file mode 100644
index 0000000..c09c0f2
--- /dev/null
+++ b/components/detail/image--svg.html
@@ -0,0 +1,2046 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+image component: Svg | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            image component: Svg
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<img class="cmp-image " src="/images/mechanic.svg" alt="mechanic">

+        
+    
+

+
+    
+    

+    
+        
{# php logic if is an svg image clear the sizes and srcset variables, we dont need them #}
+
+
+
+{% if src ends with '.svg' %}
+    <img class="cmp-image {% if classes %} {{classes}} {% endif %}" src="{{src}}" alt="{{alt}}">
+{% else %}
+    <img class="cmp-image {% if classes %} {{classes}} {% endif %}" src="{{src}}" alt="{{alt}}" {% if sizes %} sizes="{{sizes}}" {% endif %} {% if srcset %} srcset="{{srcset}}" {% endif %}  >
+
+    
+    
+{% endif %}
+
+{# $0.currentSrc #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "alt": "mechanic",
+  "sizes": "(max-width:767px) 50vw,(min-width:768px) 10vw",
+  "src": "/images/mechanic.svg",
+  "srcset": "/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w,"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Image
+ */
+
+/* STARTER CODE
+
+class Image {
+    constructor($inst) {
+        cponsole.log('Initializing Image')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/image/image.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/image/image.js
+                
    • 
+                
  • 
+                    Size:
+                    172 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Image
+ */
+
+.cmp-image {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/image/image.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/image/image.scss
+                
    • 
+                
  • 
+                    Size:
+                    47 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/image.html b/components/detail/image.html
new file mode 100644
index 0000000..65f8692
--- /dev/null
+++ b/components/detail/image.html
@@ -0,0 +1,2081 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+image component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            image component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<img class="cmp-image " src="/images/mechanic.png" alt="mechanic" sizes="(max-width:767px) 50vw,(min-width:768px) 10vw" srcset="/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w,">

+        
+    
+

+
+    
+    

+    
+        
{# php logic if is an svg image clear the sizes and srcset variables, we dont need them #}
+
+
+
+{% if src ends with '.svg' %}
+    <img class="cmp-image {% if classes %} {{classes}} {% endif %}" src="{{src}}" alt="{{alt}}">
+{% else %}
+    <img class="cmp-image {% if classes %} {{classes}} {% endif %}" src="{{src}}" alt="{{alt}}" {% if sizes %} sizes="{{sizes}}" {% endif %} {% if srcset %} srcset="{{srcset}}" {% endif %}  >
+
+    
+    
+{% endif %}
+
+{# $0.currentSrc #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "alt": "mechanic",
+  "sizes": "(max-width:767px) 50vw,(min-width:768px) 10vw",
+  "src": "/images/mechanic.png",
+  "srcset": "/images/mechanic.png 80w, /images/mechanic@2x.png 160w, /images/mechanic@3x.png 240w,"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Image
+ */
+
+/* STARTER CODE
+
+class Image {
+    constructor($inst) {
+        cponsole.log('Initializing Image')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/image/image.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/image/image.js
+                
    • 
+                
  • 
+                    Size:
+                    172 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Image
+ */
+
+.cmp-image {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/image/image.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/image/image.scss
+                
    • 
+                
  • 
+                    Size:
+                    47 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/imageblue.html b/components/detail/imageblue.html
new file mode 100644
index 0000000..d523681
--- /dev/null
+++ b/components/detail/imageblue.html
@@ -0,0 +1,2052 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+imageblue component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            imageblue component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-imageblue bg-primary">
+
+    <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-imageblue bg-primary">
+    {% include "@image" %}
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "src": "/images/carfix.jpg"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Imageblue
+ */
+
+/* STARTER CODE
+
+class Imageblue {
+    constructor($inst) {
+        cponsole.log('Initializing Imageblue')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/imageblue/imageblue.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/imageblue/imageblue.js
+                
    • 
+                
  • 
+                    Size:
+                    183 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Imageblue
+ */
+
+.cmp-imageblue {
+  width: fit-content;
+  .cmp-image{
+    opacity: .5;
+    transition: .3s;
+  }
+}
+.cmp-imageblue:hover .cmp-image{
+  opacity: 1;
+  transition: 0.3s;
+}
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/imageblue/imageblue.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/imageblue/imageblue.scss
+                
    • 
+                
  • 
+                    Size:
+                    203 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/jumbo--default.html b/components/detail/jumbo--default.html
new file mode 100644
index 0000000..fcf0be7
--- /dev/null
+++ b/components/detail/jumbo--default.html
@@ -0,0 +1,2196 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+jumbo component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            jumbo component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-jumbo ">
+
+    <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+        AUTOMOTIVE INTELLIGENCE
+    </h1>
+
+    <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+    <p class="cmp-text">
+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    </p>
+
+    <button class="cmp-button btn btn-outline-secondary">shop products</button>
+
+    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set content %}
+<div class="cmp-jumbo {% if modifier %} cmp-jumbo__{{modifier}} {% endif %}">
+
+
+{# headingLevel are h1 h2 h3 etc #}
+   {% include '@heading' with {classes : "cmp-jumbo__heading" } %}
+ 
+   {% include '@simpletext' %}
+
+   {% if btnText is not empty %}
+      {% include '@button' %}
+   {% endif %}
+</div>
+
+
+   {# {{ dump(text) }} #}
+   {# <i class="fab fa-algolia"></i> #}
+   {# the button can read the text on the jumbo component no need to explicit pass 'whit; #}
+   {# {% include '@button' %} #}
+  
+{% endset %}
+
+{{content}}
+
+{# no need to explicit pass it also #}
+{# {% include "@skew" %} #}
+{# {% include "@skew" with {'content' : content} %} #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+  "heading": "AUTOMOTIVE INTELLIGENCE",
+  "headingLevel": "h1",
+  "btnText": "shop products",
+  "threelines": true
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Jumbo
+ */
+
+/* STARTER CODE
+
+class Jumbo {
+    constructor($inst) {
+        cponsole.log('Initializing Jumbo')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Size:
+                    171 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Jumbo
+ */
+
+.cmp-jumbo {
+
+    .cmp-jumbo__heading{
+
+        &h1 {
+            margin-bottom: 2rem;
+    
+            //zepplin
+            font-size: 2rem;
+            font-weight: bold;
+            font-stretch: normal;
+            font-style: normal;
+            line-height: 1; // corrected from live
+            letter-spacing: .53px;
+        }
+    }
+
+   
+
+    .cmp-threelines {
+        margin-bottom: 2rem;
+    }
+
+    .cmp-text {
+        margin-bottom: 2rem;
+
+        // from zepplin
+        font-size: .875rem; 
+        font-weight: normal;
+        font-stretch: normal;
+        font-style: normal;
+        line-height: 1.75; 
+        letter-spacing: normal;
+        // color: $gray-650;
+
+    }
+
+    &.cmp-jumbo__simple{
+        text-align: center;
+
+        .cmp-jumbo__heading{
+            margin-bottom: 2rem;
+        }
+    }
+
+    @include media-breakpoint-up(lg) {
+
+        .cmp-jumbo__heading{
+            &h1 {
+                margin-bottom: 1.5rem;
+    
+                //zepplin
+                font-size: 3.75rem;
+                letter-spacing: 1px;
+            }
+
+        }
+
+        .cmp-text {
+            // margin-bottom: 2rem;
+
+            // from zepplin
+            font-size:  1.25rem;
+            line-height: 1.5;
+            // color: $gray-650;
+
+        }
+    }
+
+
+
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.3 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/jumbo--no-button-and-no-three-lines.html b/components/detail/jumbo--no-button-and-no-three-lines.html
new file mode 100644
index 0000000..19c8685
--- /dev/null
+++ b/components/detail/jumbo--no-button-and-no-three-lines.html
@@ -0,0 +1,2165 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+jumbo component: No Button And No Three Lines | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            jumbo component: No Button And No Three Lines
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-jumbo ">
+
+    <h1 class="cmp-heading h1  cmp-jumbo__heading   ">
+        AUTOMOTIVE INTELLIGENCE
+    </h1>
+
+    <p class="cmp-text">
+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    </p>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set content %}
+<div class="cmp-jumbo {% if modifier %} cmp-jumbo__{{modifier}} {% endif %}">
+
+
+{# headingLevel are h1 h2 h3 etc #}
+   {% include '@heading' with {classes : "cmp-jumbo__heading" } %}
+ 
+   {% include '@simpletext' %}
+
+   {% if btnText is not empty %}
+      {% include '@button' %}
+   {% endif %}
+</div>
+
+
+   {# {{ dump(text) }} #}
+   {# <i class="fab fa-algolia"></i> #}
+   {# the button can read the text on the jumbo component no need to explicit pass 'whit; #}
+   {# {% include '@button' %} #}
+  
+{% endset %}
+
+{{content}}
+
+{# no need to explicit pass it also #}
+{# {% include "@skew" %} #}
+{# {% include "@skew" with {'content' : content} %} #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+  "heading": "AUTOMOTIVE INTELLIGENCE",
+  "headingLevel": "h1",
+  "btnText": "",
+  "threelines": false
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Jumbo
+ */
+
+/* STARTER CODE
+
+class Jumbo {
+    constructor($inst) {
+        cponsole.log('Initializing Jumbo')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Size:
+                    171 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Jumbo
+ */
+
+.cmp-jumbo {
+
+    .cmp-jumbo__heading{
+
+        &h1 {
+            margin-bottom: 2rem;
+    
+            //zepplin
+            font-size: 2rem;
+            font-weight: bold;
+            font-stretch: normal;
+            font-style: normal;
+            line-height: 1; // corrected from live
+            letter-spacing: .53px;
+        }
+    }
+
+   
+
+    .cmp-threelines {
+        margin-bottom: 2rem;
+    }
+
+    .cmp-text {
+        margin-bottom: 2rem;
+
+        // from zepplin
+        font-size: .875rem; 
+        font-weight: normal;
+        font-stretch: normal;
+        font-style: normal;
+        line-height: 1.75; 
+        letter-spacing: normal;
+        // color: $gray-650;
+
+    }
+
+    &.cmp-jumbo__simple{
+        text-align: center;
+
+        .cmp-jumbo__heading{
+            margin-bottom: 2rem;
+        }
+    }
+
+    @include media-breakpoint-up(lg) {
+
+        .cmp-jumbo__heading{
+            &h1 {
+                margin-bottom: 1.5rem;
+    
+                //zepplin
+                font-size: 3.75rem;
+                letter-spacing: 1px;
+            }
+
+        }
+
+        .cmp-text {
+            // margin-bottom: 2rem;
+
+            // from zepplin
+            font-size:  1.25rem;
+            line-height: 1.5;
+            // color: $gray-650;
+
+        }
+    }
+
+
+
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.3 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/jumbo--no-button.html b/components/detail/jumbo--no-button.html
new file mode 100644
index 0000000..c552c09
--- /dev/null
+++ b/components/detail/jumbo--no-button.html
@@ -0,0 +1,2171 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+jumbo component: No Button | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            jumbo component: No Button
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-jumbo ">
+
+    <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+        AUTOMOTIVE INTELLIGENCE
+    </h1>
+
+    <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+    <p class="cmp-text">
+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    </p>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set content %}
+<div class="cmp-jumbo {% if modifier %} cmp-jumbo__{{modifier}} {% endif %}">
+
+
+{# headingLevel are h1 h2 h3 etc #}
+   {% include '@heading' with {classes : "cmp-jumbo__heading" } %}
+ 
+   {% include '@simpletext' %}
+
+   {% if btnText is not empty %}
+      {% include '@button' %}
+   {% endif %}
+</div>
+
+
+   {# {{ dump(text) }} #}
+   {# <i class="fab fa-algolia"></i> #}
+   {# the button can read the text on the jumbo component no need to explicit pass 'whit; #}
+   {# {% include '@button' %} #}
+  
+{% endset %}
+
+{{content}}
+
+{# no need to explicit pass it also #}
+{# {% include "@skew" %} #}
+{# {% include "@skew" with {'content' : content} %} #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+  "heading": "AUTOMOTIVE INTELLIGENCE",
+  "headingLevel": "h1",
+  "btnText": "",
+  "threelines": true
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Jumbo
+ */
+
+/* STARTER CODE
+
+class Jumbo {
+    constructor($inst) {
+        cponsole.log('Initializing Jumbo')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Size:
+                    171 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Jumbo
+ */
+
+.cmp-jumbo {
+
+    .cmp-jumbo__heading{
+
+        &h1 {
+            margin-bottom: 2rem;
+    
+            //zepplin
+            font-size: 2rem;
+            font-weight: bold;
+            font-stretch: normal;
+            font-style: normal;
+            line-height: 1; // corrected from live
+            letter-spacing: .53px;
+        }
+    }
+
+   
+
+    .cmp-threelines {
+        margin-bottom: 2rem;
+    }
+
+    .cmp-text {
+        margin-bottom: 2rem;
+
+        // from zepplin
+        font-size: .875rem; 
+        font-weight: normal;
+        font-stretch: normal;
+        font-style: normal;
+        line-height: 1.75; 
+        letter-spacing: normal;
+        // color: $gray-650;
+
+    }
+
+    &.cmp-jumbo__simple{
+        text-align: center;
+
+        .cmp-jumbo__heading{
+            margin-bottom: 2rem;
+        }
+    }
+
+    @include media-breakpoint-up(lg) {
+
+        .cmp-jumbo__heading{
+            &h1 {
+                margin-bottom: 1.5rem;
+    
+                //zepplin
+                font-size: 3.75rem;
+                letter-spacing: 1px;
+            }
+
+        }
+
+        .cmp-text {
+            // margin-bottom: 2rem;
+
+            // from zepplin
+            font-size:  1.25rem;
+            line-height: 1.5;
+            // color: $gray-650;
+
+        }
+    }
+
+
+
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.3 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/jumbo--no-three-lines.html b/components/detail/jumbo--no-three-lines.html
new file mode 100644
index 0000000..36e9ea3
--- /dev/null
+++ b/components/detail/jumbo--no-three-lines.html
@@ -0,0 +1,2169 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+jumbo component: No Three Lines | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            jumbo component: No Three Lines
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-jumbo ">
+
+    <h1 class="cmp-heading h1  cmp-jumbo__heading   ">
+        AUTOMOTIVE INTELLIGENCE
+    </h1>
+
+    <p class="cmp-text">
+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    </p>
+
+    <button class="cmp-button btn btn-outline-secondary">shop products</button>
+
+    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set content %}
+<div class="cmp-jumbo {% if modifier %} cmp-jumbo__{{modifier}} {% endif %}">
+
+
+{# headingLevel are h1 h2 h3 etc #}
+   {% include '@heading' with {classes : "cmp-jumbo__heading" } %}
+ 
+   {% include '@simpletext' %}
+
+   {% if btnText is not empty %}
+      {% include '@button' %}
+   {% endif %}
+</div>
+
+
+   {# {{ dump(text) }} #}
+   {# <i class="fab fa-algolia"></i> #}
+   {# the button can read the text on the jumbo component no need to explicit pass 'whit; #}
+   {# {% include '@button' %} #}
+  
+{% endset %}
+
+{{content}}
+
+{# no need to explicit pass it also #}
+{# {% include "@skew" %} #}
+{# {% include "@skew" with {'content' : content} %} #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+  "heading": "AUTOMOTIVE INTELLIGENCE",
+  "headingLevel": "h1",
+  "btnText": "shop products",
+  "threelines": false
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Jumbo
+ */
+
+/* STARTER CODE
+
+class Jumbo {
+    constructor($inst) {
+        cponsole.log('Initializing Jumbo')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Size:
+                    171 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Jumbo
+ */
+
+.cmp-jumbo {
+
+    .cmp-jumbo__heading{
+
+        &h1 {
+            margin-bottom: 2rem;
+    
+            //zepplin
+            font-size: 2rem;
+            font-weight: bold;
+            font-stretch: normal;
+            font-style: normal;
+            line-height: 1; // corrected from live
+            letter-spacing: .53px;
+        }
+    }
+
+   
+
+    .cmp-threelines {
+        margin-bottom: 2rem;
+    }
+
+    .cmp-text {
+        margin-bottom: 2rem;
+
+        // from zepplin
+        font-size: .875rem; 
+        font-weight: normal;
+        font-stretch: normal;
+        font-style: normal;
+        line-height: 1.75; 
+        letter-spacing: normal;
+        // color: $gray-650;
+
+    }
+
+    &.cmp-jumbo__simple{
+        text-align: center;
+
+        .cmp-jumbo__heading{
+            margin-bottom: 2rem;
+        }
+    }
+
+    @include media-breakpoint-up(lg) {
+
+        .cmp-jumbo__heading{
+            &h1 {
+                margin-bottom: 1.5rem;
+    
+                //zepplin
+                font-size: 3.75rem;
+                letter-spacing: 1px;
+            }
+
+        }
+
+        .cmp-text {
+            // margin-bottom: 2rem;
+
+            // from zepplin
+            font-size:  1.25rem;
+            line-height: 1.5;
+            // color: $gray-650;
+
+        }
+    }
+
+
+
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.3 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/jumbo--simple.html b/components/detail/jumbo--simple.html
new file mode 100644
index 0000000..9d9f2e3
--- /dev/null
+++ b/components/detail/jumbo--simple.html
@@ -0,0 +1,2151 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+jumbo component: Simple | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            jumbo component: Simple
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-jumbo  cmp-jumbo__simple ">
+
+    <h2 class="cmp-heading h2  cmp-jumbo__heading   ">
+        Why ALLDATA
+    </h2>
+
+    <p class="cmp-text">
+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    </p>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% include "@jumbo" with 
+    {
+        "headingLevel": "h2",
+        "btnText": "",
+        "threelines": false,
+        "modifier": "simple"
+    } 
+%}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.",
+  "heading": "Why ALLDATA",
+  "headingLevel": "h1",
+  "btnText": "shop products",
+  "threelines": true
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Jumbo
+ */
+
+/* STARTER CODE
+
+class Jumbo {
+    constructor($inst) {
+        cponsole.log('Initializing Jumbo')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Size:
+                    171 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Jumbo
+ */
+
+.cmp-jumbo {
+
+    .cmp-jumbo__heading{
+
+        &h1 {
+            margin-bottom: 2rem;
+    
+            //zepplin
+            font-size: 2rem;
+            font-weight: bold;
+            font-stretch: normal;
+            font-style: normal;
+            line-height: 1; // corrected from live
+            letter-spacing: .53px;
+        }
+    }
+
+   
+
+    .cmp-threelines {
+        margin-bottom: 2rem;
+    }
+
+    .cmp-text {
+        margin-bottom: 2rem;
+
+        // from zepplin
+        font-size: .875rem; 
+        font-weight: normal;
+        font-stretch: normal;
+        font-style: normal;
+        line-height: 1.75; 
+        letter-spacing: normal;
+        // color: $gray-650;
+
+    }
+
+    &.cmp-jumbo__simple{
+        text-align: center;
+
+        .cmp-jumbo__heading{
+            margin-bottom: 2rem;
+        }
+    }
+
+    @include media-breakpoint-up(lg) {
+
+        .cmp-jumbo__heading{
+            &h1 {
+                margin-bottom: 1.5rem;
+    
+                //zepplin
+                font-size: 3.75rem;
+                letter-spacing: 1px;
+            }
+
+        }
+
+        .cmp-text {
+            // margin-bottom: 2rem;
+
+            // from zepplin
+            font-size:  1.25rem;
+            line-height: 1.5;
+            // color: $gray-650;
+
+        }
+    }
+
+
+
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.3 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/jumbo.html b/components/detail/jumbo.html
new file mode 100644
index 0000000..8b68de6
--- /dev/null
+++ b/components/detail/jumbo.html
@@ -0,0 +1,2200 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+jumbo component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            jumbo component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-jumbo ">
+
+    <h1 class="cmp-heading h1  cmp-jumbo__heading    has-line ">
+        AUTOMOTIVE INTELLIGENCE
+    </h1>
+
+    <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+    <p class="cmp-text">
+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    </p>
+
+    <button class="cmp-button btn btn-outline-secondary">shop products</button>
+
+    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set content %}
+<div class="cmp-jumbo {% if modifier %} cmp-jumbo__{{modifier}} {% endif %}">
+
+
+{# headingLevel are h1 h2 h3 etc #}
+   {% include '@heading' with {classes : "cmp-jumbo__heading" } %}
+ 
+   {% include '@simpletext' %}
+
+   {% if btnText is not empty %}
+      {% include '@button' %}
+   {% endif %}
+</div>
+
+
+   {# {{ dump(text) }} #}
+   {# <i class="fab fa-algolia"></i> #}
+   {# the button can read the text on the jumbo component no need to explicit pass 'whit; #}
+   {# {% include '@button' %} #}
+  
+{% endset %}
+
+{{content}}
+
+{# no need to explicit pass it also #}
+{# {% include "@skew" %} #}
+{# {% include "@skew" with {'content' : content} %} #}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
+  "heading": "AUTOMOTIVE INTELLIGENCE",
+  "headingLevel": "h1",
+  "btnText": "shop products",
+  "threelines": true
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Jumbo
+ */
+
+/* STARTER CODE
+
+class Jumbo {
+    constructor($inst) {
+        cponsole.log('Initializing Jumbo')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.js
+                
    • 
+                
  • 
+                    Size:
+                    171 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Jumbo
+ */
+
+.cmp-jumbo {
+
+    .cmp-jumbo__heading{
+
+        &h1 {
+            margin-bottom: 2rem;
+    
+            //zepplin
+            font-size: 2rem;
+            font-weight: bold;
+            font-stretch: normal;
+            font-style: normal;
+            line-height: 1; // corrected from live
+            letter-spacing: .53px;
+        }
+    }
+
+   
+
+    .cmp-threelines {
+        margin-bottom: 2rem;
+    }
+
+    .cmp-text {
+        margin-bottom: 2rem;
+
+        // from zepplin
+        font-size: .875rem; 
+        font-weight: normal;
+        font-stretch: normal;
+        font-style: normal;
+        line-height: 1.75; 
+        letter-spacing: normal;
+        // color: $gray-650;
+
+    }
+
+    &.cmp-jumbo__simple{
+        text-align: center;
+
+        .cmp-jumbo__heading{
+            margin-bottom: 2rem;
+        }
+    }
+
+    @include media-breakpoint-up(lg) {
+
+        .cmp-jumbo__heading{
+            &h1 {
+                margin-bottom: 1.5rem;
+    
+                //zepplin
+                font-size: 3.75rem;
+                letter-spacing: 1px;
+            }
+
+        }
+
+        .cmp-text {
+            // margin-bottom: 2rem;
+
+            // from zepplin
+            font-size:  1.25rem;
+            line-height: 1.5;
+            // color: $gray-650;
+
+        }
+    }
+
+
+
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/jumbo/jumbo.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.3 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/latest.html b/components/detail/latest.html
new file mode 100644
index 0000000..43e81df
--- /dev/null
+++ b/components/detail/latest.html
@@ -0,0 +1,2292 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+latest component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            latest component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered skew-6   bg-primary-100  ">
+
+    <div class="inner-section ">
+        <div class="cmp-latest">
+            <div class="container">
+
+                <h2 class="cmp-heading h2    has-line ">
+                    see the latest
+                </h2>
+
+                <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                <div class="cmp-latestcards__cardcontainer">
+                    <div class="row">
+                        <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
+                            <div class="cmp-latestcard">
+
+                                <div class="cmp-latestHeading">
+                                    <h6 class="heading-title">News</h6>
+                                    <button class="heading-link">see all news</button>
+                                </div>
+
+                                <div class="cmp-latestcard-content">
+                                    <div class="cmp-latestcard__image ">
+                                        <div class="d-none d-md-block">
+
+                                            <div class="cmp-imageblue bg-primary">
+
+                                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                                            </div>
+                                        </div>
+                                        <div class="d-md-none">
+
+                                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                                        </div>
+                                    </div>
+                                    <div class="cmp-latestcard__content">
+
+                                        <h6 class="cmp-heading h6   ">
+                                            Five ways technology can help your dealership service
+                                        </h6>
+
+                                        <span class="cmp-latestcard__more">
+                <img src=../../images/plus-orange.svg alt="more">
+            </span>
+                                        <p class="cmp-text">
+                                            At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+                                        </p>
+
+                                        <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
+                            <div class="cmp-latestcard">
+
+                                <div class="cmp-latestHeading">
+                                    <h6 class="heading-title">Teach tips</h6>
+                                    <button class="heading-link">See all tips</button>
+                                </div>
+
+                                <div class="cmp-latestcard-content">
+                                    <div class="cmp-latestcard__image ">
+                                        <div class="d-none d-md-block">
+
+                                            <div class="cmp-imageblue bg-primary">
+
+                                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                                            </div>
+                                        </div>
+                                        <div class="d-md-none">
+
+                                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                                        </div>
+                                    </div>
+                                    <div class="cmp-latestcard__content">
+
+                                        <h6 class="cmp-heading h6   ">
+                                            Five ways technology can help your dealership service
+                                        </h6>
+
+                                        <span class="cmp-latestcard__more">
+                <img src=../../images/plus-orange.svg alt="more">
+            </span>
+                                        <p class="cmp-text">
+                                            At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+                                        </p>
+
+                                        <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="more-news d-none d-md-block">
+                            <button class="cmp-button btn btn-outline-secondary">see this month's issue of alldata news</button>
+
+                            <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
{% set content %}
+<div class="cmp-latest">
+    <div class="container">
+        {% include "@heading" with 
+            {
+                "headingLevel": "h2",
+                "threelines": true,
+            } 
+        %}
+
+        <div class="cmp-latestcards__cardcontainer">
+            <div class="row">
+                {% for card in cards %}
+                <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
+                    {% include "@latestcard" with card %}
+                </div>
+                {% endfor %}
+                <div class="more-news d-none d-md-block">
+                    {% include "@button" %}
+                </div>
+            </div>
+        </div>
+    </div>
+
+</div>
+{% endset %}
+
+{% include "@skew" with {content : content, skewBg: 'bg-primary-100', skewClass:'skew-6' } %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "see the latest",
+  "btnText": "see this month's issue of alldata news",
+  "cards": [
+    {
+      "latestTitle": "News",
+      "latestLink": "see all news",
+      "src": "/images/carfix.jpg",
+      "heading": "Five ways technology can help your dealership service",
+      "headingLevel": "h6",
+      "text": "At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "latestTitle": "Teach tips",
+      "latestLink": "See all tips",
+      "src": "/images/carfix.jpg",
+      "heading": "Five ways technology can help your dealership service",
+      "headingLevel": "h6",
+      "text": "At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Latest
+ */
+
+/* STARTER CODE
+
+class Latest {
+    constructor($inst) {
+        cponsole.log('Initializing Latest')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/latest/latest.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/latest/latest.js
+                
    • 
+                
  • 
+                    Size:
+                    174 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Latest
+ */
+
+.bg-primary-100 {
+  background-color: #004987;
+}
+
+.cmp-latest {
+  padding-top: 1.5rem;
+  padding-bottom: 8rem;
+
+  .cmp-heading {
+    color: white;
+  }
+
+  .cmp-servcard,
+  .last-card {
+    width: 475px;
+    height: 535px;
+    box-shadow: none;
+    display: inline-block;
+
+    .cmp-servcard__image {
+      display: flex;
+      width: 100%;
+      max-height: 293px;
+      overflow: hidden;
+      .cmp-image {
+        width: 100%;
+      }
+    }
+
+    .cmp-servcard__content {
+      padding: 30px 40px;
+
+      .cmp-heading {
+        color: #1b3e6f;
+      }
+      .cmp-text {
+        font-size: 14px;
+        font-weight: 300;
+        font-stretch: normal;
+        font-style: normal;
+        line-height: 1.71;
+        letter-spacing: normal;
+        color: #54565a;
+        padding-bottom: 15px;
+      }
+      .cmp-servcard__more {
+        display: none;
+      }
+    }
+  }
+
+  .mobile-overflow {
+    overflow: visible;
+  }
+
+  .last-card {
+    text-align: left;
+
+    .cmp-servcard__content .cmp-cardlink {
+      border: 0px;
+      padding: 0 0 7px 0;
+    }
+  }
+
+  .cmp-servcard:hover {
+    box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+  }
+  .cmp-servcard:hover .cmp-imageblue .cmp-image {
+    opacity: 1;
+    transition: 0.3s;
+  }
+
+  .cmp-servcard:hover .cmp-cardlink {
+    text-decoration: none;
+    color: #1b3d6e;
+    cursor: pointer;
+    border-bottom: 2px solid #f16824;
+  }
+
+  .more-news {
+    margin: 0 auto;
+    margin-top: 40px;
+  }
+
+  .cmp-button {
+    color: white;
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/latest/latest.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/latest/latest.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.5 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/latestcard.html b/components/detail/latestcard.html
new file mode 100644
index 0000000..4d6bdf9
--- /dev/null
+++ b/components/detail/latestcard.html
@@ -0,0 +1,2164 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+servcard component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            servcard component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-latestcard">
+
+    <div class="cmp-latestHeading">
+        <h6 class="heading-title">news</h6>
+        <button class="heading-link">see all news</button>
+    </div>
+
+    <div class="cmp-latestcard-content">
+        <div class="cmp-latestcard__image ">
+            <div class="d-none d-md-block">
+
+                <div class="cmp-imageblue bg-primary">
+
+                    <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                </div>
+            </div>
+            <div class="d-md-none">
+
+                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+            </div>
+        </div>
+        <div class="cmp-latestcard__content">
+
+            <h6 class="cmp-heading h6   ">
+                Independent collision shops
+            </h6>
+
+            <span class="cmp-latestcard__more">
+                <img src=../../images/plus-orange.svg alt="more">
+            </span>
+            <p class="cmp-text">
+                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+            </p>
+
+            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+        </div>
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-latestcard">
+    {% include "@latestheading" %}
+    <div class="cmp-latestcard-content">
+        <div class="cmp-latestcard__image ">
+            <div class="d-none d-md-block">
+                {% include "@imageblue" %}
+            </div>
+            <div class="d-md-none">
+                {% include "@image" %}
+            </div>
+        </div>
+        <div class="cmp-latestcard__content">
+            {% include "@heading" %}
+            <span class="cmp-latestcard__more">
+                <img src={{ '/images/plus-orange.svg' | path }} alt="more">
+            </span>
+            {% include "@simpletext" %}
+            {% include "@cardlink" %}
+        </div>
+    </div>
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "latestTitle": "news",
+  "latestLink": "see all news",
+  "src": "/images/carfix.jpg",
+  "heading": "Independent collision shops",
+  "headingLevel": "h6",
+  "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+  "textLink": "Learn More",
+  "link": "https://www.google.com",
+  "middlePos": false,
+  "lastCard": false
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for LatestCard
+ */
+
+/* STARTER CODE
+
+class LatestCard {
+    constructor($inst) {
+        cponsole.log('Initializing LatestCard')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/latestcard/latestCard.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/latestCard/latestCard.js
+                
    • 
+                
  • 
+                    Size:
+                    186 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Servcard
+ */
+
+
+.cmp-latestcard {
+  box-shadow: none;
+  margin: 0 auto;
+  margin-top: 20px;
+  padding-bottom: 20px;
+  width: 95%;
+
+  .cmp-latestcard__image{
+    display: flex;
+    width: 100%;
+    max-height: 293px;
+    overflow: hidden;
+    .cmp-image{
+      width: 100%;
+    }
+  }
+
+  .cmp-latestcard__content{
+    background: white;
+    padding: 30px 40px;
+  
+    .cmp-heading{
+      color: #1b3e6f;
+    }
+    .cmp-text{
+      font-size: 14px;
+      font-weight: 300;
+      font-stretch: normal;
+      font-style: normal;
+      line-height: 1.71;
+      letter-spacing: normal;
+      color: #54565a;
+      padding-bottom: 15px;
+    }
+    .cmp-latestcard__more{
+      display: none;
+    }
+  }
+}
+
+.cmp-latestcard:hover{
+  box-shadow: 20px 19px 61px -25px rgba(0,0,0,0.27);
+}
+
+.cmp-latestcard:hover .cmp-imageblue .cmp-image {
+  opacity: 1;
+  transition: 0.3s;
+}
+  
+.cmp-latestcard:hover .cmp-cardlink {
+  text-decoration: none;
+  color: #1b3d6e;
+  cursor: pointer;
+  border-bottom: 2px solid #f16824;
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/latestcard/latestCard.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/latestCard/latestCard.scss
+                
    • 
+                
  • 
+                    Size:
+                    1 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/latestheading.html b/components/detail/latestheading.html
new file mode 100644
index 0000000..601130e
--- /dev/null
+++ b/components/detail/latestheading.html
@@ -0,0 +1,2070 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+latestHeading component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            latestHeading component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-latestHeading">
+    <h6 class="heading-title">News</h6>
+    <button class="heading-link">See all news</button>
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-latestHeading">
+    <h6 class="heading-title">{{latestTitle}}</h6>
+    <button class="heading-link">{{latestLink}}</button>
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "latestTitle": "News",
+  "latestLink": "See all news"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for LatestHeading
+ */
+
+/* STARTER CODE
+
+class LatestHeading {
+    constructor($inst) {
+        cponsole.log('Initializing LatestHeading')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/latestheading/latestHeading.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/latestHeading/latestHeading.js
+                
    • 
+                
  • 
+                    Size:
+                    196 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for LatestHeading
+ */
+
+.cmp-latestHeading {
+  margin-bottom: 1rem;
+  text-transform: uppercase;
+  height: 20px;
+  .heading-title {
+    color: white;
+    float: left;
+  }
+
+  .heading-link {
+    background: none;
+    border: 0;
+    border-bottom: 2px solid #f16824;
+    color: white;
+    float: right;
+    font-weight: bold;
+    font-size: 0.75rem;
+    font-weight: bold;
+    font-stretch: normal;
+    font-style: normal;
+    line-height: normal;
+    letter-spacing: normal;
+    padding-bottom: 7px;
+    text-transform: uppercase;
+  }
+
+  .heading-link:hover {
+    text-decoration: none;
+  }
+
+  @include media-breakpoint-up(lg) {
+    .heading-link {
+      border-bottom: none;
+    }
+
+    .heading-link:hover {
+      cursor: pointer;
+      border-bottom: 2px solid #f16824;
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/latestheading/latestHeading.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/latestHeading/latestHeading.scss
+                
    • 
+                
  • 
+                    Size:
+                    799 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/preview.html b/components/detail/preview.html
new file mode 100644
index 0000000..e799574
--- /dev/null
+++ b/components/detail/preview.html
@@ -0,0 +1,1943 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+Preview | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            Preview
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <title>kykyn</title>
+    <base href="/alldatacomponents/">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <script defer="" src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
+    <link rel="stylesheet" href="/alldatacomponents/global.5bf4ab35.css">
+</head>
+
+<body>
+    [object Object]
+    <script src="/alldatacomponents/js.ccc2ecca.js"></script>
+</body>
+
+</html>

+        
+    
+

+
+    
+    

+    
+        
<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title>kykyn</title>
+    <base href="/alldatacomponents/">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <script defer="" src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
+    <link rel="stylesheet" href="/alldatacomponents/global.5bf4ab35.css">
+  </head>
+
+  <body>
+    {{ yield | raw }}
+    <script src="/alldatacomponents/js.ccc2ecca.js"></script>
+  </body>
+</html>

+    
+

+
+    
+    

+    
+        
+            
+            
/* No context defined for this component. */

+            
+        
+    
+

+
+    
+    
+
+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/quote.html b/components/detail/quote.html
new file mode 100644
index 0000000..bfc2364
--- /dev/null
+++ b/components/detail/quote.html
@@ -0,0 +1,2077 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+quote component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            quote component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-quote">
+
+    <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+    <blockquote cite="https://www.huxley.net/bnw/four.html">
+        <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+        <footer>Josh Kazdan, Autosphere</footer>
+    </blockquote>
+
+    <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-quote">
+    {% include "@image" with {src:'/images/quote-start.svg'} %}
+    <blockquote cite="https://www.huxley.net/bnw/four.html">
+        <p>{{text}}</p>
+        <footer>{{footer}}</footer>
+    </blockquote>
+    {% include "@image" with {src:'/images/quote-end.svg'} %}
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+  "footer": "Josh Kazdan, Autosphere"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Quote
+ */
+
+/* STARTER CODE
+
+class Quote {
+    constructor($inst) {
+        cponsole.log('Initializing Quote')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/quote/quote.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/quote/quote.js
+                
    • 
+                
  • 
+                    Size:
+                    172 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Quote
+ */
+
+.cmp-quote {
+  display: flex;
+  flex-direction: column;
+  align-items: baseline;
+  background-color: $white;
+
+  img:last-child {
+    align-self: flex-end;
+  }
+
+  blockquote {
+    margin-top: 1rem;
+
+    p {
+      font-size: fromPxtoRem(24);
+      line-height: 1.38;
+      margin-bottom: fromPxtoRem(20);
+    }
+
+    footer {
+      opacity: 0.54;
+      font-size: fromPxtoRem(14);
+      line-height: normal;
+      letter-spacing: normal;
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/quote/quote.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/quote/quote.scss
+                
    • 
+                
  • 
+                    Size:
+                    479 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/servcard.html b/components/detail/servcard.html
new file mode 100644
index 0000000..f87b10c
--- /dev/null
+++ b/components/detail/servcard.html
@@ -0,0 +1,2270 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+servcard component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            servcard component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+    <div class="cmp-servcard__image">
+
+        <div class="cmp-imageblue bg-primary">
+
+            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+        </div>
+    </div>
+    <div class="cmp-servcard__content">
+
+        <h6 class="cmp-heading h6   ">
+            Independent collision shops
+        </h6>
+
+        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+            <p class="cmp-text">
+                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+            </p>
+
+            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+        </div>
+    </div>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4{#mb-lg-5 mb-md-3 mb-sm-3 mb-3 #} {% if lastCard %} last-card {% endif %} 
+{#{% if middlePos %}mx-xl-4 mx-lg-3 mx-md-0 mx-sm-0{% endif %}#}"> 
+    <div class="cmp-servcard__image">
+        {% include "@imageblue" %}
+    </div>
+    <div class="cmp-servcard__content">
+        {% include "@heading" %}
+        <button class="cmp-servcard__more"><img src={{'images/plus-orange.svg' |path}} alt="more"></button>
+        <div class="cmp-servcard__description{% if lastCard %}-lastcard {% endif %} {% if not lastCard %} d-none d-lg-block{% endif %}" aria-hidden="true" aria-expanded="false">
+            {% include "@simpletext" %}
+            {% include "@cardlink" %}
+        </div>
+    </div>
+    
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "src": "/images/carfix.jpg",
+  "heading": "Independent collision shops",
+  "headingLevel": "h6",
+  "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+  "textLink": "Learn More",
+  "link": "https://www.google.com",
+  "middlePos": false,
+  "lastCard": false
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+import $ from 'jquery'
+/**
+ *  This is the main file for Servcard
+ */
+
+/* STARTER CODE
+
+class Servcard {
+    constructor($inst) {
+        cponsole.log('Initializing Servcard')
+    }
+}
+
+*/
+
+$( ".cmp-servcard" ).click(function() {
+    let childr = $(this).children(".cmp-servcard__content");
+    childr = childr.children(".cmp-servcard__description");
+    let descriptions = $(".cmp-servcard").find(".cmp-servcard__description");
+    if($(this).hasClass("cmp-servcard__open")){
+        $(this).removeClass("cmp-servcard__open");
+        childr.addClass("d-none");
+        childr.attr( "aria-hidden", "true");
+        childr.attr( "aria-expanded", "false");
+    }else{
+        $(".cmp-servcard").removeClass("cmp-servcard__open");
+        $(this).addClass("cmp-servcard__open");
+        $.each(descriptions, function(value) {
+            if (!($(this).hasClass("d-none"))) {
+                $(this).addClass("d-none");
+                $(this).attr( "aria-hidden", "true");
+                $(this).attr( "aria-expanded", "false");
+            } 
+        });
+        childr.removeClass("d-none");
+        childr.attr( "aria-hidden", "false");
+        childr.attr( "aria-expanded", "true");
+    }
+    
+    
+});
+
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/servcard/servcard.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/servcard/servcard.js
+                
    • 
+                
  • 
+                    Size:
+                    1.2 KB
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Servcard
+ */
+
+.cmp-servcard {
+  width: 335px;
+  height: 96px;
+  box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+  transition: 0.3s;
+  background: white;
+  padding: 0;
+
+  .cmp-servcard__image {
+    display: none;
+
+    // Since the card image is given a couple of margin especications these must been overidden
+    .field--type-entity-reference {
+      margin: 0;
+      font-family: inherit;
+    }
+    .field--type-image img {
+      margin: 0;
+    }
+
+    @media all and (min-width: 560px) {
+      .node .field--type-image {
+        margin: 0 !important;
+      }
+    }
+  }
+  .cmp-servcard__content {
+    padding: 30px;
+
+    .cmp-heading {
+      color: #1b3e6f;
+      display: inline-block;
+      width: 75%;
+      margin-bottom: 3rem;
+    }
+    .cmp-text {
+      font-size: 14px;
+      font-weight: 300;
+      font-stretch: normal;
+      font-style: normal;
+      line-height: 1.71;
+      letter-spacing: normal;
+      color: #54565a;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      -webkit-line-clamp: 4;
+      overflow-y: hidden;
+      margin-bottom: 1rem; //The text component turn from a p to a div which make it loose his margin at the bottom
+    }
+    .cmp-servcard__more {
+      display: inline-block;
+      width: 50px;
+      float: right;
+      border: none;
+      background: none;
+    }
+  }
+}
+
+.mobile-overflow {
+  overflow: hidden;
+}
+
+.cmp-servcard__open {
+  transition: 0.3s;
+  height: 322px;
+}
+
+.last-card {
+  height: 322px;
+  text-align: center;
+
+  .cmp-servcard__content .cmp-servcard__more {
+    display: none;
+  }
+
+  .cmp-servcard__content .cmp-cardlink {
+    border: 2px solid #f16824;
+    padding: 10px 20px;
+  }
+}
+
+@include media-breakpoint-up(lg) {
+  .cmp-servcard,
+  .last-card {
+    -webkit-box-flex: 0;
+    flex: 1 0 25%;
+    max-width: 30%;
+    height: 535px;
+    box-shadow: none;
+    display: inline-block;
+
+    .cmp-servcard__image {
+      display: flex;
+      width: 100%;
+      max-height: 293px;
+      overflow: hidden;
+      .cmp-image {
+        width: 100%;
+      }
+    }
+
+    .cmp-servcard__content {
+      padding: 30px 40px;
+
+      .cmp-heading {
+        color: #1b3e6f;
+      }
+      .cmp-text {
+        font-size: 14px;
+        font-weight: 300;
+        font-stretch: normal;
+        font-style: normal;
+        line-height: 1.71;
+        letter-spacing: normal;
+        color: #54565a;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 3;
+        overflow-y: hidden;
+      }
+      .cmp-servcard__more {
+        display: none;
+      }
+    }
+  }
+
+  .mobile-overflow {
+    overflow: visible;
+  }
+
+  .last-card {
+    text-align: left;
+
+    .cmp-servcard__content .cmp-cardlink {
+      border: 0px;
+      padding: 0 0 7px 0;
+    }
+  }
+
+  .cmp-servcard:hover {
+    box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+  }
+  .cmp-servcard:hover .cmp-imageblue .cmp-image {
+    opacity: 1;
+    transition: 0.3s;
+  }
+
+  .cmp-servcard:hover .cmp-cardlink {
+    text-decoration: none;
+    color: #1b3d6e;
+    cursor: pointer;
+    border-bottom: 2px solid #f16824;
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/servcard/servcard.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/servcard/servcard.scss
+                
    • 
+                
  • 
+                    Size:
+                    3.1 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/servcard2.html b/components/detail/servcard2.html
new file mode 100644
index 0000000..52c98d5
--- /dev/null
+++ b/components/detail/servcard2.html
@@ -0,0 +1,2077 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+servcard2 component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            servcard2 component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div role="presentation" class="cmp-servcard mobile-overflow mb-sm-3   
+">
+    <div class="cmp-servcard__image">
+
+        <div class="cmp-imageblue bg-primary">
+
+            <img class="cmp-image " src="" alt="">
+
+        </div>
+    </div>
+    <div class="cmp-servcard__content">
+
+        < class="cmp-heading    ">
+
+            </>
+
+            <h2>KYKYN</h2>
+            <button class="cmp-servcard__more"><img src=/images/plus-orange.svg alt="more"></button>
+            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+
+                <a class="cmp-cardlink" href=""></a>
+
+            </div>
+    </div>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div role="presentation" class="cmp-servcard mobile-overflow mb-sm-3  {% if lastCard %} last-card {% endif %} 
+{% if middlePos %}{% endif %}">
+    <div class="cmp-servcard__image">
+        {% include "@imageblue" %}
+    </div>
+    <div class="cmp-servcard__content">
+        {% include "@heading" %}
+        <h2>KYKYN</h2>
+        <button class="cmp-servcard__more"><img src={{'/images/plus-orange.svg'}} alt="more"></button>
+        <div class="cmp-servcard__description{% if lastCard %}-lastcard {% endif %} {% if not lastCard %} d-none d-lg-block{% endif %}" aria-hidden="true" aria-expanded="false">
+            {% include "@simpletext" %}
+            {% include "@cardlink" %}
+        </div>
+    </div>
+    
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
/* No context defined for this component. */

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Servcard2
+ */
+
+/* STARTER CODE
+
+class Servcard2 {
+    constructor($inst) {
+        cponsole.log('Initializing Servcard2')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/servcard2/servcard2.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/servcard2/servcard2.js
+                
    • 
+                
  • 
+                    Size:
+                    184 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Servcard2
+ */
+
+.cmp-servcard2 {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/servcard2/servcard2.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/servcard2/servcard2.scss
+                
    • 
+                
  • 
+                    Size:
+                    55 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/serve-wedo.html b/components/detail/serve-wedo.html
new file mode 100644
index 0000000..d76a0ee
--- /dev/null
+++ b/components/detail/serve-wedo.html
@@ -0,0 +1,2448 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+serve-wedo component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            serve-wedo component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-serve-wedo">
+
+    <div class="cmp-tricolor__position-inverted">
+        <div class="tricolor-layer  cmp-tricolor_start"></div>
+        <div class="tricolor-layer cmp-tricolor_middle"></div>
+        <div class="tricolor-layer cmp-tricolor_end"></div>
+
+    </div>
+    <div class="cmp-whoweserve col-11 col-lg-11 mx-auto">
+
+        <div class="cmp-jumbo  cmp-jumbo__No Button and no simple text ">
+
+            <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+                Who we serve
+            </h2>
+
+            <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+        </div>
+
+        <div class="cmp-cardscontainer  ">
+
+            <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds
+                                and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  last-card  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description-lastcard  " aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Go to diy site</a>
+
+                        </div>
+                    </div>
+
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="cmp-image-separator d-block d-lg-none col-12 my-5">
+
+        <img class="cmp-image " src="/images/carfix2.jpg" alt="">
+
+    </div>
+    <div class="cmp-what-wedo">
+        <div class="cmp-what-wedo__about-us col-11 col-sm-8 col-md-7 col-lg-5 mx-auto">
+
+            <div class="cmp-jumbo ">
+
+                <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+                    WHA WE DO
+                </h2>
+
+                <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+                <p class="cmp-text">
+                    We are a <strong>data-driven solutions provider</strong> working <strong>hard</strong> and <strong>smart</strong> to help automotive repair shops be the <strong>best they can be</strong>.
+                </p>
+
+                <button class="cmp-button btn btn-outline-secondary">About Us</button>
+
+                <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+            </div>
+
+        </div>
+    </div>
+</section>

+        
+    
+

+
+    
+    

+    
+        
<section class="cmp-serve-wedo">
+    {% include "@tricolor--position" with {inverted: true}%}
+    <div class="cmp-whoweserve col-11 col-lg-11 mx-auto">
+        {% include "@jumbo" with 
+            {
+                "headingLevel": "h2",
+                "btnText": "",
+                "threelines": true,
+                "modifier": "No Button and no simple text"
+            } 
+        %}
+        <div class="cmp-cardscontainer  ">
+     
+            {% set cardsContent %}
+                {% for card in cards %}
+                    {% include "@servcard" with card %}
+                {% endfor %}
+            {% endset %}
+
+            {% include "@drupalitemsfacade" with {items:cardsContent} %}
+        </div>
+    </div>
+    <div class="cmp-image-separator d-block d-lg-none col-12 my-5">
+        {% include "@image" with {src: inlineBgImage} %}
+    </div>
+    <div class="cmp-what-wedo">
+        <div class="cmp-what-wedo__about-us col-11 col-sm-8 col-md-7 col-lg-5 mx-auto">
+        {% include "@jumbo" with jumboContent %}
+        </div>
+    </div>
+</section>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "Who we serve",
+  "cards": [
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com",
+      "middlePos": true
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com",
+      "middlePos": true
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Go to diy site",
+      "link": "https://www.google.com",
+      "lastCard": true
+    }
+  ],
+  "inlineBgImage": "/images/carfix2.jpg",
+  "jumboContent": {
+    "heading": "WHA WE DO",
+    "headingLevel": "h2",
+    "btnText": "About Us",
+    "threelines": true,
+    "text": "We are a <strong>data-driven solutions provider</strong> working <strong>hard</strong> and <strong>smart</strong> to help automotive repair shops be the <strong>best they can be</strong>."
+  }
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Serve Wedo
+ */
+
+/* STARTER CODE
+
+class ServeWedo {
+    constructor($inst) {
+        cponsole.log('Initializing ServeWedo')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/serve-wedo/serve-wedo.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/serve-wedo/serve-wedo.js
+                
    • 
+                
  • 
+                    Size:
+                    185 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Serve Wedo
+ */
+
+.cmp-serve-wedo {
+  margin-top: -100px;
+  background: url("/assets/images/carfix2.jpg") top no-repeat;
+  .cmp-tricolor__position-inverted {
+    height: 1300px;
+    .cmp-tricolor_start {
+      display: none;
+    }
+    .cmp-tricolor_middle {
+      background-color: #eeeeee;
+      width: 170%;
+      left: -70%;
+    }
+    .cmp-tricolor_end {
+      right: -90%;
+      width: 90%;
+    }
+  }
+
+  .cmp-whoweserve {
+    padding-top: 100px;
+    position: relative;
+    .cmp-cardscontainer {
+      .field__items {
+        display: flex;
+        flex-wrap: wrap;
+        width: 100%;
+      }
+
+      //   .cmp-servcard{
+      //     width: 100%;
+    }
+  }
+  .cmp-image-separator {
+    padding: 0;
+    height: 230px;
+    overflow: hidden;
+    transform: skewY(8deg);
+    background-color: #1b3d6e;
+    .cmp-image {
+      width: 150%;
+      margin-top: -20%;
+      margin-left: -30%;
+      transform: skewY(-8deg);
+      opacity: 0.4;
+    }
+  }
+  .cmp-what-wedo {
+    position: relative;
+    margin-bottom: 130px;
+    .cmp-what-wedo__about-us {
+      .cmp-jumbo .cmp-text {
+        font-weight: 300;
+      }
+    }
+  }
+
+  @include media-breakpoint-up(lg) {
+    background: url("/assets/images/carfix2.jpg") bottom no-repeat;
+    height: 2300px;
+    .cmp-tricolor__position-inverted {
+      height: 2300px;
+      .cmp-tricolor_start {
+        left: -70%;
+        display: block;
+      }
+      .cmp-tricolor_middle {
+        width: inherit;
+        left: 0;
+      }
+      .cmp-tricolor_end {
+        width: 100%;
+        right: -30%;
+      }
+    }
+
+    .cmp-what-wedo {
+      position: relative;
+
+      .cmp-what-wedo__about-us {
+        width: 530px;
+        float: right;
+        margin: 250px 200px 0px 0px !important;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/serve-wedo/serve-wedo.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/serve-wedo/serve-wedo.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.8 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/servicescards.html b/components/detail/servicescards.html
new file mode 100644
index 0000000..b21c39d
--- /dev/null
+++ b/components/detail/servicescards.html
@@ -0,0 +1,2387 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+servicescards component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            servicescards component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered       overflow-unset " style=" background-image: url(/images/carfix2.jpg); background-size: cover; border-bottom: 1px solid white; ">
+
+    <div class="cmp-servicescards">
+
+        <div class="cmp-tricolor__position-inverted">
+            <div class="tricolor-layer  cmp-tricolor_start"></div>
+            <div class="tricolor-layer cmp-tricolor_middle"></div>
+            <div class="tricolor-layer cmp-tricolor_end"></div>
+
+        </div>
+        <div class="cmp-jumbo  cmp-jumbo__No Button and no simple text ">
+
+            <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+                Who we serve
+            </h2>
+
+            <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+        </div>
+
+        <div class="cmp-servicescards__cardcontainer mx-sm-auto">
+
+            <div class="cmp-cols  cols-1   cols-lg-3  no-gutter  ">
+
+                <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                    <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                        <div class="cmp-servcard__image">
+
+                            <div class="cmp-imageblue bg-primary">
+
+                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                            </div>
+                        </div>
+                        <div class="cmp-servcard__content">
+
+                            <h6 class="cmp-heading h6   ">
+                                Independent collision shops
+                            </h6>
+
+                            <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                <p class="cmp-text">
+                                    Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                </p>
+
+                                <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                            </div>
+                        </div>
+
+                    </div>
+                    <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                        <div class="cmp-servcard__image">
+
+                            <div class="cmp-imageblue bg-primary">
+
+                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                            </div>
+                        </div>
+                        <div class="cmp-servcard__content">
+
+                            <h6 class="cmp-heading h6   ">
+                                Independent collision shops
+                            </h6>
+
+                            <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                <p class="cmp-text">
+                                    Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds
+                                    and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                </p>
+
+                                <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                            </div>
+                        </div>
+
+                    </div>
+                    <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                        <div class="cmp-servcard__image">
+
+                            <div class="cmp-imageblue bg-primary">
+
+                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                            </div>
+                        </div>
+                        <div class="cmp-servcard__content">
+
+                            <h6 class="cmp-heading h6   ">
+                                Independent collision shops
+                            </h6>
+
+                            <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                <p class="cmp-text">
+                                    Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                </p>
+
+                                <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                            </div>
+                        </div>
+
+                    </div>
+                    <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                        <div class="cmp-servcard__image">
+
+                            <div class="cmp-imageblue bg-primary">
+
+                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                            </div>
+                        </div>
+                        <div class="cmp-servcard__content">
+
+                            <h6 class="cmp-heading h6   ">
+                                Independent collision shops
+                            </h6>
+
+                            <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                <p class="cmp-text">
+                                    Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                </p>
+
+                                <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                            </div>
+                        </div>
+
+                    </div>
+                    <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  
+">
+                        <div class="cmp-servcard__image">
+
+                            <div class="cmp-imageblue bg-primary">
+
+                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                            </div>
+                        </div>
+                        <div class="cmp-servcard__content">
+
+                            <h6 class="cmp-heading h6   ">
+                                Independent collision shops
+                            </h6>
+
+                            <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                            <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                                <p class="cmp-text">
+                                    Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                </p>
+
+                                <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                            </div>
+                        </div>
+
+                    </div>
+                    <div role="presentation" class="cmp-servcard mobile-overflow col-12 mx-auto mx-lg-3 mb-4  last-card  
+">
+                        <div class="cmp-servcard__image">
+
+                            <div class="cmp-imageblue bg-primary">
+
+                                <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                            </div>
+                        </div>
+                        <div class="cmp-servcard__content">
+
+                            <h6 class="cmp-heading h6   ">
+                                Independent collision shops
+                            </h6>
+
+                            <button class="cmp-servcard__more"><img src=../../images/plus-orange.svg alt="more"></button>
+                            <div class="cmp-servcard__description-lastcard  " aria-hidden="true" aria-expanded="false">
+                                <p class="cmp-text">
+                                    Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                                </p>
+
+                                <a class="cmp-cardlink" href="https://www.google.com">Go to diy site</a>
+
+                            </div>
+                        </div>
+
+                    </div>
+                </div>
+
+            </div>
+        </div>
+
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
{% set skewContent %}
+    <div class="cmp-servicescards">
+        {% include "@tricolor--position" with {inverted: true}%}
+        {% include "@jumbo" with 
+            {
+                "headingLevel": "h2",
+                "btnText": "",
+                "threelines": true,
+                "modifier": "No Button and no simple text"
+            } 
+        %}
+
+
+        {% set cardsContent %}
+            
+            {% for card in cards %}
+                {% include "@servcard" with card %}
+            {% endfor %}
+        {% endset %}
+
+
+        {% set drupal %}
+            {% include "@drupalitemsfacade" with {items:cardsContent} %}
+        {% endset %}
+        <div class="cmp-servicescards__cardcontainer mx-sm-auto">
+            {% include "@cols" with {content: drupal, mobileModifier: "1", desktopModifier: "3", noGutter:true} %}
+        </div>
+     
+        
+    </div>
+{% endset %}
+        
+
+{% include "@skew" with {content: skewContent, overflowUnset: true, inlineBgImage: inlineBgImage} %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "Who we serve",
+  "cards": [
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com",
+      "middlePos": true
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com",
+      "middlePos": true
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Go to diy site",
+      "link": "https://www.google.com",
+      "lastCard": true
+    }
+  ],
+  "inlineBgImage": "/images/carfix2.jpg",
+  "jumboContent": {
+    "headingLevel": "h2",
+    "btnText": "About Us",
+    "threelines": true,
+    "text": "We are a <strong>data-driven solutions provider</strong> working <strong>hard</strong> and <strong>smart</strong> to help automotive repair shops be the <strong>best they can be</strong>."
+  }
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Servicescards
+ */
+
+/* STARTER CODE
+
+class Servicescards {
+    constructor($inst) {
+        cponsole.log('Initializing Servicescards')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/servicescards/servicescards.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/servicescards/servicescards.js
+                
    • 
+                
  • 
+                    Size:
+                    195 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Servicescards
+ */
+
+.cmp-servicescards {
+  padding: 150px 25px;
+  height: 1300px;
+  max-width: 1600px;
+  margin: auto;
+  .cmp-tricolor__position-inverted {
+    margin-top: -300px;
+    height: inherit;
+    .cmp-tricolor_start {
+      display: none;
+    }
+    .cmp-tricolor_middle {
+      left: -60%;
+      width: 125%;
+    }
+    .cmp-tricolor_end {
+      width: 110%;
+      left: 60%;
+    }
+  }
+  .cmp-jumbo {
+    position: relative;
+  }
+  .cmp-servicescards__cardcontainer {
+    position: relative;
+    //   display: flex;
+    //   flex-wrap: wrap;
+    //   .cmp-servcard{
+    //     width: 100%;
+    //   }
+  }
+}
+@include media-breakpoint-up(lg) {
+  .cmp-servicescards {
+    // padding: 300px 45px 0px;
+    // .cmp-servicescards__cardcontainer{
+    //   .cmp-servcard{
+    //     width: 32%;
+    //   }
+    // }
+    .cmp-tricolor__position-inverted {
+      margin-top: -300px;
+      height: inherit;
+      .cmp-tricolor_start {
+        display: none;
+      }
+      .cmp-tricolor_middle {
+        left: -40%;
+        width: inherit;
+      }
+      .cmp-tricolor_end {
+        width: 100%;
+        left: 30%;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/servicescards/servicescards.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/servicescards/servicescards.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.1 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/shadow-box.html b/components/detail/shadow-box.html
new file mode 100644
index 0000000..122f43a
--- /dev/null
+++ b/components/detail/shadow-box.html
@@ -0,0 +1,2171 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+shadow-box component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            shadow-box component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-shadow-box">
+
+    <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+        <div class="cmp-shadow-box-img">
+
+            <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+            <div class="cmp-shadow-box-play-container">
+                <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+            </div>
+
+        </div>
+        <div class="cmp-shadow-box-quote">
+            <div class="cmp-quote">
+
+                <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                <blockquote cite="https://www.huxley.net/bnw/four.html">
+                    <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                    <footer>Josh Kazdan, Autosphere</footer>
+                </blockquote>
+
+                <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+            </div>
+        </div>
+
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set columContent %}
+  <div class="cmp-shadow-box-img">
+    {% include "@image" with image|merge({classes: 'img-fluid'}) %}
+
+    
+    <div class="cmp-shadow-box-play-container">
+      <button class="btn">
+
+        {% include "@image" with {src:'/images/play.svg'} %}
+          <span class="sr-only"></span>
+      </button>
+    </div>
+
+  </div>
+  <div class="cmp-shadow-box-quote">
+      {% include "@quote" with quote only %}
+  </div> 
+{% endset %}
+
+
+{% set drupal %}
+  {% include "@drupalitemsfacade" with {items:columContent} %}
+{% endset %}
+
+<div class="cmp-shadow-box">
+    {% include "@cols" with {content : columContent, mobileModifier: "1", tabletModifier: "2", noGutter:true } only %}
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an shadow-box component!",
+  "image": {
+    "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+    "alt": "happy man"
+  },
+  "quote": {
+    "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+    "footer": "Josh Kazdan, Autosphere"
+  }
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Shadow Box
+ */
+
+/* STARTER CODE
+
+class ShadowBox {
+    constructor($inst) {
+        cponsole.log('Initializing ShadowBox')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/shadow-box/shadow-box.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/shadow-box/shadow-box.js
+                
    • 
+                
  • 
+                    Size:
+                    184 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Shadow Box
+ */
+
+.cmp-shadow-box {
+  > .row {
+    margin-right: 0;
+    margin-left: 0;
+  }
+
+  .cmp-shadow-box-quote {
+    // border: red solid 1px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    // @extend .p-0;
+
+    .cmp-quote {
+      @extend .shadow-box;
+      @extend .px-4vw;
+      @extend .py-8vw;
+    }
+  }
+
+  .cmp-shadow-box-img {
+    position: relative;
+    @extend .shadow-box;
+    // border: blue solid 1px;
+    > .cmp-image {
+      object-fit: cover;
+      width: 100%;
+      max-height: 300px;
+      object-position: top;
+      margin: 0;
+    }
+    > .field--type-entity-reference {
+      margin: 0;
+    }
+    > .node .field--type-image {
+      margin: 0;
+    }
+    > .field--type-image img {
+      margin: 0;
+    }
+
+    .cmp-shadow-box-play-container {
+      @extend .fill-relative-parent;
+      display: flex;
+      align-items: flex-end;
+      button {
+        padding: 4vw;
+      }
+    }
+  }
+
+  @include media-breakpoint-up(md) {
+    .cmp-shadow-box-quote {
+      .cmp-quote {
+        @extend .my-md-4vw;
+      }
+    }
+
+    .cmp-shadow-box-img {
+      > .cmp-image {
+        min-height: 100%;
+        max-height: unset;
+      }
+
+      .cmp-shadow-box-play-container {
+        justify-content: center;
+        align-items: center;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/shadow-box/shadow-box.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/blocks/shadow-box/shadow-box.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.3 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/simpletext.html b/components/detail/simpletext.html
new file mode 100644
index 0000000..04bdc29
--- /dev/null
+++ b/components/detail/simpletext.html
@@ -0,0 +1,2051 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+simpletext component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            simpletext component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<p class="cmp-text">
+    This is an simpletext component!
+</p>

+        
+    
+

+
+    
+    

+    
+        
{% if text is not empty %}
+    <p class="cmp-text">
+        {{text}}
+    </p>
+  {% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an simpletext component!",
+  "heading": "My heading"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Simpletext
+ */
+
+/* STARTER CODE
+
+class Simpletext {
+    constructor($inst) {
+        cponsole.log('Initializing Simpletext')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/simpletext/simpletext.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/simpletext/simpletext.js
+                
    • 
+                
  • 
+                    Size:
+                    187 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Simpletext
+ */
+
+.cmp-simpletext {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/simpletext/simpletext.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/simpletext/simpletext.scss
+                
    • 
+                
  • 
+                    Size:
+                    57 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/skew--default.html b/components/detail/skew--default.html
new file mode 100644
index 0000000..a0ab5e9
--- /dev/null
+++ b/components/detail/skew--default.html
@@ -0,0 +1,2275 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+skew component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            skew component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered      ">
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
<section class="cmp-skew columns is-centered {{ skewClass ?  skewClass : ''}} {{ overlapPrev ?  'overlap-prev-section' : ''}} {{ bgImage ?  'position-relative bg-transparent' : ''}} {{ skewBg ?  skewBg : ''}} {{ classes ?  classes : ''}} {% if overflowUnset %} overflow-unset {% endif %}"
+    {% if inlineBgImage %}  style=" background-image: url({{inlineBgImage}}); background-size: cover; border-bottom: 1px solid white; " {% endif %}
+>
+
+
+{% if skewClass %}
+    <div class="inner-section {{ cmpClass ?  cmpClass : ''}}">
+        {% if content %}
+            {{content}}
+        {% endif %}
+    </div>
+{% else %}
+    
+    {% if bgImage %}
+        {% include "@image" %}
+    {% endif %}
+
+    {% if content %}
+        {{content}}
+    {% endif %}
+
+{% endif %}
+    
+</section>

+    
+

+
+    
+    

+    
+        
+            
+            
/* No context defined for this component. */

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Skew
+ */
+
+/* STARTER CODE
+
+class Skew {
+    constructor($inst) {
+        cponsole.log('Initializing Skew')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.js
+                
    • 
+                
  • 
+                    Size:
+                    169 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Skew
+ */
+
+.cmp-skew {
+  // border: red solid 1px;
+  min-height: 300px;
+  background-color: lightblue;
+  overflow-x: hidden;
+
+  &.bg-transparent {
+    background-color: transparent;
+  }
+  > .cmp-image {
+    position: absolute;
+    @extend .img-fluid;
+    z-index: -1;
+    height: 100%;
+    width: 100%;
+    object-fit: cover;
+  }
+}
+
+.overflow-unset {
+  overflow: unset;
+}
+
+/**
+ *  Main css for Section
+ */
+
+$pi: 3.14159265359;
+$_precision: 10;
+
+@function pow($base, $exp) {
+  $value: $base;
+
+  @if $exp>1 {
+    @for $i from 2 through $exp {
+      $value: $value * $base;
+    }
+  }
+
+  @if $exp < 1 {
+    @for $i from 0 through -$exp {
+      $value: $value / $base;
+    }
+  }
+
+  @return $value;
+}
+
+@function fact($num) {
+  $fact: 1;
+
+  @if $num>0 {
+    @for $i from 1 through $num {
+      $fact: $fact * $i;
+    }
+  }
+
+  @return $fact;
+}
+
+@function _to_unitless_rad($angle) {
+  @if unit($angle) == "deg" {
+    $angle: $angle / 180deg * $pi;
+  }
+
+  @if unit($angle) == "rad" {
+    $angle: $angle / 1rad;
+  }
+
+  @return $angle;
+}
+
+@function sin($angle) {
+  $a: _to_unitless_rad($angle);
+  $sin: $a;
+
+  @for $n from 1 through $_precision {
+    $sin: $sin + (pow(-1, $n) / fact(2 * $n + 1)) * pow($a, (2 * $n + 1));
+  }
+
+  @return $sin;
+}
+
+@function cos($angle) {
+  $a: _to_unitless_rad($angle);
+  $cos: 1;
+
+  @for $n from 1 through $_precision {
+    $cos: $cos + (pow(-1, $n) / fact(2 * $n)) * pow($a, 2 * $n);
+  }
+
+  @return $cos;
+}
+
+@function tan($angle) {
+  @return sin($angle) / cos($angle);
+}
+
+.cmp-section {
+  min-height: 300px;
+  // width: 400px;
+  max-width: 100vw;
+
+  .inner-section {
+    border: red solid 1px;
+  }
+}
+
+.bg-blue {
+  background-color: lightblue;
+}
+
+.skew-30 {
+  transform: skewY(30deg);
+}
+
+// degrees
+@for $i from 0 through 20 {
+  $deg: $i * 1deg;
+  $tan: tan($deg);
+  $hb: $tan * (100/2) * 1vw;
+  .skew-#{$i} {
+    // if we wnat to move it down to compensar el skew
+    transform: skewY($deg) translateY($hb);
+    // where to start the inner content
+    padding-top: $hb;
+    padding-bottom: $hb;
+    .inner-section {
+      transform: skewY(-1 * $deg);
+    }
+
+    &.overlap-prev-section {
+      transform: skewY($deg) translateY($hb * -1);
+    }
+  }
+
+  @include media-breakpoint-up(md) {
+    .skew-md-#{$i} {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+
+      &.overlap-prev-section {
+        transform: skewY($deg) translateY($hb * -1);
+      }
+    }
+  }
+
+  .overlap-next-#{$i} {
+    + .cmp-skew {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb * -1);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+    }
+  }
+
+  .skew-padding-bottom-#{$i} {
+    padding-bottom: $hb * 2;
+  }
+}
+
+.overlap-prev-section-y {
+  transform: translateY(-5.2552117633vw * 2);
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.scss
+                
    • 
+                
  • 
+                    Size:
+                    3.1 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/skew--image.html b/components/detail/skew--image.html
new file mode 100644
index 0000000..49ca51e
--- /dev/null
+++ b/components/detail/skew--image.html
@@ -0,0 +1,2252 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+skew component: Image | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            skew component: Image
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered   position-relative bg-transparent   ">
+
+    <img class="cmp-image " src="https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg" alt="hero" sizes="100vw" srcset="https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w">
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
<section class="cmp-skew columns is-centered {{ skewClass ?  skewClass : ''}} {{ overlapPrev ?  'overlap-prev-section' : ''}} {{ bgImage ?  'position-relative bg-transparent' : ''}} {{ skewBg ?  skewBg : ''}} {{ classes ?  classes : ''}} {% if overflowUnset %} overflow-unset {% endif %}"
+    {% if inlineBgImage %}  style=" background-image: url({{inlineBgImage}}); background-size: cover; border-bottom: 1px solid white; " {% endif %}
+>
+
+
+{% if skewClass %}
+    <div class="inner-section {{ cmpClass ?  cmpClass : ''}}">
+        {% if content %}
+            {{content}}
+        {% endif %}
+    </div>
+{% else %}
+    
+    {% if bgImage %}
+        {% include "@image" %}
+    {% endif %}
+
+    {% if content %}
+        {{content}}
+    {% endif %}
+
+{% endif %}
+    
+</section>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "image",
+  "heading": "not skew with image as background",
+  "bgImage": true,
+  "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg",
+  "sizes": "100vw",
+  "alt": "hero",
+  "srcset": "https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Skew
+ */
+
+/* STARTER CODE
+
+class Skew {
+    constructor($inst) {
+        cponsole.log('Initializing Skew')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.js
+                
    • 
+                
  • 
+                    Size:
+                    169 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Skew
+ */
+
+.cmp-skew {
+  // border: red solid 1px;
+  min-height: 300px;
+  background-color: lightblue;
+  overflow-x: hidden;
+
+  &.bg-transparent {
+    background-color: transparent;
+  }
+  > .cmp-image {
+    position: absolute;
+    @extend .img-fluid;
+    z-index: -1;
+    height: 100%;
+    width: 100%;
+    object-fit: cover;
+  }
+}
+
+.overflow-unset {
+  overflow: unset;
+}
+
+/**
+ *  Main css for Section
+ */
+
+$pi: 3.14159265359;
+$_precision: 10;
+
+@function pow($base, $exp) {
+  $value: $base;
+
+  @if $exp>1 {
+    @for $i from 2 through $exp {
+      $value: $value * $base;
+    }
+  }
+
+  @if $exp < 1 {
+    @for $i from 0 through -$exp {
+      $value: $value / $base;
+    }
+  }
+
+  @return $value;
+}
+
+@function fact($num) {
+  $fact: 1;
+
+  @if $num>0 {
+    @for $i from 1 through $num {
+      $fact: $fact * $i;
+    }
+  }
+
+  @return $fact;
+}
+
+@function _to_unitless_rad($angle) {
+  @if unit($angle) == "deg" {
+    $angle: $angle / 180deg * $pi;
+  }
+
+  @if unit($angle) == "rad" {
+    $angle: $angle / 1rad;
+  }
+
+  @return $angle;
+}
+
+@function sin($angle) {
+  $a: _to_unitless_rad($angle);
+  $sin: $a;
+
+  @for $n from 1 through $_precision {
+    $sin: $sin + (pow(-1, $n) / fact(2 * $n + 1)) * pow($a, (2 * $n + 1));
+  }
+
+  @return $sin;
+}
+
+@function cos($angle) {
+  $a: _to_unitless_rad($angle);
+  $cos: 1;
+
+  @for $n from 1 through $_precision {
+    $cos: $cos + (pow(-1, $n) / fact(2 * $n)) * pow($a, 2 * $n);
+  }
+
+  @return $cos;
+}
+
+@function tan($angle) {
+  @return sin($angle) / cos($angle);
+}
+
+.cmp-section {
+  min-height: 300px;
+  // width: 400px;
+  max-width: 100vw;
+
+  .inner-section {
+    border: red solid 1px;
+  }
+}
+
+.bg-blue {
+  background-color: lightblue;
+}
+
+.skew-30 {
+  transform: skewY(30deg);
+}
+
+// degrees
+@for $i from 0 through 20 {
+  $deg: $i * 1deg;
+  $tan: tan($deg);
+  $hb: $tan * (100/2) * 1vw;
+  .skew-#{$i} {
+    // if we wnat to move it down to compensar el skew
+    transform: skewY($deg) translateY($hb);
+    // where to start the inner content
+    padding-top: $hb;
+    padding-bottom: $hb;
+    .inner-section {
+      transform: skewY(-1 * $deg);
+    }
+
+    &.overlap-prev-section {
+      transform: skewY($deg) translateY($hb * -1);
+    }
+  }
+
+  @include media-breakpoint-up(md) {
+    .skew-md-#{$i} {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+
+      &.overlap-prev-section {
+        transform: skewY($deg) translateY($hb * -1);
+      }
+    }
+  }
+
+  .overlap-next-#{$i} {
+    + .cmp-skew {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb * -1);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+    }
+  }
+
+  .skew-padding-bottom-#{$i} {
+    padding-bottom: $hb * 2;
+  }
+}
+
+.overlap-prev-section-y {
+  transform: translateY(-5.2552117633vw * 2);
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.scss
+                
    • 
+                
  • 
+                    Size:
+                    3.1 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/skew--inlineimage.html b/components/detail/skew--inlineimage.html
new file mode 100644
index 0000000..e9a68ad
--- /dev/null
+++ b/components/detail/skew--inlineimage.html
@@ -0,0 +1,2248 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+skew component: Inlineimage | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            skew component: Inlineimage
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered skew-8     " style=" background-image: url(/images/testimonialbg.png); background-size: cover; border-bottom: 1px solid white; ">
+
+    <div class="inner-section ">
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
<section class="cmp-skew columns is-centered {{ skewClass ?  skewClass : ''}} {{ overlapPrev ?  'overlap-prev-section' : ''}} {{ bgImage ?  'position-relative bg-transparent' : ''}} {{ skewBg ?  skewBg : ''}} {{ classes ?  classes : ''}} {% if overflowUnset %} overflow-unset {% endif %}"
+    {% if inlineBgImage %}  style=" background-image: url({{inlineBgImage}}); background-size: cover; border-bottom: 1px solid white; " {% endif %}
+>
+
+
+{% if skewClass %}
+    <div class="inner-section {{ cmpClass ?  cmpClass : ''}}">
+        {% if content %}
+            {{content}}
+        {% endif %}
+    </div>
+{% else %}
+    
+    {% if bgImage %}
+        {% include "@image" %}
+    {% endif %}
+
+    {% if content %}
+        {{content}}
+    {% endif %}
+
+{% endif %}
+    
+</section>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "inlineBgImage": "/images/testimonialbg.png",
+  "skewClass": "skew-8"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Skew
+ */
+
+/* STARTER CODE
+
+class Skew {
+    constructor($inst) {
+        cponsole.log('Initializing Skew')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.js
+                
    • 
+                
  • 
+                    Size:
+                    169 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Skew
+ */
+
+.cmp-skew {
+  // border: red solid 1px;
+  min-height: 300px;
+  background-color: lightblue;
+  overflow-x: hidden;
+
+  &.bg-transparent {
+    background-color: transparent;
+  }
+  > .cmp-image {
+    position: absolute;
+    @extend .img-fluid;
+    z-index: -1;
+    height: 100%;
+    width: 100%;
+    object-fit: cover;
+  }
+}
+
+.overflow-unset {
+  overflow: unset;
+}
+
+/**
+ *  Main css for Section
+ */
+
+$pi: 3.14159265359;
+$_precision: 10;
+
+@function pow($base, $exp) {
+  $value: $base;
+
+  @if $exp>1 {
+    @for $i from 2 through $exp {
+      $value: $value * $base;
+    }
+  }
+
+  @if $exp < 1 {
+    @for $i from 0 through -$exp {
+      $value: $value / $base;
+    }
+  }
+
+  @return $value;
+}
+
+@function fact($num) {
+  $fact: 1;
+
+  @if $num>0 {
+    @for $i from 1 through $num {
+      $fact: $fact * $i;
+    }
+  }
+
+  @return $fact;
+}
+
+@function _to_unitless_rad($angle) {
+  @if unit($angle) == "deg" {
+    $angle: $angle / 180deg * $pi;
+  }
+
+  @if unit($angle) == "rad" {
+    $angle: $angle / 1rad;
+  }
+
+  @return $angle;
+}
+
+@function sin($angle) {
+  $a: _to_unitless_rad($angle);
+  $sin: $a;
+
+  @for $n from 1 through $_precision {
+    $sin: $sin + (pow(-1, $n) / fact(2 * $n + 1)) * pow($a, (2 * $n + 1));
+  }
+
+  @return $sin;
+}
+
+@function cos($angle) {
+  $a: _to_unitless_rad($angle);
+  $cos: 1;
+
+  @for $n from 1 through $_precision {
+    $cos: $cos + (pow(-1, $n) / fact(2 * $n)) * pow($a, 2 * $n);
+  }
+
+  @return $cos;
+}
+
+@function tan($angle) {
+  @return sin($angle) / cos($angle);
+}
+
+.cmp-section {
+  min-height: 300px;
+  // width: 400px;
+  max-width: 100vw;
+
+  .inner-section {
+    border: red solid 1px;
+  }
+}
+
+.bg-blue {
+  background-color: lightblue;
+}
+
+.skew-30 {
+  transform: skewY(30deg);
+}
+
+// degrees
+@for $i from 0 through 20 {
+  $deg: $i * 1deg;
+  $tan: tan($deg);
+  $hb: $tan * (100/2) * 1vw;
+  .skew-#{$i} {
+    // if we wnat to move it down to compensar el skew
+    transform: skewY($deg) translateY($hb);
+    // where to start the inner content
+    padding-top: $hb;
+    padding-bottom: $hb;
+    .inner-section {
+      transform: skewY(-1 * $deg);
+    }
+
+    &.overlap-prev-section {
+      transform: skewY($deg) translateY($hb * -1);
+    }
+  }
+
+  @include media-breakpoint-up(md) {
+    .skew-md-#{$i} {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+
+      &.overlap-prev-section {
+        transform: skewY($deg) translateY($hb * -1);
+      }
+    }
+  }
+
+  .overlap-next-#{$i} {
+    + .cmp-skew {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb * -1);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+    }
+  }
+
+  .skew-padding-bottom-#{$i} {
+    padding-bottom: $hb * 2;
+  }
+}
+
+.overlap-prev-section-y {
+  transform: translateY(-5.2552117633vw * 2);
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.scss
+                
    • 
+                
  • 
+                    Size:
+                    3.1 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/skew--on.html b/components/detail/skew--on.html
new file mode 100644
index 0000000..040a7d6
--- /dev/null
+++ b/components/detail/skew--on.html
@@ -0,0 +1,2249 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+skew component: On | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            skew component: On
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered skew-8     ">
+
+    <div class="inner-section ">
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
<section class="cmp-skew columns is-centered {{ skewClass ?  skewClass : ''}} {{ overlapPrev ?  'overlap-prev-section' : ''}} {{ bgImage ?  'position-relative bg-transparent' : ''}} {{ skewBg ?  skewBg : ''}} {{ classes ?  classes : ''}} {% if overflowUnset %} overflow-unset {% endif %}"
+    {% if inlineBgImage %}  style=" background-image: url({{inlineBgImage}}); background-size: cover; border-bottom: 1px solid white; " {% endif %}
+>
+
+
+{% if skewClass %}
+    <div class="inner-section {{ cmpClass ?  cmpClass : ''}}">
+        {% if content %}
+            {{content}}
+        {% endif %}
+    </div>
+{% else %}
+    
+    {% if bgImage %}
+        {% include "@image" %}
+    {% endif %}
+
+    {% if content %}
+        {{content}}
+    {% endif %}
+
+{% endif %}
+    
+</section>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "skew warning!",
+  "heading": "warning",
+  "skewClass": "skew-8"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Skew
+ */
+
+/* STARTER CODE
+
+class Skew {
+    constructor($inst) {
+        cponsole.log('Initializing Skew')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.js
+                
    • 
+                
  • 
+                    Size:
+                    169 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Skew
+ */
+
+.cmp-skew {
+  // border: red solid 1px;
+  min-height: 300px;
+  background-color: lightblue;
+  overflow-x: hidden;
+
+  &.bg-transparent {
+    background-color: transparent;
+  }
+  > .cmp-image {
+    position: absolute;
+    @extend .img-fluid;
+    z-index: -1;
+    height: 100%;
+    width: 100%;
+    object-fit: cover;
+  }
+}
+
+.overflow-unset {
+  overflow: unset;
+}
+
+/**
+ *  Main css for Section
+ */
+
+$pi: 3.14159265359;
+$_precision: 10;
+
+@function pow($base, $exp) {
+  $value: $base;
+
+  @if $exp>1 {
+    @for $i from 2 through $exp {
+      $value: $value * $base;
+    }
+  }
+
+  @if $exp < 1 {
+    @for $i from 0 through -$exp {
+      $value: $value / $base;
+    }
+  }
+
+  @return $value;
+}
+
+@function fact($num) {
+  $fact: 1;
+
+  @if $num>0 {
+    @for $i from 1 through $num {
+      $fact: $fact * $i;
+    }
+  }
+
+  @return $fact;
+}
+
+@function _to_unitless_rad($angle) {
+  @if unit($angle) == "deg" {
+    $angle: $angle / 180deg * $pi;
+  }
+
+  @if unit($angle) == "rad" {
+    $angle: $angle / 1rad;
+  }
+
+  @return $angle;
+}
+
+@function sin($angle) {
+  $a: _to_unitless_rad($angle);
+  $sin: $a;
+
+  @for $n from 1 through $_precision {
+    $sin: $sin + (pow(-1, $n) / fact(2 * $n + 1)) * pow($a, (2 * $n + 1));
+  }
+
+  @return $sin;
+}
+
+@function cos($angle) {
+  $a: _to_unitless_rad($angle);
+  $cos: 1;
+
+  @for $n from 1 through $_precision {
+    $cos: $cos + (pow(-1, $n) / fact(2 * $n)) * pow($a, 2 * $n);
+  }
+
+  @return $cos;
+}
+
+@function tan($angle) {
+  @return sin($angle) / cos($angle);
+}
+
+.cmp-section {
+  min-height: 300px;
+  // width: 400px;
+  max-width: 100vw;
+
+  .inner-section {
+    border: red solid 1px;
+  }
+}
+
+.bg-blue {
+  background-color: lightblue;
+}
+
+.skew-30 {
+  transform: skewY(30deg);
+}
+
+// degrees
+@for $i from 0 through 20 {
+  $deg: $i * 1deg;
+  $tan: tan($deg);
+  $hb: $tan * (100/2) * 1vw;
+  .skew-#{$i} {
+    // if we wnat to move it down to compensar el skew
+    transform: skewY($deg) translateY($hb);
+    // where to start the inner content
+    padding-top: $hb;
+    padding-bottom: $hb;
+    .inner-section {
+      transform: skewY(-1 * $deg);
+    }
+
+    &.overlap-prev-section {
+      transform: skewY($deg) translateY($hb * -1);
+    }
+  }
+
+  @include media-breakpoint-up(md) {
+    .skew-md-#{$i} {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+
+      &.overlap-prev-section {
+        transform: skewY($deg) translateY($hb * -1);
+      }
+    }
+  }
+
+  .overlap-next-#{$i} {
+    + .cmp-skew {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb * -1);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+    }
+  }
+
+  .skew-padding-bottom-#{$i} {
+    padding-bottom: $hb * 2;
+  }
+}
+
+.overlap-prev-section-y {
+  transform: translateY(-5.2552117633vw * 2);
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.scss
+                
    • 
+                
  • 
+                    Size:
+                    3.1 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/skew.html b/components/detail/skew.html
new file mode 100644
index 0000000..290588b
--- /dev/null
+++ b/components/detail/skew.html
@@ -0,0 +1,2275 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+skew component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            skew component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered      ">
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
<section class="cmp-skew columns is-centered {{ skewClass ?  skewClass : ''}} {{ overlapPrev ?  'overlap-prev-section' : ''}} {{ bgImage ?  'position-relative bg-transparent' : ''}} {{ skewBg ?  skewBg : ''}} {{ classes ?  classes : ''}} {% if overflowUnset %} overflow-unset {% endif %}"
+    {% if inlineBgImage %}  style=" background-image: url({{inlineBgImage}}); background-size: cover; border-bottom: 1px solid white; " {% endif %}
+>
+
+
+{% if skewClass %}
+    <div class="inner-section {{ cmpClass ?  cmpClass : ''}}">
+        {% if content %}
+            {{content}}
+        {% endif %}
+    </div>
+{% else %}
+    
+    {% if bgImage %}
+        {% include "@image" %}
+    {% endif %}
+
+    {% if content %}
+        {{content}}
+    {% endif %}
+
+{% endif %}
+    
+</section>

+    
+

+
+    
+    

+    
+        
+            
+            
/* No context defined for this component. */

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Skew
+ */
+
+/* STARTER CODE
+
+class Skew {
+    constructor($inst) {
+        cponsole.log('Initializing Skew')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.js
+                
    • 
+                
  • 
+                    Size:
+                    169 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Skew
+ */
+
+.cmp-skew {
+  // border: red solid 1px;
+  min-height: 300px;
+  background-color: lightblue;
+  overflow-x: hidden;
+
+  &.bg-transparent {
+    background-color: transparent;
+  }
+  > .cmp-image {
+    position: absolute;
+    @extend .img-fluid;
+    z-index: -1;
+    height: 100%;
+    width: 100%;
+    object-fit: cover;
+  }
+}
+
+.overflow-unset {
+  overflow: unset;
+}
+
+/**
+ *  Main css for Section
+ */
+
+$pi: 3.14159265359;
+$_precision: 10;
+
+@function pow($base, $exp) {
+  $value: $base;
+
+  @if $exp>1 {
+    @for $i from 2 through $exp {
+      $value: $value * $base;
+    }
+  }
+
+  @if $exp < 1 {
+    @for $i from 0 through -$exp {
+      $value: $value / $base;
+    }
+  }
+
+  @return $value;
+}
+
+@function fact($num) {
+  $fact: 1;
+
+  @if $num>0 {
+    @for $i from 1 through $num {
+      $fact: $fact * $i;
+    }
+  }
+
+  @return $fact;
+}
+
+@function _to_unitless_rad($angle) {
+  @if unit($angle) == "deg" {
+    $angle: $angle / 180deg * $pi;
+  }
+
+  @if unit($angle) == "rad" {
+    $angle: $angle / 1rad;
+  }
+
+  @return $angle;
+}
+
+@function sin($angle) {
+  $a: _to_unitless_rad($angle);
+  $sin: $a;
+
+  @for $n from 1 through $_precision {
+    $sin: $sin + (pow(-1, $n) / fact(2 * $n + 1)) * pow($a, (2 * $n + 1));
+  }
+
+  @return $sin;
+}
+
+@function cos($angle) {
+  $a: _to_unitless_rad($angle);
+  $cos: 1;
+
+  @for $n from 1 through $_precision {
+    $cos: $cos + (pow(-1, $n) / fact(2 * $n)) * pow($a, 2 * $n);
+  }
+
+  @return $cos;
+}
+
+@function tan($angle) {
+  @return sin($angle) / cos($angle);
+}
+
+.cmp-section {
+  min-height: 300px;
+  // width: 400px;
+  max-width: 100vw;
+
+  .inner-section {
+    border: red solid 1px;
+  }
+}
+
+.bg-blue {
+  background-color: lightblue;
+}
+
+.skew-30 {
+  transform: skewY(30deg);
+}
+
+// degrees
+@for $i from 0 through 20 {
+  $deg: $i * 1deg;
+  $tan: tan($deg);
+  $hb: $tan * (100/2) * 1vw;
+  .skew-#{$i} {
+    // if we wnat to move it down to compensar el skew
+    transform: skewY($deg) translateY($hb);
+    // where to start the inner content
+    padding-top: $hb;
+    padding-bottom: $hb;
+    .inner-section {
+      transform: skewY(-1 * $deg);
+    }
+
+    &.overlap-prev-section {
+      transform: skewY($deg) translateY($hb * -1);
+    }
+  }
+
+  @include media-breakpoint-up(md) {
+    .skew-md-#{$i} {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+
+      &.overlap-prev-section {
+        transform: skewY($deg) translateY($hb * -1);
+      }
+    }
+  }
+
+  .overlap-next-#{$i} {
+    + .cmp-skew {
+      // if we wnat to move it down to compensar el skew
+      transform: skewY($deg) translateY($hb * -1);
+      // where to start the inner content
+      padding-top: $hb;
+      padding-bottom: $hb;
+      .inner-section {
+        transform: skewY(-1 * $deg);
+      }
+    }
+  }
+
+  .skew-padding-bottom-#{$i} {
+    padding-bottom: $hb * 2;
+  }
+}
+
+.overlap-prev-section-y {
+  transform: translateY(-5.2552117633vw * 2);
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/skew/skew.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/skew/skew.scss
+                
    • 
+                
  • 
+                    Size:
+                    3.1 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/slider--default.html b/components/detail/slider--default.html
new file mode 100644
index 0000000..ce8a9d2
--- /dev/null
+++ b/components/detail/slider--default.html
@@ -0,0 +1,2177 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+slider component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            slider component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="carouselHeroSlider" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+    <div class="cmp-slider-controls d-flex">
+        <a class="cmp-slider-prev" href="#carouselHeroSlider" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+        <ol class="carousel-indicators">
+            <li data-target="#carouselHeroSlider" data-slide-to="0" class="active"></li>
+            <li data-target="#carouselHeroSlider" data-slide-to="1"></li>
+            <li data-target="#carouselHeroSlider" data-slide-to="2"></li>
+        </ol>
+        <a class="cmp-slider-next" href="#carouselHeroSlider" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+    </div>
+
+    <div class="carousel-inner">
+
+        <div class="carousel-item  active ">
+
+            <img class="cmp-image " src="https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg" alt="">
+
+        </div>
+        <div class="carousel-item ">
+
+            <img class="cmp-image " src="https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg" alt="">
+
+        </div>
+        <div class="carousel-item ">
+
+            <img class="cmp-image " src="https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" alt="">
+
+        </div>
+
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set carouselId = "carouselHeroSlider" %}
+    {% set extraData = {extrainfo: 'hero-slides'} %}
+    {% set template = "image" %}
+    {% include "@slider--dyn" with {carouselId:carouselId, models : models, sameHeight: true, template : template, extraData: extraData} %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an slider component!",
+  "heading": "My heading",
+  "template": "image",
+  "sameHeight": true,
+  "carouselId": "carouselImages",
+  "models": [
+    {
+      "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg"
+    },
+    {
+      "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg"
+    },
+    {
+      "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+import $ from "jquery";
+/**
+ *  This is the main file for Slider
+ */
+
+/* STARTER CODE
+
+class Slider {
+    constructor($inst) {
+        cponsole.log('Initializing Slider')
+    }
+}
+
+*/
+
+function normalizeSlideHeights() {
+  $(".carousel.same-height").each(function() {
+    var items = $(".carousel-item", this);
+    // reset the height
+    items.css("min-height", 0);
+    // set the height
+    var maxHeight = Math.max.apply(
+      null,
+      items
+        .map(function() {
+          return $(this).outerHeight();
+        })
+        .get()
+    );
+    items.css("min-height", maxHeight + "px");
+  });
+}
+
+$(window).on("load resize orientationchange", normalizeSlideHeights);
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.js
+                
    • 
+                
  • 
+                    Size:
+                    687 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Slider
+ */
+
+.cmp-slider {
+  .cmp-slider-controls {
+    justify-content: center;
+    position: absolute;
+    bottom: 2vw;
+    left: 0;
+    width: 100%;
+  }
+  .cmp-slider-controls.bottom {
+    position: relative;
+    bottom: 0;
+  }
+
+  .cmp-slider-prev,
+  .cmp-slider-next {
+    z-index: 1;
+
+    svg {
+      fill: $gray-400;
+      &:hover {
+        fill: $secondary;
+      }
+    }
+  }
+
+  .carousel-indicators {
+    position: unset;
+    margin-right: 2%;
+    margin-left: 2%;
+    li {
+      margin-left: 0;
+      margin-right: 0;
+      height: 2px;
+      background-color: $gray-400;
+
+      &.active {
+        background-color: $secondary;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.scss
+                
    • 
+                
  • 
+                    Size:
+                    677 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/slider--dyn.html b/components/detail/slider--dyn.html
new file mode 100644
index 0000000..3d66e36
--- /dev/null
+++ b/components/detail/slider--dyn.html
@@ -0,0 +1,2255 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+slider component: Dyn | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            slider component: Dyn
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="carouselImages" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+    <div class="cmp-slider-controls d-flex">
+        <a class="cmp-slider-prev" href="#carouselImages" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+        <ol class="carousel-indicators">
+            <li data-target="#carouselImages" data-slide-to="0" class="active"></li>
+            <li data-target="#carouselImages" data-slide-to="1"></li>
+            <li data-target="#carouselImages" data-slide-to="2"></li>
+        </ol>
+        <a class="cmp-slider-next" href="#carouselImages" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+    </div>
+
+    <div class="carousel-inner">
+
+        <div class="carousel-item  active ">
+
+            <img class="cmp-image " src="https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg" alt="">
+
+        </div>
+        <div class="carousel-item ">
+
+            <img class="cmp-image " src="https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg" alt="">
+
+        </div>
+        <div class="carousel-item ">
+
+            <img class="cmp-image " src="https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" alt="">
+
+        </div>
+
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set count = models|length %}
+
+{% set slides %}
+    {% include "@slider--slidessimple" with {models : models, extraData: extraData} %}
+{% endset %}
+
+<div id="{{carouselId}}" class="cmp-slider carousel slide {% if sameHeight %}  same-height {% endif %} " data-ride="carousel" data-interval="false">
+    {% if not controlsBottom %}
+    {% if count > 1 %}
+        <div class="cmp-slider-controls d-flex">
+            <a class="cmp-slider-prev" href="#{{carouselId}}" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+            <ol class="carousel-indicators">
+                {% for i in range(0, count - 1) %}
+                    <li data-target="#{{carouselId}}" data-slide-to="{{i}}" {% if loop.first %} class="active" {% endif %}   ></li>
+                {% endfor %}
+            </ol>
+            <a class="cmp-slider-next" href="#{{carouselId}}" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+        </div>
+    {% endif %}
+    {% endif %}
+    
+
+    <div class="carousel-inner">
+        {% if slides %}
+            {{slides}}
+        {% endif %}
+    </div>
+    {% if controlsBottom %}
+    {% if count > 1 %}
+        <div class="cmp-slider-controls d-flex bottom">
+            <a class="cmp-slider-prev" href="#{{carouselId}}" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+            <ol class="carousel-indicators">
+                {% for i in range(0, count - 1) %}
+                    <li data-target="#{{carouselId}}" data-slide-to="{{i}}" {% if loop.first %} class="active" {% endif %}   ></li>
+                {% endfor %}
+            </ol>
+            <a class="cmp-slider-next" href="#{{carouselId}}" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+        </div>
+    {% endif %}
+    {% endif %}
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an slider component!",
+  "heading": "My heading",
+  "template": "image",
+  "sameHeight": true,
+  "carouselId": "carouselImages",
+  "models": [
+    {
+      "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg"
+    },
+    {
+      "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg"
+    },
+    {
+      "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+import $ from "jquery";
+/**
+ *  This is the main file for Slider
+ */
+
+/* STARTER CODE
+
+class Slider {
+    constructor($inst) {
+        cponsole.log('Initializing Slider')
+    }
+}
+
+*/
+
+function normalizeSlideHeights() {
+  $(".carousel.same-height").each(function() {
+    var items = $(".carousel-item", this);
+    // reset the height
+    items.css("min-height", 0);
+    // set the height
+    var maxHeight = Math.max.apply(
+      null,
+      items
+        .map(function() {
+          return $(this).outerHeight();
+        })
+        .get()
+    );
+    items.css("min-height", maxHeight + "px");
+  });
+}
+
+$(window).on("load resize orientationchange", normalizeSlideHeights);
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.js
+                
    • 
+                
  • 
+                    Size:
+                    687 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Slider
+ */
+
+.cmp-slider {
+  .cmp-slider-controls {
+    justify-content: center;
+    position: absolute;
+    bottom: 2vw;
+    left: 0;
+    width: 100%;
+  }
+  .cmp-slider-controls.bottom {
+    position: relative;
+    bottom: 0;
+  }
+
+  .cmp-slider-prev,
+  .cmp-slider-next {
+    z-index: 1;
+
+    svg {
+      fill: $gray-400;
+      &:hover {
+        fill: $secondary;
+      }
+    }
+  }
+
+  .carousel-indicators {
+    position: unset;
+    margin-right: 2%;
+    margin-left: 2%;
+    li {
+      margin-left: 0;
+      margin-right: 0;
+      height: 2px;
+      background-color: $gray-400;
+
+      &.active {
+        background-color: $secondary;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.scss
+                
    • 
+                
  • 
+                    Size:
+                    677 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/slider--dynamic.html b/components/detail/slider--dynamic.html
new file mode 100644
index 0000000..b03eb2b
--- /dev/null
+++ b/components/detail/slider--dynamic.html
@@ -0,0 +1,2167 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+slider component: Dynamic | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            slider component: Dynamic
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="carouselImages" class="cmp-slider carousel slide   same-height  " data-ride="carousel">
+    <div class="carousel-inner">
+    </div>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div id="{{carouselId}}" class="cmp-slider carousel slide {% if sameHeight %}  same-height {% endif %} " data-ride="carousel">
+    {% if images|length > 1 %}
+        <div class="cmp-slider-controls d-flex justify-content-center">
+            <a class="cmp-slider-prev" href="#{{carouselId}}" role="button" data-slide="prev">
+            {# <span class="carousel-control-prev-icon" aria-hidden="true"></span> #}
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+            <span class="sr-only">Previous</span>
+            </a>
+            <ol class="carousel-indicators">
+
+            {% for img in images %}
+                <li data-target="#{{carouselId}}" data-slide-to="{{loop.index0}}" {% if loop.first %} class="active" {% endif %}   ></li>
+            {% endfor %}
+            
+            </ol>
+            <a class="cmp-slider-next" href="#{{carouselId}}" role="button" data-slide="next">
+            {# <span class="carousel-control-next-icon" aria-hidden="true"></span> #}
+            {# <img  src="/images/next.svg" aria-hidden="true" alt="next"> #}
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+            <span class="sr-only">Next</span>
+            </a>
+        </div>
+    {% endif %}
+    <div class="carousel-inner">
+        {% if images|length > 0 %}
+            {% for img in images %}
+                <div class="carousel-item {% if loop.first %} active {% endif %}">
+                    <img class="d-block w-100" src="{{img}}" alt="First slide">
+                    {# <h2>ONE</h2> #}
+                </div>
+            {% endfor %}
+        {% endif %}
+    </div>
+ 
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an slider component!",
+  "heading": "My heading",
+  "template": "image",
+  "sameHeight": true,
+  "carouselId": "carouselImages",
+  "models": [
+    {
+      "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg"
+    },
+    {
+      "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg"
+    },
+    {
+      "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+import $ from "jquery";
+/**
+ *  This is the main file for Slider
+ */
+
+/* STARTER CODE
+
+class Slider {
+    constructor($inst) {
+        cponsole.log('Initializing Slider')
+    }
+}
+
+*/
+
+function normalizeSlideHeights() {
+  $(".carousel.same-height").each(function() {
+    var items = $(".carousel-item", this);
+    // reset the height
+    items.css("min-height", 0);
+    // set the height
+    var maxHeight = Math.max.apply(
+      null,
+      items
+        .map(function() {
+          return $(this).outerHeight();
+        })
+        .get()
+    );
+    items.css("min-height", maxHeight + "px");
+  });
+}
+
+$(window).on("load resize orientationchange", normalizeSlideHeights);
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.js
+                
    • 
+                
  • 
+                    Size:
+                    687 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Slider
+ */
+
+.cmp-slider {
+  .cmp-slider-controls {
+    justify-content: center;
+    position: absolute;
+    bottom: 2vw;
+    left: 0;
+    width: 100%;
+  }
+  .cmp-slider-controls.bottom {
+    position: relative;
+    bottom: 0;
+  }
+
+  .cmp-slider-prev,
+  .cmp-slider-next {
+    z-index: 1;
+
+    svg {
+      fill: $gray-400;
+      &:hover {
+        fill: $secondary;
+      }
+    }
+  }
+
+  .carousel-indicators {
+    position: unset;
+    margin-right: 2%;
+    margin-left: 2%;
+    li {
+      margin-left: 0;
+      margin-right: 0;
+      height: 2px;
+      background-color: $gray-400;
+
+      &.active {
+        background-color: $secondary;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.scss
+                
    • 
+                
  • 
+                    Size:
+                    677 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/slider--new.html b/components/detail/slider--new.html
new file mode 100644
index 0000000..4ecefff
--- /dev/null
+++ b/components/detail/slider--new.html
@@ -0,0 +1,2209 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+slider component: New | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            slider component: New
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="carouselImages" class="cmp-slider carousel slide   same-height  " data-ride="carousel">
+    <div class="cmp-slider-controls d-flex justify-content-center">
+        <a class="cmp-slider-prev" href="#carouselImages" role="button" data-slide="prev">
+            
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+            <span class="sr-only">Previous</span>
+            </a>
+        <ol class="carousel-indicators">
+
+            <li data-target="#carouselImages" data-slide-to="0" class="active"></li>
+            <li data-target="#carouselImages" data-slide-to="1"></li>
+            <li data-target="#carouselImages" data-slide-to="2"></li>
+
+        </ol>
+        <a class="cmp-slider-next" href="#carouselImages" role="button" data-slide="next">
+            
+            
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+            <span class="sr-only">Next</span>
+            </a>
+    </div>
+    <div class="carousel-inner">
+        <div class="carousel-item  active ">
+            <img class="d-block w-100" src="https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg" alt="First slide">
+
+        </div>
+        <div class="carousel-item ">
+            <img class="d-block w-100" src="https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg" alt="First slide">
+
+        </div>
+        <div class="carousel-item ">
+            <img class="d-block w-100" src="https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" alt="First slide">
+
+        </div>
+    </div>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div id="{{carouselId}}" class="cmp-slider carousel slide {% if sameHeight %}  same-height {% endif %} " data-ride="carousel">
+    {% if images|length > 1 %}
+        <div class="cmp-slider-controls d-flex justify-content-center">
+            <a class="cmp-slider-prev" href="#{{carouselId}}" role="button" data-slide="prev">
+            {# <span class="carousel-control-prev-icon" aria-hidden="true"></span> #}
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+            <span class="sr-only">Previous</span>
+            </a>
+            <ol class="carousel-indicators">
+
+            {% for img in images %}
+                <li data-target="#{{carouselId}}" data-slide-to="{{loop.index0}}" {% if loop.first %} class="active" {% endif %}   ></li>
+            {% endfor %}
+            
+            </ol>
+            <a class="cmp-slider-next" href="#{{carouselId}}" role="button" data-slide="next">
+            {# <span class="carousel-control-next-icon" aria-hidden="true"></span> #}
+            {# <img  src="/images/next.svg" aria-hidden="true" alt="next"> #}
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+            <span class="sr-only">Next</span>
+            </a>
+        </div>
+    {% endif %}
+    <div class="carousel-inner">
+        {% if images|length > 0 %}
+            {% for img in images %}
+                <div class="carousel-item {% if loop.first %} active {% endif %}">
+                    <img class="d-block w-100" src="{{img}}" alt="First slide">
+                    {# <h2>ONE</h2> #}
+                </div>
+            {% endfor %}
+        {% endif %}
+    </div>
+ 
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an slider component!",
+  "heading": "My heading",
+  "template": "image",
+  "sameHeight": true,
+  "carouselId": "carouselImages",
+  "models": [
+    {
+      "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg"
+    },
+    {
+      "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg"
+    },
+    {
+      "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+    }
+  ],
+  "images": [
+    "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg",
+    "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg",
+    "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+import $ from "jquery";
+/**
+ *  This is the main file for Slider
+ */
+
+/* STARTER CODE
+
+class Slider {
+    constructor($inst) {
+        cponsole.log('Initializing Slider')
+    }
+}
+
+*/
+
+function normalizeSlideHeights() {
+  $(".carousel.same-height").each(function() {
+    var items = $(".carousel-item", this);
+    // reset the height
+    items.css("min-height", 0);
+    // set the height
+    var maxHeight = Math.max.apply(
+      null,
+      items
+        .map(function() {
+          return $(this).outerHeight();
+        })
+        .get()
+    );
+    items.css("min-height", maxHeight + "px");
+  });
+}
+
+$(window).on("load resize orientationchange", normalizeSlideHeights);
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.js
+                
    • 
+                
  • 
+                    Size:
+                    687 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Slider
+ */
+
+.cmp-slider {
+  .cmp-slider-controls {
+    justify-content: center;
+    position: absolute;
+    bottom: 2vw;
+    left: 0;
+    width: 100%;
+  }
+  .cmp-slider-controls.bottom {
+    position: relative;
+    bottom: 0;
+  }
+
+  .cmp-slider-prev,
+  .cmp-slider-next {
+    z-index: 1;
+
+    svg {
+      fill: $gray-400;
+      &:hover {
+        fill: $secondary;
+      }
+    }
+  }
+
+  .carousel-indicators {
+    position: unset;
+    margin-right: 2%;
+    margin-left: 2%;
+    li {
+      margin-left: 0;
+      margin-right: 0;
+      height: 2px;
+      background-color: $gray-400;
+
+      &.active {
+        background-color: $secondary;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.scss
+                
    • 
+                
  • 
+                    Size:
+                    677 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/slider--slide.html b/components/detail/slider--slide.html
new file mode 100644
index 0000000..47f5d81
--- /dev/null
+++ b/components/detail/slider--slide.html
@@ -0,0 +1,2141 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+slider component: Slide | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            slider component: Slide
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="carousel-item  active ">
+    Hello
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="carousel-item {% if active %} active {% endif %}">
+    {{slideContent}}
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an slider component!",
+  "heading": "My heading",
+  "template": "image",
+  "sameHeight": true,
+  "carouselId": "carouselImages",
+  "models": [
+    {
+      "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg"
+    },
+    {
+      "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg"
+    },
+    {
+      "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+    }
+  ],
+  "slideContent": "Hello",
+  "active": true
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+import $ from "jquery";
+/**
+ *  This is the main file for Slider
+ */
+
+/* STARTER CODE
+
+class Slider {
+    constructor($inst) {
+        cponsole.log('Initializing Slider')
+    }
+}
+
+*/
+
+function normalizeSlideHeights() {
+  $(".carousel.same-height").each(function() {
+    var items = $(".carousel-item", this);
+    // reset the height
+    items.css("min-height", 0);
+    // set the height
+    var maxHeight = Math.max.apply(
+      null,
+      items
+        .map(function() {
+          return $(this).outerHeight();
+        })
+        .get()
+    );
+    items.css("min-height", maxHeight + "px");
+  });
+}
+
+$(window).on("load resize orientationchange", normalizeSlideHeights);
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.js
+                
    • 
+                
  • 
+                    Size:
+                    687 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Slider
+ */
+
+.cmp-slider {
+  .cmp-slider-controls {
+    justify-content: center;
+    position: absolute;
+    bottom: 2vw;
+    left: 0;
+    width: 100%;
+  }
+  .cmp-slider-controls.bottom {
+    position: relative;
+    bottom: 0;
+  }
+
+  .cmp-slider-prev,
+  .cmp-slider-next {
+    z-index: 1;
+
+    svg {
+      fill: $gray-400;
+      &:hover {
+        fill: $secondary;
+      }
+    }
+  }
+
+  .carousel-indicators {
+    position: unset;
+    margin-right: 2%;
+    margin-left: 2%;
+    li {
+      margin-left: 0;
+      margin-right: 0;
+      height: 2px;
+      background-color: $gray-400;
+
+      &.active {
+        background-color: $secondary;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.scss
+                
    • 
+                
  • 
+                    Size:
+                    677 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/slider--slides.html b/components/detail/slider--slides.html
new file mode 100644
index 0000000..a29da04
--- /dev/null
+++ b/components/detail/slider--slides.html
@@ -0,0 +1,2196 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+slider component: Slides | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            slider component: Slides
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="carouselDyn" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+    <div class="cmp-slider-controls d-flex">
+        <a class="cmp-slider-prev" href="#carouselDyn" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+        <ol class="carousel-indicators">
+            <li data-target="#carouselDyn" data-slide-to="0" class="active"></li>
+            <li data-target="#carouselDyn" data-slide-to="1"></li>
+            <li data-target="#carouselDyn" data-slide-to="2"></li>
+        </ol>
+        <a class="cmp-slider-next" href="#carouselDyn" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+    </div>
+
+    <div class="carousel-inner">
+
+        <div class="carousel-item  active ">
+
+            <img class="cmp-image  d-block w-100 " src="https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg" alt="">
+
+        </div>
+        <div class="carousel-item ">
+
+            <img class="cmp-image  d-block w-100 " src="https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg" alt="">
+
+        </div>
+        <div class="carousel-item ">
+
+            <img class="cmp-image  d-block w-100 " src="https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" alt="">
+
+        </div>
+
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set count = models|length %}
+{% set carouselId = "carouselDyn" %}
+{% set extraData = {classes: "d-block w-100"} %}
+{% if models|length > 0 %}
+    {% set slides %}
+        {% for model in models %}
+            {% if extraData %}
+                {% set model = model|merge(extraData) %}
+            {% endif %}
+            {% set slideContent %}
+                    {# <img class="d-block w-100" src="{{model}}" alt="First slide"> #}
+                    {# {% include "@" ~ template with {src: model.src, classes: "d-block w-100"} %} #}
+                    {% include "@" ~ template with model only %}
+            {% endset %}
+            {% include "@slider--slide" with {slideContent : slideContent, active: loop.first } %}
+        {% endfor %}
+    {% endset %}
+
+    {% include "@slider--dyn" with {count: count, slides : slides} %}
+    {# {{slides}} #}
+{% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an slider component!",
+  "heading": "My heading",
+  "template": "image",
+  "sameHeight": true,
+  "carouselId": "carouselImages",
+  "models": [
+    {
+      "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg"
+    },
+    {
+      "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg"
+    },
+    {
+      "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+import $ from "jquery";
+/**
+ *  This is the main file for Slider
+ */
+
+/* STARTER CODE
+
+class Slider {
+    constructor($inst) {
+        cponsole.log('Initializing Slider')
+    }
+}
+
+*/
+
+function normalizeSlideHeights() {
+  $(".carousel.same-height").each(function() {
+    var items = $(".carousel-item", this);
+    // reset the height
+    items.css("min-height", 0);
+    // set the height
+    var maxHeight = Math.max.apply(
+      null,
+      items
+        .map(function() {
+          return $(this).outerHeight();
+        })
+        .get()
+    );
+    items.css("min-height", maxHeight + "px");
+  });
+}
+
+$(window).on("load resize orientationchange", normalizeSlideHeights);
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.js
+                
    • 
+                
  • 
+                    Size:
+                    687 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Slider
+ */
+
+.cmp-slider {
+  .cmp-slider-controls {
+    justify-content: center;
+    position: absolute;
+    bottom: 2vw;
+    left: 0;
+    width: 100%;
+  }
+  .cmp-slider-controls.bottom {
+    position: relative;
+    bottom: 0;
+  }
+
+  .cmp-slider-prev,
+  .cmp-slider-next {
+    z-index: 1;
+
+    svg {
+      fill: $gray-400;
+      &:hover {
+        fill: $secondary;
+      }
+    }
+  }
+
+  .carousel-indicators {
+    position: unset;
+    margin-right: 2%;
+    margin-left: 2%;
+    li {
+      margin-left: 0;
+      margin-right: 0;
+      height: 2px;
+      background-color: $gray-400;
+
+      &.active {
+        background-color: $secondary;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.scss
+                
    • 
+                
  • 
+                    Size:
+                    677 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/slider--slidessimple.html b/components/detail/slider--slidessimple.html
new file mode 100644
index 0000000..221077b
--- /dev/null
+++ b/components/detail/slider--slidessimple.html
@@ -0,0 +1,2167 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+slider component: Slidessimple | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            slider component: Slidessimple
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="carousel-item  active ">
+
+    <img class="cmp-image " src="https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg" alt="">
+
+</div>
+<div class="carousel-item ">
+
+    <img class="cmp-image " src="https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg" alt="">
+
+</div>
+<div class="carousel-item ">
+
+    <img class="cmp-image " src="https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" alt="">
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% if models|length > 0 %}
+        {% for model in models %}
+            {% if extraData %}
+                {% set model = model|merge(extraData) %}
+            {% endif %}
+            {% set slideContent %}
+                    {% include "@" ~ template with model only %}
+            {% endset %}
+            {% include "@slider--slide" with {slideContent : slideContent, active: loop.first } %}
+        {% endfor %}
+
+{% endif %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an slider component!",
+  "heading": "My heading",
+  "template": "image",
+  "sameHeight": true,
+  "carouselId": "carouselImages",
+  "models": [
+    {
+      "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg"
+    },
+    {
+      "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg"
+    },
+    {
+      "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+import $ from "jquery";
+/**
+ *  This is the main file for Slider
+ */
+
+/* STARTER CODE
+
+class Slider {
+    constructor($inst) {
+        cponsole.log('Initializing Slider')
+    }
+}
+
+*/
+
+function normalizeSlideHeights() {
+  $(".carousel.same-height").each(function() {
+    var items = $(".carousel-item", this);
+    // reset the height
+    items.css("min-height", 0);
+    // set the height
+    var maxHeight = Math.max.apply(
+      null,
+      items
+        .map(function() {
+          return $(this).outerHeight();
+        })
+        .get()
+    );
+    items.css("min-height", maxHeight + "px");
+  });
+}
+
+$(window).on("load resize orientationchange", normalizeSlideHeights);
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.js
+                
    • 
+                
  • 
+                    Size:
+                    687 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Slider
+ */
+
+.cmp-slider {
+  .cmp-slider-controls {
+    justify-content: center;
+    position: absolute;
+    bottom: 2vw;
+    left: 0;
+    width: 100%;
+  }
+  .cmp-slider-controls.bottom {
+    position: relative;
+    bottom: 0;
+  }
+
+  .cmp-slider-prev,
+  .cmp-slider-next {
+    z-index: 1;
+
+    svg {
+      fill: $gray-400;
+      &:hover {
+        fill: $secondary;
+      }
+    }
+  }
+
+  .carousel-indicators {
+    position: unset;
+    margin-right: 2%;
+    margin-left: 2%;
+    li {
+      margin-left: 0;
+      margin-right: 0;
+      height: 2px;
+      background-color: $gray-400;
+
+      &.active {
+        background-color: $secondary;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.scss
+                
    • 
+                
  • 
+                    Size:
+                    677 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/slider.html b/components/detail/slider.html
new file mode 100644
index 0000000..1b14a14
--- /dev/null
+++ b/components/detail/slider.html
@@ -0,0 +1,2200 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+slider component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            slider component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="carouselHeroSlider" class="cmp-slider carousel slide   same-height  " data-ride="carousel" data-interval="false">
+    <div class="cmp-slider-controls d-flex">
+        <a class="cmp-slider-prev" href="#carouselHeroSlider" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+        <ol class="carousel-indicators">
+            <li data-target="#carouselHeroSlider" data-slide-to="0" class="active"></li>
+            <li data-target="#carouselHeroSlider" data-slide-to="1"></li>
+            <li data-target="#carouselHeroSlider" data-slide-to="2"></li>
+        </ol>
+        <a class="cmp-slider-next" href="#carouselHeroSlider" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+    </div>
+
+    <div class="carousel-inner">
+
+        <div class="carousel-item  active ">
+
+            <img class="cmp-image " src="https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg" alt="">
+
+        </div>
+        <div class="carousel-item ">
+
+            <img class="cmp-image " src="https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg" alt="">
+
+        </div>
+        <div class="carousel-item ">
+
+            <img class="cmp-image " src="https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg" alt="">
+
+        </div>
+
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% set carouselId = "carouselHeroSlider" %}
+    {% set extraData = {extrainfo: 'hero-slides'} %}
+    {% set template = "image" %}
+    {% include "@slider--dyn" with {carouselId:carouselId, models : models, sameHeight: true, template : template, extraData: extraData} %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an slider component!",
+  "heading": "My heading",
+  "template": "image",
+  "sameHeight": true,
+  "carouselId": "carouselImages",
+  "models": [
+    {
+      "src": "https://www.capturelandscapes.com/wp-content/uploads/2017/03/DSC2441-Panorama.jpeg"
+    },
+    {
+      "src": "https://born2invest.com/wp-content/uploads/2016/12/The-breathtaking-mysterious-landscapes-of-Chile.jpg"
+    },
+    {
+      "src": "https://scx1.b-cdn.net/csz/news/800/2018/rusticlandsc.jpg"
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+import $ from "jquery";
+/**
+ *  This is the main file for Slider
+ */
+
+/* STARTER CODE
+
+class Slider {
+    constructor($inst) {
+        cponsole.log('Initializing Slider')
+    }
+}
+
+*/
+
+function normalizeSlideHeights() {
+  $(".carousel.same-height").each(function() {
+    var items = $(".carousel-item", this);
+    // reset the height
+    items.css("min-height", 0);
+    // set the height
+    var maxHeight = Math.max.apply(
+      null,
+      items
+        .map(function() {
+          return $(this).outerHeight();
+        })
+        .get()
+    );
+    items.css("min-height", maxHeight + "px");
+  });
+}
+
+$(window).on("load resize orientationchange", normalizeSlideHeights);
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.js
+                
    • 
+                
  • 
+                    Size:
+                    687 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Slider
+ */
+
+.cmp-slider {
+  .cmp-slider-controls {
+    justify-content: center;
+    position: absolute;
+    bottom: 2vw;
+    left: 0;
+    width: 100%;
+  }
+  .cmp-slider-controls.bottom {
+    position: relative;
+    bottom: 0;
+  }
+
+  .cmp-slider-prev,
+  .cmp-slider-next {
+    z-index: 1;
+
+    svg {
+      fill: $gray-400;
+      &:hover {
+        fill: $secondary;
+      }
+    }
+  }
+
+  .carousel-indicators {
+    position: unset;
+    margin-right: 2%;
+    margin-left: 2%;
+    li {
+      margin-left: 0;
+      margin-right: 0;
+      height: 2px;
+      background-color: $gray-400;
+
+      &.active {
+        background-color: $secondary;
+      }
+    }
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/slider/slider.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/slider/slider.scss
+                
    • 
+                
  • 
+                    Size:
+                    677 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/testimonial--default.html b/components/detail/testimonial--default.html
new file mode 100644
index 0000000..958e1cf
--- /dev/null
+++ b/components/detail/testimonial--default.html
@@ -0,0 +1,2302 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+testimonial component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            testimonial component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered skew-md-6     " style=" background-image: url(/images/testimonialbg.png); background-size: cover; border-bottom: 1px solid white; ">
+
+    <div class="inner-section ">
+        <div class="cmp-testimonial">
+            <div class="cmp-testimonial-inner">
+
+                <div id="carouselTestimonialSlider" class="cmp-slider carousel slide  " data-ride="carousel" data-interval="false">
+                    <div class="cmp-slider-controls d-flex">
+                        <a class="cmp-slider-prev" href="#carouselTestimonialSlider" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                        <ol class="carousel-indicators">
+                            <li data-target="#carouselTestimonialSlider" data-slide-to="0" class="active"></li>
+                            <li data-target="#carouselTestimonialSlider" data-slide-to="1"></li>
+                        </ol>
+                        <a class="cmp-slider-next" href="#carouselTestimonialSlider" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                    </div>
+
+                    <div class="carousel-inner">
+
+                        <div class="carousel-item  active ">
+
+                            <div class="cmp-shadow-box">
+
+                                <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+                                    <div class="cmp-shadow-box-img">
+
+                                        <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+                                        <div class="cmp-shadow-box-play-container">
+                                            <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+                                        </div>
+
+                                    </div>
+                                    <div class="cmp-shadow-box-quote">
+                                        <div class="cmp-quote">
+
+                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                                                <footer>Josh Kazdan, Autosphere</footer>
+                                            </blockquote>
+
+                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+
+                        </div>
+                        <div class="carousel-item ">
+
+                            <div class="cmp-shadow-box">
+
+                                <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+                                    <div class="cmp-shadow-box-img">
+
+                                        <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+                                        <div class="cmp-shadow-box-play-container">
+                                            <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+                                        </div>
+
+                                    </div>
+                                    <div class="cmp-shadow-box-quote">
+                                        <div class="cmp-quote">
+
+                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                                                <footer>Josh Kazdan, Autosphere</footer>
+                                            </blockquote>
+
+                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+
+                        </div>
+
+                    </div>
+                </div>
+                <div class="cmp-testimonial-footer">
+                    <p class="cmp-text">
+                        See what over 400,000 technicians can't work without.
+                    </p>
+                    <button class="cmp-button btn btn-outline-secondary">Get Started</button>
+
+                    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                </div>
+            </div>
+        </div>
+
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
{% set skewContent %}
+    <div class="cmp-testimonial">
+        <div class="cmp-testimonial-inner">
+            {% set carouselId = "carouselTestimonialSlider" %}
+            {# {% set extraData = {extrainfo: 'hero-slides'} %} #}
+            {% set template = "shadow-box" %}
+            {% include "@slider--dyn" with {carouselId:carouselId, models : testimonials, sameHeight: false, template : template} %}
+            <div class="cmp-testimonial-footer" >
+                {% include "@simpletext" %}
+                {% include "@button" %}
+            </div>
+        </div>
+    </div>
+{% endset %}
+
+{% include "@skew" with {content: skewContent,skewClass: 'skew-md-6', inlineBgImage: inlineBgImage } %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "testimonials": [
+    {
+      "text": "This is an shadow-box component!",
+      "image": {
+        "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+        "alt": "happy man"
+      },
+      "quote": {
+        "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+        "footer": "Josh Kazdan, Autosphere"
+      }
+    },
+    {
+      "text": "This is an shadow-box component!",
+      "image": {
+        "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+        "alt": "happy man"
+      },
+      "quote": {
+        "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+        "footer": "Josh Kazdan, Autosphere"
+      }
+    }
+  ],
+  "text": "See what over 400,000 technicians can't work without.",
+  "btnText": "Get Started",
+  "inlineBgImage": "/images/testimonialbg.png"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Testimonial
+ */
+
+/* STARTER CODE
+
+class Testimonial {
+    constructor($inst) {
+        cponsole.log('Initializing Testimonial')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/testimonial/testimonial.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/testimonial/testimonial.js
+                
    • 
+                
  • 
+                    Size:
+                    189 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Testimonial
+ */
+
+.cmp-testimonial {
+    display: flex;
+    justify-content: center;
+
+    .cmp-testimonial-inner {
+
+        .cmp-slider {
+            .cmp-slider-controls {
+                padding-left: $oneColumn * 1vw;
+            }
+        }
+        
+
+        @include media-breakpoint-down(sm) {
+
+            .cmp-slider {
+                .cmp-slider-controls {
+                    padding-right: $oneColumn * 1vw;
+                }
+                .carousel-indicators {
+                    flex: 1 1 auto;
+                    display: flex;
+
+                    li {
+                        flex: 1;
+                    }
+
+                }
+            }
+        }
+
+    }
+
+    .cmp-testimonial-footer {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+
+        .cmp-text {
+            margin-top: fromPxtoRem(47);
+            margin-bottom: fromPxtoRem(23);
+        }
+
+        @include media-breakpoint-down(md) {
+            .cmp-button {
+                margin-bottom: fromPxtoRem(47);
+            }
+        }
+    }
+
+
+    @include media-breakpoint-up(md) {
+
+        .cmp-testimonial-inner {
+            width: 76%;
+
+            .cmp-slider-controls {
+                justify-content: start;
+                left: 50%;
+                bottom: 6vw;
+            }
+
+        }
+
+        .cmp-testimonial-footer {
+            align-items: flex-end;
+            text-align: right;
+
+            .cmp-text {
+                max-width: 24vw;
+                margin-top: fromPxtoRem(27);
+                margin-bottom: fromPxtoRem(55);
+            }
+        }
+    }
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/testimonial/testimonial.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/testimonial/testimonial.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.6 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/testimonial--overlap.html b/components/detail/testimonial--overlap.html
new file mode 100644
index 0000000..ade90f7
--- /dev/null
+++ b/components/detail/testimonial--overlap.html
@@ -0,0 +1,2294 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+testimonial component: Overlap | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            testimonial component: Overlap
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered skew-md-6 overlap-prev-section    " style=" background-image: url(/images/testimonialbg.png); background-size: cover; border-bottom: 1px solid white; ">
+
+    <div class="inner-section ">
+        <div class="cmp-testimonial">
+            <div class="cmp-testimonial-inner">
+
+                <div id="carouselTestimonialSlider" class="cmp-slider carousel slide  " data-ride="carousel" data-interval="false">
+                    <div class="cmp-slider-controls d-flex">
+                        <a class="cmp-slider-prev" href="#carouselTestimonialSlider" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                        <ol class="carousel-indicators">
+                            <li data-target="#carouselTestimonialSlider" data-slide-to="0" class="active"></li>
+                            <li data-target="#carouselTestimonialSlider" data-slide-to="1"></li>
+                        </ol>
+                        <a class="cmp-slider-next" href="#carouselTestimonialSlider" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                    </div>
+
+                    <div class="carousel-inner">
+
+                        <div class="carousel-item  active ">
+
+                            <div class="cmp-shadow-box">
+
+                                <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+                                    <div class="cmp-shadow-box-img">
+
+                                        <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+                                        <div class="cmp-shadow-box-play-container">
+                                            <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+                                        </div>
+
+                                    </div>
+                                    <div class="cmp-shadow-box-quote">
+                                        <div class="cmp-quote">
+
+                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                                                <footer>Josh Kazdan, Autosphere</footer>
+                                            </blockquote>
+
+                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+
+                        </div>
+                        <div class="carousel-item ">
+
+                            <div class="cmp-shadow-box">
+
+                                <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+                                    <div class="cmp-shadow-box-img">
+
+                                        <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+                                        <div class="cmp-shadow-box-play-container">
+                                            <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+                                        </div>
+
+                                    </div>
+                                    <div class="cmp-shadow-box-quote">
+                                        <div class="cmp-quote">
+
+                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                                                <footer>Josh Kazdan, Autosphere</footer>
+                                            </blockquote>
+
+                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+
+                        </div>
+
+                    </div>
+                </div>
+                <div class="cmp-testimonial-footer">
+                    <p class="cmp-text">
+                        See what over 400,000 technicians can't work without.
+                    </p>
+                    <button class="cmp-button btn btn-outline-secondary">Get Started</button>
+
+                    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                </div>
+            </div>
+        </div>
+
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
{% set skewContent %}
+    <div class="cmp-testimonial">
+        <div class="cmp-testimonial-inner">
+            {% set carouselId = "carouselTestimonialSlider" %}
+            {# {% set extraData = {extrainfo: 'hero-slides'} %} #}
+            {% set template = "shadow-box" %}
+            {% include "@slider--dyn" with {carouselId:carouselId, models : testimonials, sameHeight: false, template : template} %}
+            <div class="cmp-testimonial-footer" >
+                {% include "@simpletext" %}
+                {% include "@button" %}
+            </div>
+        </div>
+    </div>
+{% endset %}
+
+{% include "@skew" with {content: skewContent,skewClass: 'skew-md-6', inlineBgImage: inlineBgImage } %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "testimonials": [
+    {
+      "text": "This is an shadow-box component!",
+      "image": {
+        "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+        "alt": "happy man"
+      },
+      "quote": {
+        "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+        "footer": "Josh Kazdan, Autosphere"
+      }
+    },
+    {
+      "text": "This is an shadow-box component!",
+      "image": {
+        "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+        "alt": "happy man"
+      },
+      "quote": {
+        "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+        "footer": "Josh Kazdan, Autosphere"
+      }
+    }
+  ],
+  "text": "See what over 400,000 technicians can't work without.",
+  "btnText": "Get Started",
+  "inlineBgImage": "/images/testimonialbg.png",
+  "overlapPrev": true
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Testimonial
+ */
+
+/* STARTER CODE
+
+class Testimonial {
+    constructor($inst) {
+        cponsole.log('Initializing Testimonial')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/testimonial/testimonial.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/testimonial/testimonial.js
+                
    • 
+                
  • 
+                    Size:
+                    189 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Testimonial
+ */
+
+.cmp-testimonial {
+    display: flex;
+    justify-content: center;
+
+    .cmp-testimonial-inner {
+
+        .cmp-slider {
+            .cmp-slider-controls {
+                padding-left: $oneColumn * 1vw;
+            }
+        }
+        
+
+        @include media-breakpoint-down(sm) {
+
+            .cmp-slider {
+                .cmp-slider-controls {
+                    padding-right: $oneColumn * 1vw;
+                }
+                .carousel-indicators {
+                    flex: 1 1 auto;
+                    display: flex;
+
+                    li {
+                        flex: 1;
+                    }
+
+                }
+            }
+        }
+
+    }
+
+    .cmp-testimonial-footer {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+
+        .cmp-text {
+            margin-top: fromPxtoRem(47);
+            margin-bottom: fromPxtoRem(23);
+        }
+
+        @include media-breakpoint-down(md) {
+            .cmp-button {
+                margin-bottom: fromPxtoRem(47);
+            }
+        }
+    }
+
+
+    @include media-breakpoint-up(md) {
+
+        .cmp-testimonial-inner {
+            width: 76%;
+
+            .cmp-slider-controls {
+                justify-content: start;
+                left: 50%;
+                bottom: 6vw;
+            }
+
+        }
+
+        .cmp-testimonial-footer {
+            align-items: flex-end;
+            text-align: right;
+
+            .cmp-text {
+                max-width: 24vw;
+                margin-top: fromPxtoRem(27);
+                margin-bottom: fromPxtoRem(55);
+            }
+        }
+    }
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/testimonial/testimonial.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/testimonial/testimonial.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.6 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/testimonial.html b/components/detail/testimonial.html
new file mode 100644
index 0000000..f679efb
--- /dev/null
+++ b/components/detail/testimonial.html
@@ -0,0 +1,2302 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+testimonial component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            testimonial component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<section class="cmp-skew columns is-centered skew-md-6     " style=" background-image: url(/images/testimonialbg.png); background-size: cover; border-bottom: 1px solid white; ">
+
+    <div class="inner-section ">
+        <div class="cmp-testimonial">
+            <div class="cmp-testimonial-inner">
+
+                <div id="carouselTestimonialSlider" class="cmp-slider carousel slide  " data-ride="carousel" data-interval="false">
+                    <div class="cmp-slider-controls d-flex">
+                        <a class="cmp-slider-prev" href="#carouselTestimonialSlider" role="button" data-slide="prev">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path  fill-rule="evenodd" d="M7.116 0L8.36 1.251 2.485 7.162l5.875 5.911-1.244 1.251L0 7.162z"/>
+                </svg>
+
+                <span class="sr-only">Previous</span>
+            </a>
+                        <ol class="carousel-indicators">
+                            <li data-target="#carouselTestimonialSlider" data-slide-to="0" class="active"></li>
+                            <li data-target="#carouselTestimonialSlider" data-slide-to="1"></li>
+                        </ol>
+                        <a class="cmp-slider-next" href="#carouselTestimonialSlider" role="button" data-slide="next">
+                <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="9" height="15" viewBox="0 0 9 15">
+                    <path fill-rule="evenodd" d="M1.244 0L0 1.251l5.875 5.911L0 13.073l1.244 1.251L8.36 7.162z"/>
+                </svg>
+                <span class="sr-only">Next</span>
+            </a>
+                    </div>
+
+                    <div class="carousel-inner">
+
+                        <div class="carousel-item  active ">
+
+                            <div class="cmp-shadow-box">
+
+                                <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+                                    <div class="cmp-shadow-box-img">
+
+                                        <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+                                        <div class="cmp-shadow-box-play-container">
+                                            <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+                                        </div>
+
+                                    </div>
+                                    <div class="cmp-shadow-box-quote">
+                                        <div class="cmp-quote">
+
+                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                                                <footer>Josh Kazdan, Autosphere</footer>
+                                            </blockquote>
+
+                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+
+                        </div>
+                        <div class="carousel-item ">
+
+                            <div class="cmp-shadow-box">
+
+                                <div class="cmp-cols  cols-1  cols-md-2   no-gutter  ">
+
+                                    <div class="cmp-shadow-box-img">
+
+                                        <img class="cmp-image  img-fluid " src="https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png" alt="happy man">
+
+                                        <div class="cmp-shadow-box-play-container">
+                                            <button class="btn">
+
+        
+
+
+
+
+    <img class="cmp-image " src="/images/play.svg" alt="">
+
+          <span class="sr-only"></span>
+      </button>
+                                        </div>
+
+                                    </div>
+                                    <div class="cmp-shadow-box-quote">
+                                        <div class="cmp-quote">
+
+                                            <img class="cmp-image " src="/images/quote-start.svg" alt="">
+
+                                            <blockquote cite="https://www.huxley.net/bnw/four.html">
+                                                <p>ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.</p>
+                                                <footer>Josh Kazdan, Autosphere</footer>
+                                            </blockquote>
+
+                                            <img class="cmp-image " src="/images/quote-end.svg" alt="">
+
+                                        </div>
+                                    </div>
+
+                                </div>
+                            </div>
+
+                        </div>
+
+                    </div>
+                </div>
+                <div class="cmp-testimonial-footer">
+                    <p class="cmp-text">
+                        See what over 400,000 technicians can't work without.
+                    </p>
+                    <button class="cmp-button btn btn-outline-secondary">Get Started</button>
+
+                    <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+                </div>
+            </div>
+        </div>
+
+    </div>
+
+</section>

+        
+    
+

+
+    
+    

+    
+        
{% set skewContent %}
+    <div class="cmp-testimonial">
+        <div class="cmp-testimonial-inner">
+            {% set carouselId = "carouselTestimonialSlider" %}
+            {# {% set extraData = {extrainfo: 'hero-slides'} %} #}
+            {% set template = "shadow-box" %}
+            {% include "@slider--dyn" with {carouselId:carouselId, models : testimonials, sameHeight: false, template : template} %}
+            <div class="cmp-testimonial-footer" >
+                {% include "@simpletext" %}
+                {% include "@button" %}
+            </div>
+        </div>
+    </div>
+{% endset %}
+
+{% include "@skew" with {content: skewContent,skewClass: 'skew-md-6', inlineBgImage: inlineBgImage } %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "testimonials": [
+    {
+      "text": "This is an shadow-box component!",
+      "image": {
+        "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+        "alt": "happy man"
+      },
+      "quote": {
+        "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+        "footer": "Josh Kazdan, Autosphere"
+      }
+    },
+    {
+      "text": "This is an shadow-box component!",
+      "image": {
+        "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577747528/alldata/juan_iact8j.png",
+        "alt": "happy man"
+      },
+      "quote": {
+        "text": "ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.",
+        "footer": "Josh Kazdan, Autosphere"
+      }
+    }
+  ],
+  "text": "See what over 400,000 technicians can't work without.",
+  "btnText": "Get Started",
+  "inlineBgImage": "/images/testimonialbg.png"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Testimonial
+ */
+
+/* STARTER CODE
+
+class Testimonial {
+    constructor($inst) {
+        cponsole.log('Initializing Testimonial')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/testimonial/testimonial.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/testimonial/testimonial.js
+                
    • 
+                
  • 
+                    Size:
+                    189 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Testimonial
+ */
+
+.cmp-testimonial {
+    display: flex;
+    justify-content: center;
+
+    .cmp-testimonial-inner {
+
+        .cmp-slider {
+            .cmp-slider-controls {
+                padding-left: $oneColumn * 1vw;
+            }
+        }
+        
+
+        @include media-breakpoint-down(sm) {
+
+            .cmp-slider {
+                .cmp-slider-controls {
+                    padding-right: $oneColumn * 1vw;
+                }
+                .carousel-indicators {
+                    flex: 1 1 auto;
+                    display: flex;
+
+                    li {
+                        flex: 1;
+                    }
+
+                }
+            }
+        }
+
+    }
+
+    .cmp-testimonial-footer {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+
+        .cmp-text {
+            margin-top: fromPxtoRem(47);
+            margin-bottom: fromPxtoRem(23);
+        }
+
+        @include media-breakpoint-down(md) {
+            .cmp-button {
+                margin-bottom: fromPxtoRem(47);
+            }
+        }
+    }
+
+
+    @include media-breakpoint-up(md) {
+
+        .cmp-testimonial-inner {
+            width: 76%;
+
+            .cmp-slider-controls {
+                justify-content: start;
+                left: 50%;
+                bottom: 6vw;
+            }
+
+        }
+
+        .cmp-testimonial-footer {
+            align-items: flex-end;
+            text-align: right;
+
+            .cmp-text {
+                max-width: 24vw;
+                margin-top: fromPxtoRem(27);
+                margin-bottom: fromPxtoRem(55);
+            }
+        }
+    }
+}
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/testimonial/testimonial.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/testimonial/testimonial.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.6 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/threelines.html b/components/detail/threelines.html
new file mode 100644
index 0000000..3469d23
--- /dev/null
+++ b/components/detail/threelines.html
@@ -0,0 +1,2043 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+threelines component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            threelines component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>

+        
+    
+

+
+    
+    

+    
+        
<svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an threelines component!",
+  "heading": "My heading"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Threelines
+ */
+
+/* STARTER CODE
+
+class Threelines {
+    constructor($inst) {
+        cponsole.log('Initializing Threelines')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/threelines/threelines.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/threelines/threelines.js
+                
    • 
+                
  • 
+                    Size:
+                    187 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Threelines
+ */
+
+.cmp-threelines {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/threelines/threelines.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/threelines/threelines.scss
+                
    • 
+                
  • 
+                    Size:
+                    57 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/tricolor--default.html b/components/detail/tricolor--default.html
new file mode 100644
index 0000000..d943190
--- /dev/null
+++ b/components/detail/tricolor--default.html
@@ -0,0 +1,2308 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+tricolor component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            tricolor component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-tricolor">
+    <div class="tricolor-layer  cmp-tricolor_start"></div>
+    <div class="tricolor-layer cmp-tricolor_middle"></div>
+    <div class="tricolor-layer cmp-tricolor_end"></div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-tricolor">
+    <div class="tricolor-layer  cmp-tricolor_start"></div>
+    <div class="tricolor-layer cmp-tricolor_middle"></div>
+    <div class="tricolor-layer cmp-tricolor_end"></div>
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an tricolor component!",
+  "heading": "My heading"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    <div class="js-carrousel relative pb1 news-carrousel">
+  <ol
+    class="js-carrousel__control__list news-carrousel__control__list"
+    role="tablist"
+  >
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_0"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_0"
+        aria-selected="true"
+        data-carrousel-control-element-number="1"
+        tabindex="0"
+        ><span class="invisible">First content zone</span></a
+      >
+    </li>
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_1"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_1"
+        aria-selected="false"
+        data-carrousel-control-element-number="2"
+        tabindex="-1"
+        ><span class="invisible">Second content zone</span></a
+      >
+    </li>
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_2"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_2"
+        aria-selected="false"
+        data-carrousel-control-element-number="3"
+        tabindex="-1"
+        ><span class="invisible">Third content zone</span></a
+      >
+    </li>
+  </ol>
+  <div
+    class="js-carrousel__button-container news-carrousel__button-container news-carrousel__button__previous"
+  >
+    <button
+      type="button"
+      id="js-carrousel__button__previous_4dt0u1hjkl"
+      title="See previous content"
+      class="js-carrousel__button__previous news-carrousel__button__button"
+    >
+      <img
+        src="./left.svg"
+        alt="See previous content"
+        class="news-carrousel__button__img"
+      />
+    </button>
+  </div>
+  <div
+    class="js-carrousel__container mod--hidden mb1 news-carrousel__container slide"
+    data-carrousel-btn-previous-img="./left.svg"
+    data-carrousel-btn-next-img="./right.svg"
+    data-carrousel-btn-previous-text="See previous content"
+    data-carrousel-btn-next-text="See next content"
+    data-carrousel-prefix-class="news"
+    data-carrousel-span-text-class="invisible"
+    data-carrousel-transition="slide"
+    data-carrousel-existing-hx="h2"
+    data-carrousel-active-slide="1"
+  >
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_0"
+      aria-hidden="false"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_0"
+    >
+      <h2 tabindex="-1">First content zone</h2>
+      <p>
+        This first example of
+        <a href="https://van11y.net/accessible-carrousel/" class="link"
+          >accessible carrousel</a
+        >
+        is animated. You may test it!
+      </p>
+    </div>
+    <!--
+    -->
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_1"
+      aria-hidden="true"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_1"
+    >
+      <h2 tabindex="-1">Second content zone</h2>
+      <p>
+        You may use <kbd>Tab</kbd>. Controls below can be browsed using
+        <kbd>left</kbd> and <kbd>right</kbd> arrows on the keyboard.
+      </p>
+    </div>
+    <!--
+    -->
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_2"
+      aria-hidden="true"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_2"
+    >
+      <h2 tabindex="-1">Third content zone</h2>
+      <p>
+        This example is using <code>h2</code> headings (which will be used for
+        buttons bellow), so it is the perfect case study.
+      </p>
+    </div>
+    <!--
+      -->
+  </div>
+
+  <div
+    class="js-carrousel__button-container news-carrousel__button-container news-carrousel__button__next"
+  >
+    <button
+      type="button"
+      id="js-carrousel__button__next_4dt0u1hjkl"
+      title="See next content"
+      class="js-carrousel__button__next news-carrousel__button__button"
+    >
+      <img
+        src="./right.svg"
+        alt="See next content"
+        class="news-carrousel__button__img"
+      />
+    </button>
+  </div>
+</div>
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/example-carousel.html
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/example-carousel.html
+                
    • 
+                
  • 
+                    Size:
+                    4.7 KB
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Tricolor
+ */
+
+/* STARTER CODE
+
+class Tricolor {
+    constructor($inst) {
+        cponsole.log('Initializing Tricolor')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/tricolor.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/tricolor.js
+                
    • 
+                
  • 
+                    Size:
+                    181 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Tricolor
+ */
+
+.cmp-tricolor {
+  display: flex;
+  overflow: hidden;
+  margin-left: -16%;
+  margin-right: -16%;
+  min-height: 400px;
+
+  .tricolor-layer {
+    transform: skew(-25deg);
+    width: 70%;
+    opacity: 0.3;
+  }
+
+  .cmp-tricolor_start {
+    background-color: lightcoral;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: gray;
+    width: 70%;
+  }
+
+  .cmp-tricolor_end {
+    background-color: blue;
+  }
+}
+
+.cmp-tricolor__position {
+  position: absolute;
+  overflow-x: hidden;
+  left: 0;
+  width: 100%;
+  height: 100%;
+
+  .tricolor-layer {
+    transform: skew(-25deg);
+    width: 70%;
+    height: 100%;
+    position: absolute;
+  }
+
+  .cmp-tricolor_start {
+    background-color: white;
+    left: -40%;
+    opacity: 1;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: #f8f9fa;
+    width: 40%;
+    left: 30%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_end {
+    background-color: #05056696;
+    right: -40%;
+    opacity: 0.7;
+  }
+}
+
+.cmp-tricolor__position-inverted {
+  position: absolute;
+  overflow-x: hidden;
+  left: 0;
+  width: 100%;
+  height: 100%;
+
+  .tricolor-layer {
+    transform: skew(25deg);
+    width: 70%;
+    height: 100%;
+    position: absolute;
+  }
+
+  .cmp-tricolor_start {
+    background-color: #05056696;
+    left: -40%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: #f8f9fa;
+    width: 40%;
+    left: 30%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_end {
+    background-color: white;
+    right: -40%;
+    opacity: 1;
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/tricolor.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/tricolor.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.5 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/tricolor--position.html b/components/detail/tricolor--position.html
new file mode 100644
index 0000000..6dadba1
--- /dev/null
+++ b/components/detail/tricolor--position.html
@@ -0,0 +1,2335 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+tricolor component: Position | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            tricolor component: Position
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-tricolor__position">
+    <div class="tricolor-layer  cmp-tricolor_start"></div>
+    <div class="tricolor-layer cmp-tricolor_middle"></div>
+    <div class="tricolor-layer cmp-tricolor_end"></div>
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
{% if inverted %}
+<div class="cmp-tricolor__position-inverted">
+    <div class="tricolor-layer  cmp-tricolor_start"></div>
+    <div class="tricolor-layer cmp-tricolor_middle"></div>
+    <div class="tricolor-layer cmp-tricolor_end"></div>
+{% else %}
+<div class="cmp-tricolor__position">
+    <div class="tricolor-layer  cmp-tricolor_start"></div>
+    <div class="tricolor-layer cmp-tricolor_middle"></div>
+    <div class="tricolor-layer cmp-tricolor_end"></div>
+{% endif %}
+
+    
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an tricolor component!",
+  "heading": "My heading"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    <div class="js-carrousel relative pb1 news-carrousel">
+  <ol
+    class="js-carrousel__control__list news-carrousel__control__list"
+    role="tablist"
+  >
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_0"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_0"
+        aria-selected="true"
+        data-carrousel-control-element-number="1"
+        tabindex="0"
+        ><span class="invisible">First content zone</span></a
+      >
+    </li>
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_1"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_1"
+        aria-selected="false"
+        data-carrousel-control-element-number="2"
+        tabindex="-1"
+        ><span class="invisible">Second content zone</span></a
+      >
+    </li>
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_2"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_2"
+        aria-selected="false"
+        data-carrousel-control-element-number="3"
+        tabindex="-1"
+        ><span class="invisible">Third content zone</span></a
+      >
+    </li>
+  </ol>
+  <div
+    class="js-carrousel__button-container news-carrousel__button-container news-carrousel__button__previous"
+  >
+    <button
+      type="button"
+      id="js-carrousel__button__previous_4dt0u1hjkl"
+      title="See previous content"
+      class="js-carrousel__button__previous news-carrousel__button__button"
+    >
+      <img
+        src="./left.svg"
+        alt="See previous content"
+        class="news-carrousel__button__img"
+      />
+    </button>
+  </div>
+  <div
+    class="js-carrousel__container mod--hidden mb1 news-carrousel__container slide"
+    data-carrousel-btn-previous-img="./left.svg"
+    data-carrousel-btn-next-img="./right.svg"
+    data-carrousel-btn-previous-text="See previous content"
+    data-carrousel-btn-next-text="See next content"
+    data-carrousel-prefix-class="news"
+    data-carrousel-span-text-class="invisible"
+    data-carrousel-transition="slide"
+    data-carrousel-existing-hx="h2"
+    data-carrousel-active-slide="1"
+  >
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_0"
+      aria-hidden="false"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_0"
+    >
+      <h2 tabindex="-1">First content zone</h2>
+      <p>
+        This first example of
+        <a href="https://van11y.net/accessible-carrousel/" class="link"
+          >accessible carrousel</a
+        >
+        is animated. You may test it!
+      </p>
+    </div>
+    <!--
+    -->
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_1"
+      aria-hidden="true"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_1"
+    >
+      <h2 tabindex="-1">Second content zone</h2>
+      <p>
+        You may use <kbd>Tab</kbd>. Controls below can be browsed using
+        <kbd>left</kbd> and <kbd>right</kbd> arrows on the keyboard.
+      </p>
+    </div>
+    <!--
+    -->
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_2"
+      aria-hidden="true"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_2"
+    >
+      <h2 tabindex="-1">Third content zone</h2>
+      <p>
+        This example is using <code>h2</code> headings (which will be used for
+        buttons bellow), so it is the perfect case study.
+      </p>
+    </div>
+    <!--
+      -->
+  </div>
+
+  <div
+    class="js-carrousel__button-container news-carrousel__button-container news-carrousel__button__next"
+  >
+    <button
+      type="button"
+      id="js-carrousel__button__next_4dt0u1hjkl"
+      title="See next content"
+      class="js-carrousel__button__next news-carrousel__button__button"
+    >
+      <img
+        src="./right.svg"
+        alt="See next content"
+        class="news-carrousel__button__img"
+      />
+    </button>
+  </div>
+</div>
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/example-carousel.html
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/example-carousel.html
+                
    • 
+                
  • 
+                    Size:
+                    4.7 KB
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Tricolor
+ */
+
+/* STARTER CODE
+
+class Tricolor {
+    constructor($inst) {
+        cponsole.log('Initializing Tricolor')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/tricolor.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/tricolor.js
+                
    • 
+                
  • 
+                    Size:
+                    181 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Tricolor
+ */
+
+.cmp-tricolor {
+  display: flex;
+  overflow: hidden;
+  margin-left: -16%;
+  margin-right: -16%;
+  min-height: 400px;
+
+  .tricolor-layer {
+    transform: skew(-25deg);
+    width: 70%;
+    opacity: 0.3;
+  }
+
+  .cmp-tricolor_start {
+    background-color: lightcoral;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: gray;
+    width: 70%;
+  }
+
+  .cmp-tricolor_end {
+    background-color: blue;
+  }
+}
+
+.cmp-tricolor__position {
+  position: absolute;
+  overflow-x: hidden;
+  left: 0;
+  width: 100%;
+  height: 100%;
+
+  .tricolor-layer {
+    transform: skew(-25deg);
+    width: 70%;
+    height: 100%;
+    position: absolute;
+  }
+
+  .cmp-tricolor_start {
+    background-color: white;
+    left: -40%;
+    opacity: 1;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: #f8f9fa;
+    width: 40%;
+    left: 30%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_end {
+    background-color: #05056696;
+    right: -40%;
+    opacity: 0.7;
+  }
+}
+
+.cmp-tricolor__position-inverted {
+  position: absolute;
+  overflow-x: hidden;
+  left: 0;
+  width: 100%;
+  height: 100%;
+
+  .tricolor-layer {
+    transform: skew(25deg);
+    width: 70%;
+    height: 100%;
+    position: absolute;
+  }
+
+  .cmp-tricolor_start {
+    background-color: #05056696;
+    left: -40%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: #f8f9fa;
+    width: 40%;
+    left: 30%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_end {
+    background-color: white;
+    right: -40%;
+    opacity: 1;
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/tricolor.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/tricolor.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.5 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/tricolor.html b/components/detail/tricolor.html
new file mode 100644
index 0000000..4bb7301
--- /dev/null
+++ b/components/detail/tricolor.html
@@ -0,0 +1,2325 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+tricolor component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            tricolor component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-tricolor">
+    <div class="tricolor-layer  cmp-tricolor_start"></div>
+    <div class="tricolor-layer cmp-tricolor_middle"></div>
+    <div class="tricolor-layer cmp-tricolor_end"></div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-tricolor">
+    <div class="tricolor-layer  cmp-tricolor_start"></div>
+    <div class="tricolor-layer cmp-tricolor_middle"></div>
+    <div class="tricolor-layer cmp-tricolor_end"></div>
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an tricolor component!",
+  "heading": "My heading"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    <div class="js-carrousel relative pb1 news-carrousel">
+  <ol
+    class="js-carrousel__control__list news-carrousel__control__list"
+    role="tablist"
+  >
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_0"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_0"
+        aria-selected="true"
+        data-carrousel-control-element-number="1"
+        tabindex="0"
+        ><span class="invisible">First content zone</span></a
+      >
+    </li>
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_1"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_1"
+        aria-selected="false"
+        data-carrousel-control-element-number="2"
+        tabindex="-1"
+        ><span class="invisible">Second content zone</span></a
+      >
+    </li>
+    <li
+      class="js-carrousel__control__list__item news-carrousel__control__list__item"
+      role="presentation"
+    >
+      <a
+        class="js-carrousel__control__list__link news-carrousel__control__list__link"
+        id="label_id_carrousel_content_4dt0u1hjkl_2"
+        role="tab"
+        aria-controls="id_carrousel_content_4dt0u1hjkl_2"
+        aria-selected="false"
+        data-carrousel-control-element-number="3"
+        tabindex="-1"
+        ><span class="invisible">Third content zone</span></a
+      >
+    </li>
+  </ol>
+  <div
+    class="js-carrousel__button-container news-carrousel__button-container news-carrousel__button__previous"
+  >
+    <button
+      type="button"
+      id="js-carrousel__button__previous_4dt0u1hjkl"
+      title="See previous content"
+      class="js-carrousel__button__previous news-carrousel__button__button"
+    >
+      <img
+        src="./left.svg"
+        alt="See previous content"
+        class="news-carrousel__button__img"
+      />
+    </button>
+  </div>
+  <div
+    class="js-carrousel__container mod--hidden mb1 news-carrousel__container slide"
+    data-carrousel-btn-previous-img="./left.svg"
+    data-carrousel-btn-next-img="./right.svg"
+    data-carrousel-btn-previous-text="See previous content"
+    data-carrousel-btn-next-text="See next content"
+    data-carrousel-prefix-class="news"
+    data-carrousel-span-text-class="invisible"
+    data-carrousel-transition="slide"
+    data-carrousel-existing-hx="h2"
+    data-carrousel-active-slide="1"
+  >
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_0"
+      aria-hidden="false"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_0"
+    >
+      <h2 tabindex="-1">First content zone</h2>
+      <p>
+        This first example of
+        <a href="https://van11y.net/accessible-carrousel/" class="link"
+          >accessible carrousel</a
+        >
+        is animated. You may test it!
+      </p>
+    </div>
+    <!--
+    -->
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_1"
+      aria-hidden="true"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_1"
+    >
+      <h2 tabindex="-1">Second content zone</h2>
+      <p>
+        You may use <kbd>Tab</kbd>. Controls below can be browsed using
+        <kbd>left</kbd> and <kbd>right</kbd> arrows on the keyboard.
+      </p>
+    </div>
+    <!--
+    -->
+    <div
+      class="js-carrousel__content news-carrousel__content carrousel__content"
+      role="tabpanel"
+      id="id_carrousel_content_4dt0u1hjkl_2"
+      aria-hidden="true"
+      aria-labelledby="label_id_carrousel_content_4dt0u1hjkl_2"
+    >
+      <h2 tabindex="-1">Third content zone</h2>
+      <p>
+        This example is using <code>h2</code> headings (which will be used for
+        buttons bellow), so it is the perfect case study.
+      </p>
+    </div>
+    <!--
+      -->
+  </div>
+
+  <div
+    class="js-carrousel__button-container news-carrousel__button-container news-carrousel__button__next"
+  >
+    <button
+      type="button"
+      id="js-carrousel__button__next_4dt0u1hjkl"
+      title="See next content"
+      class="js-carrousel__button__next news-carrousel__button__button"
+    >
+      <img
+        src="./right.svg"
+        alt="See next content"
+        class="news-carrousel__button__img"
+      />
+    </button>
+  </div>
+</div>
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/example-carousel.html
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/example-carousel.html
+                
    • 
+                
  • 
+                    Size:
+                    4.7 KB
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Tricolor
+ */
+
+/* STARTER CODE
+
+class Tricolor {
+    constructor($inst) {
+        cponsole.log('Initializing Tricolor')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/tricolor.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/tricolor.js
+                
    • 
+                
  • 
+                    Size:
+                    181 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Tricolor
+ */
+
+.cmp-tricolor {
+  display: flex;
+  overflow: hidden;
+  margin-left: -16%;
+  margin-right: -16%;
+  min-height: 400px;
+
+  .tricolor-layer {
+    transform: skew(-25deg);
+    width: 70%;
+    opacity: 0.3;
+  }
+
+  .cmp-tricolor_start {
+    background-color: lightcoral;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: gray;
+    width: 70%;
+  }
+
+  .cmp-tricolor_end {
+    background-color: blue;
+  }
+}
+
+.cmp-tricolor__position {
+  position: absolute;
+  overflow-x: hidden;
+  left: 0;
+  width: 100%;
+  height: 100%;
+
+  .tricolor-layer {
+    transform: skew(-25deg);
+    width: 70%;
+    height: 100%;
+    position: absolute;
+  }
+
+  .cmp-tricolor_start {
+    background-color: white;
+    left: -40%;
+    opacity: 1;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: #f8f9fa;
+    width: 40%;
+    left: 30%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_end {
+    background-color: #05056696;
+    right: -40%;
+    opacity: 0.7;
+  }
+}
+
+.cmp-tricolor__position-inverted {
+  position: absolute;
+  overflow-x: hidden;
+  left: 0;
+  width: 100%;
+  height: 100%;
+
+  .tricolor-layer {
+    transform: skew(25deg);
+    width: 70%;
+    height: 100%;
+    position: absolute;
+  }
+
+  .cmp-tricolor_start {
+    background-color: #05056696;
+    left: -40%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_middle {
+    background-color: #f8f9fa;
+    width: 40%;
+    left: 30%;
+    opacity: 0.7;
+  }
+
+  .cmp-tricolor_end {
+    background-color: white;
+    right: -40%;
+    opacity: 1;
+  }
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/tricolor/tricolor.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/tricolor/tricolor.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.5 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/unitmacros.html b/components/detail/unitmacros.html
new file mode 100644
index 0000000..5101b5d
--- /dev/null
+++ b/components/detail/unitmacros.html
@@ -0,0 +1,2056 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+unitmacros component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            unitmacros component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        

+        
+    
+

+
+    
+    

+    
+        
{% macro getSpaces(ctx) %}
+    {% if ctx is defined %}
+        {% set spacesArray = []  %}
+
+            {% if ctx.py is defined %}
+                  {% set spacesArray = spacesArray | merge([ctx.py])  %}
+            {% endif %}
+
+            {% if ctx.px is defined %}
+                  {% set spacesArray = spacesArray | merge([ctx.px])  %}
+            {% endif %}
+            
+            {% if ctx.pyLg is defined %}
+                  {% set spacesArray = spacesArray | merge([ctx.pyLg])  %}
+            {% endif %}
+
+            {% if ctx.pxLg is defined %}
+                  {% set spacesArray = spacesArray | merge([ctx.pxLg])  %}
+            {% endif %}
+            {% if ctx.my is defined %}
+                  {% set spacesArray = spacesArray | merge([ctx.my])  %}
+            {% endif %}
+
+            {% if ctx.mx is defined %}
+                  {% set spacesArray = spacesArray | merge([ctx.mx])  %}
+            {% endif %}
+
+        {% set spaces = spacesArray | join(' ') %}
+        
+        {{spaces}}
+    {% endif %}
+{% endmacro %}

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "text": "This is an unitmacros component!",
+  "heading": "My heading"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Unitmacros
+ */
+
+/* STARTER CODE
+
+class Unitmacros {
+    constructor($inst) {
+        cponsole.log('Initializing Unitmacros')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/unitmacros/unitmacros.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/unitmacros/unitmacros.js
+                
    • 
+                
  • 
+                    Size:
+                    187 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Unitmacros
+ */
+
+.cmp-unitmacros {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/unitmacros/unitmacros.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/unitmacros/unitmacros.scss
+                
    • 
+                
  • 
+                    Size:
+                    57 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/video--default.html b/components/detail/video--default.html
new file mode 100644
index 0000000..212790f
--- /dev/null
+++ b/components/detail/video--default.html
@@ -0,0 +1,2040 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+video component: Default | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            video component: Default
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="player" class="cmp-video" data-plyr-provider="youtube" data-plyr-embed-id="bTqVqk7FSmY">
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div id="player" class="cmp-video"  data-plyr-provider="youtube" data-plyr-embed-id="{{videoId}}">
+   
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "videoId": "bTqVqk7FSmY"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+import $ from "jquery";
+import Plyr from "plyr";
+/**
+ *  This is the main file for Video
+ */
+
+/* STARTER CODE
+
+class Video {
+    constructor($inst) {
+        cponsole.log('Initializing Video')
+    }
+}
+
+*/
+
+$(function() {
+  // const player = new Plyr()
+  const player = new Plyr("#player");
+});
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/video/video.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/video/video.js
+                
    • 
+                
  • 
+                    Size:
+                    308 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Video
+ */
+@import "~plyr/src/sass/plyr";
+
+.cmp-video {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/video/video.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/video/video.scss
+                
    • 
+                
  • 
+                    Size:
+                    78 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/video--iframe.html b/components/detail/video--iframe.html
new file mode 100644
index 0000000..5f94fd0
--- /dev/null
+++ b/components/detail/video--iframe.html
@@ -0,0 +1,2045 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+video component: Iframe | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            video component: Iframe
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="player" class="cmp-video plyr__video-embed">
+    <iframe src="https://www.youtube.com/embed/bTqVqk7FSmY?origin=https://plyr.io&amp;iv_load_policy=3&amp;modestbranding=1&amp;playsinline=1&amp;showinfo=0&amp;rel=0&amp;enablejsapi=1" allowfullscreen allowtransparency allow="autoplay"></iframe>
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div id="player" class="cmp-video plyr__video-embed" >
+    <iframe
+        src="https://www.youtube.com/embed/{{videoId}}?origin=https://plyr.io&amp;iv_load_policy=3&amp;modestbranding=1&amp;playsinline=1&amp;showinfo=0&amp;rel=0&amp;enablejsapi=1"
+        allowfullscreen
+        allowtransparency
+        allow="autoplay"
+    ></iframe>
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "videoId": "bTqVqk7FSmY"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+import $ from "jquery";
+import Plyr from "plyr";
+/**
+ *  This is the main file for Video
+ */
+
+/* STARTER CODE
+
+class Video {
+    constructor($inst) {
+        cponsole.log('Initializing Video')
+    }
+}
+
+*/
+
+$(function() {
+  // const player = new Plyr()
+  const player = new Plyr("#player");
+});
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/video/video.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/video/video.js
+                
    • 
+                
  • 
+                    Size:
+                    308 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Video
+ */
+@import "~plyr/src/sass/plyr";
+
+.cmp-video {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/video/video.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/video/video.scss
+                
    • 
+                
  • 
+                    Size:
+                    78 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/video.html b/components/detail/video.html
new file mode 100644
index 0000000..d055e38
--- /dev/null
+++ b/components/detail/video.html
@@ -0,0 +1,2040 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+video component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            video component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div id="player" class="cmp-video" data-plyr-provider="youtube" data-plyr-embed-id="bTqVqk7FSmY">
+
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div id="player" class="cmp-video"  data-plyr-provider="youtube" data-plyr-embed-id="{{videoId}}">
+   
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "videoId": "bTqVqk7FSmY"
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+import $ from "jquery";
+import Plyr from "plyr";
+/**
+ *  This is the main file for Video
+ */
+
+/* STARTER CODE
+
+class Video {
+    constructor($inst) {
+        cponsole.log('Initializing Video')
+    }
+}
+
+*/
+
+$(function() {
+  // const player = new Plyr()
+  const player = new Plyr("#player");
+});
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/video/video.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/video/video.js
+                
    • 
+                
  • 
+                    Size:
+                    308 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Video
+ */
+@import "~plyr/src/sass/plyr";
+
+.cmp-video {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/video/video.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/01-units/video/video.scss
+                
    • 
+                
  • 
+                    Size:
+                    78 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/whatwedo.html b/components/detail/whatwedo.html
new file mode 100644
index 0000000..44be409
--- /dev/null
+++ b/components/detail/whatwedo.html
@@ -0,0 +1,2164 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+whatwedo component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            whatwedo component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-whatwedo">
+    <div class="cmp-whatwedo__bgdesk d-none d-lg-block">
+
+        <section class="cmp-skew columns is-centered       overflow-unset " style=" background-image: url(/images/carfix2.jpg); background-size: cover; border-bottom: 1px solid white; ">
+
+            <div class="cmp-tricolor__position-inverted">
+                <div class="tricolor-layer  cmp-tricolor_start"></div>
+                <div class="tricolor-layer cmp-tricolor_middle"></div>
+                <div class="tricolor-layer cmp-tricolor_end"></div>
+
+            </div>
+
+        </section>
+    </div>
+    <div class="cmp-whatwedo__bgmobile d-lg-none">
+
+        <section class="cmp-skew columns is-centered skew-8     " style=" background-image: url(/images/carfix2.jpg); background-size: cover; border-bottom: 1px solid white; ">
+
+            <div class="inner-section ">
+                <div class="cmp-whatwedo__mob-bluefilter"></div>
+
+            </div>
+
+        </section>
+    </div>
+    <div class="cmp-whatwedo__about-us">
+
+        <div class="cmp-jumbo ">
+
+            <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+                WHA WE DO
+            </h2>
+
+            <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+            <p class="cmp-text">
+                We are a <strong>data-driven solutions provider</strong> working <strong>hard</strong> and <strong>smart</strong> to help automotive repair shops be the <strong>best they can be</strong>.
+            </p>
+
+            <button class="cmp-button btn btn-outline-secondary">About Us</button>
+
+            <button class="cmp-servcard__more"><img src=images/plus-orange.svg alt="more"> no/ and NO path</button>
+
+        </div>
+
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-whatwedo">
+    <div class="cmp-whatwedo__bgdesk d-none d-lg-block">
+        {% set skewContent %}
+            {% include "@tricolor--position" with {inverted: true} %}
+        {% endset %}
+        {% include "@skew" with {content: skewContent, inlineBgImage: inlineBgImage, overflowUnset: true} %}
+    </div>
+    <div class="cmp-whatwedo__bgmobile d-lg-none">
+        {% set skewContent %}
+            <div class="cmp-whatwedo__mob-bluefilter"></div>
+        {% endset %}
+        {% include "@skew" with {content: skewContent, skewClass : "skew-8"} %}
+    </div>
+    <div class="cmp-whatwedo__about-us">
+        {% include "@jumbo" with jumboContent %}
+    </div>
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "inlineBgImage": "/images/carfix2.jpg",
+  "jumboContent": {
+    "heading": "WHA WE DO",
+    "headingLevel": "h2",
+    "btnText": "About Us",
+    "threelines": true,
+    "text": "We are a <strong>data-driven solutions provider</strong> working <strong>hard</strong> and <strong>smart</strong> to help automotive repair shops be the <strong>best they can be</strong>."
+  }
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    'use strict';
+
+/**
+ *  This is the main file for Whatwedo
+ */
+
+/* STARTER CODE
+
+class Whatwedo {
+    constructor($inst) {
+        cponsole.log('Initializing Whatwedo')
+    }
+}
+
+*/
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/whatwedo/whatwedo.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/whatwedo/whatwedo.js
+                
    • 
+                
  • 
+                    Size:
+                    180 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Whatwedo
+ */
+
+.cmp-whatwedo {
+  width: 100%;
+  max-width: 1600px;
+  height: 1000px;
+  .cmp-whatwedo__bgmobile.d-lg-none {
+    margin-bottom: 140px;
+    .cmp-skew{
+      height: inherit;
+      width: 100%;
+      overflow: hidden;
+      .cmp-whatwedo__mob-bluefilter{
+        width: 100%;
+        height: 500px;
+        background-color: #05056696;
+        opacity: .7;
+        position: absolute;
+        margin-top: -140px;
+      }
+    }
+  }
+  .cmp-whatwedo__about-us{
+    width: 330px;
+    margin: 0px auto;
+    .cmp-jumbo .cmp-text{
+      font-weight: 300;
+    }
+  }
+}
+
+@include  media-breakpoint-up(lg){
+  .cmp-whatwedo {
+    .cmp-whatwedo__bgdesk{
+      height: inherit;
+      width: 100%;
+      position: absolute;
+      z-index: -1;
+      .cmp-skew{
+        margin-top: 0px;
+        height: inherit;
+        width: 100%;
+        position: absolute;
+        z-index: -1;
+        .cmp-tricolor__position-inverted {
+          margin-top: 0px;
+          height: inherit;
+          .cmp-tricolor_start{
+            // display: none;
+          }
+          .cmp-tricolor_middle{
+            // display: none;
+          }
+          .cmp-tricolor_end{
+            // display: none;
+          }
+        }
+      }
+    }
+    .cmp-whatwedo__about-us{
+      width: 530px;
+      float: right;
+      margin: 250px 200px 0px 0px;
+    }
+  }
+
+}
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/whatwedo/whatwedo.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/whatwedo/whatwedo.scss
+                
    • 
+                
  • 
+                    Size:
+                    1.4 KB
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/detail/whoweserve.html b/components/detail/whoweserve.html
new file mode 100644
index 0000000..affd540
--- /dev/null
+++ b/components/detail/whoweserve.html
@@ -0,0 +1,2308 @@
+
+
+
+    
+    
+    
+    
+    
+
+
+
+
+whoweserve component | alldata components
+
+
+
+
+
+
+

+
+    

+        

+    
+    alldata components
+

+
+    

+
+    

+
+        

+            

+            
+
+
+    
+    
+
+

+
+    
+
+    

+    

+        
+            whoweserve component
+            
+    
+    
+
+
+        
+    

+    
+
+

+
+
+
+

+
+
+

+
+
+    

+    

+        

+            
+             
+        

+        

+        

+    

+

+
+
+    

+
+    

+    

+
+    
+
+

+    
+

+
+
+    
+    
+

+    
+        
+        
<div class="cmp-whoweserve">
+
+    <div class="cmp-jumbo  cmp-jumbo__No Button and no simple text ">
+
+        <h2 class="cmp-heading h2  cmp-jumbo__heading    has-line ">
+            Who we serve
+        </h2>
+
+        <svg class="cmp-threelines" xmlns="http://www.w3.org/2000/svg" width="61" height="17" viewBox="0 0 61 17">
+    <g fill="#F16824" fill-rule="evenodd">
+        <path d="M9.59 0L0 17h7.083L17 0zM31.59 0L22 17h7.083L39 0zM53.59 0L44 17h7.083L61 0z"/>
+    </g>
+</svg>
+
+    </div>
+
+    <div class="cmp-servicescards__cardcontainer mx-sm-auto">
+
+        <div class="cmp-cols  cols-1   cols-lg-3  ">
+
+            <div class="field field--name-field-brand-block-info field--type-entity-reference-revisions field--label-hidden field__items">
+
+                <div role="presentation" class="cmp-servcard mobile-overflow mb-sm-3   
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <h2>KYKYN</h2>
+                        <button class="cmp-servcard__more"><img src=/images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow mb-sm-3   
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <h2>KYKYN</h2>
+                        <button class="cmp-servcard__more"><img src=/images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds
+                                and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow mb-sm-3   
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <h2>KYKYN</h2>
+                        <button class="cmp-servcard__more"><img src=/images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow mb-sm-3   
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <h2>KYKYN</h2>
+                        <button class="cmp-servcard__more"><img src=/images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow mb-sm-3   
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <h2>KYKYN</h2>
+                        <button class="cmp-servcard__more"><img src=/images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description  d-none d-lg-block" aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Learn More</a>
+
+                        </div>
+                    </div>
+
+                </div>
+                <div role="presentation" class="cmp-servcard mobile-overflow mb-sm-3   last-card  
+">
+                    <div class="cmp-servcard__image">
+
+                        <div class="cmp-imageblue bg-primary">
+
+                            <img class="cmp-image " src="/images/carfix.jpg" alt="">
+
+                        </div>
+                    </div>
+                    <div class="cmp-servcard__content">
+
+                        <h6 class="cmp-heading h6   ">
+                            Independent collision shops
+                        </h6>
+
+                        <h2>KYKYN</h2>
+                        <button class="cmp-servcard__more"><img src=/images/plus-orange.svg alt="more"></button>
+                        <div class="cmp-servcard__description-lastcard  " aria-hidden="true" aria-expanded="false">
+                            <p class="cmp-text">
+                                Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+                            </p>
+
+                            <a class="cmp-cardlink" href="https://www.google.com">Go to diy site</a>
+
+                        </div>
+                    </div>
+
+                </div>
+            </div>
+
+        </div>
+    </div>
+</div>

+        
+    
+

+
+    
+    

+    
+        
<div class="cmp-whoweserve">
+	{% include "@jumbo" with 
+            {
+                "headingLevel": "h2",
+                "btnText": "",
+                "threelines": true,
+                "modifier": "No Button and no simple text"
+            } 
+        %}
+
+	{% set cardsContent %}
+
+	{% for card in cards %}
+		{% include "@servcard2" with card %}
+	{% endfor %}
+	{% endset %}
+
+
+	{% set drupal %}
+	{% include "@drupalitemsfacade" with {items:cardsContent} %}
+	{% endset %}
+	<div class="cmp-servicescards__cardcontainer mx-sm-auto">
+		{% include "@cols" with {content: drupal, mobileModifier: "1", desktopModifier: "3", } %}
+	</div>
+</div>

+    
+

+
+    
+    

+    
+        
+            
+            
{
+  "heading": "Who we serve",
+  "cards": [
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com",
+      "middlePos": true
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com"
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Learn More",
+      "link": "https://www.google.com",
+      "middlePos": true
+    },
+    {
+      "src": "/images/carfix.jpg",
+      "heading": "Independent collision shops",
+      "headingLevel": "h6",
+      "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
+      "textLink": "Go to diy site",
+      "link": "https://www.google.com",
+      "lastCard": true
+    }
+  ]
+}

+            
+        
+    
+

+
+    
+    
+
+
+

+    

+
+        

+            
+            
+        

+
+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    "use strict";
+
+/**
+ *  This is the main file for Whoweserve
+ */
+
+/* STARTER CODE
+
+class Whoweserve {
+    constructor($inst) {
+        cponsole.log('Initializing Whoweserve')
+    }
+}
+
+*/
+
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/whoweserve/whoweserve.js
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/whoweserve/whoweserve.js
+                
    • 
+                
  • 
+                    Size:
+                    187 Bytes
+                
    • 
+            

+        

+        
+        

+            
    
+                
  • 
+                    Content:
+                    
+                        
    
+                            
+                            
+                                
    /**
+ *  Main css for Whoweserve
+ */
+
+.cmp-whoweserve {
+}
+
    
+                                
+                            
+                        
    
+                        
+                
    • 
+                
  • 
+                    URL:
+                    /components/raw/whoweserve/whoweserve.scss
+                
    • 
+                
  • 
+                    Filesystem Path:
+                    components/groups/whoweserve/whoweserve.scss
+                
    • 
+                
  • 
+                    Size:
+                    57 Bytes
+                
    • 
+            

+        

+        
+    

+

+
+
+
+    
+    

+    
+

+
+    
+    

+    

+        
+        
There are no notes for this item.

+        
+    

+

+
+    
+
+

+
+

+
+
+    
+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/components/groups/Affilliations/Affilliations.config.json b/components/groups/Affilliations/Affilliations.config.json
deleted file mode 100644
index 748e11d..0000000
--- a/components/groups/Affilliations/Affilliations.config.json
+++ /dev/null
@@ -1,9 +0,0 @@
-{
-  "title": "Affilliations component",
-  "context": {
-    "text": "ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.",
-    "heading": "working with 
 the industry’s best",
-    "companies": "@companies",
-    "btnText": "see all"
-  }
-}
diff --git a/components/groups/Affilliations/Affilliations.twig b/components/groups/Affilliations/Affilliations.twig
deleted file mode 100644
index 593abeb..0000000
--- a/components/groups/Affilliations/Affilliations.twig
+++ /dev/null
@@ -1,16 +0,0 @@
-
-

-    {% include "@jumbo" with 
-            {
-                "headingLevel": "h2",
-                "btnText": "",
-                "threelines": true,
-                "modifier": "No Button"
-            } 
-    %}
-    {% include "@companies--bs" with companies only %}
-    

-        {% include "@button"%}
-    

-

-
diff --git a/components/groups/branding/branding.config.json b/components/groups/branding/branding.config.json
deleted file mode 100644
index f796e10..0000000
--- a/components/groups/branding/branding.config.json
+++ /dev/null
@@ -1,41 +0,0 @@
-{
-  "title": "branding component",
-  "context": {
-    "heading": "Why ALLDATA",
-    "text": "ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.",
-    "mobileModifier": "1",
-    "desktopModifier": "3",
-    "overlapPrev": false,
-    "cards": [{
-      "heading": "Repair Information",
-      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
-      "headingLevel": "h3",
-      "alt": "mechanic",
-      "src": "/images/mechanic.svg"
-    },
-    {
-      "heading": "diagnostics",
-      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
-      "headingLevel": "h3",
-      "alt": "tyre",
-      "src": "/images/tyre.svg"
-    },
-    {
-      "heading": "shop management",
-      "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.",
-      "headingLevel": "h3",
-      "alt": "key",
-      "src": "/images/key.svg"
-    }
-  
-  ]
-  },
-  "variants":[
-    {
-      "name": "overlap",
-      "context": {
-        "overlapPrev": true
-      }
-    }
-  ]
-}
\ No newline at end of file
diff --git a/components/groups/branding/branding.twig b/components/groups/branding/branding.twig
deleted file mode 100644
index 8bdb4ab..0000000
--- a/components/groups/branding/branding.twig
+++ /dev/null
@@ -1,26 +0,0 @@
-
-{% set cardsContent %}
-    {% for card in cards %}
-        {% include "@brandingcard" with card only %}
-    {% endfor %}
-{% endset %}
-
-{% set drupal %}
-    {% include "@drupalitemsfacade" with {items:cardsContent} %}
-{% endset %}
-
-{% set content %}
-    {# 
hi
 #}
-    

-        {% include "@jumbo--simple" %}
-        {% include "@cols" with {content: drupal} %}
-    

-{% endset %}
-
-
-{% set skewClass = 'skew-6 branding' %}
-{% set skewBg = 'bg-primary' %}
-{# {% set cmpClass = 'cmp-branding' %} #}
-
-{% include "@skew" %}
-
diff --git a/components/groups/footer/footer.config.json b/components/groups/footer/footer.config.json
deleted file mode 100644
index 2d5532e..0000000
--- a/components/groups/footer/footer.config.json
+++ /dev/null
@@ -1,196 +0,0 @@
-{
-  "title": "footer component",
-  "context": {
-    "footerMenu": [
-      {
-        "listTitle": "Products",
-        "listContents": [
-          {
-            "listText": "ALLDATA Repair"
-          },
-          {
-            "listText": "ALLDTA Collision",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDATA Mobile",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDATA Diagnostics",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDATA Tech-Assits",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDATA Manage Online",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDATA Shop Manager",
-            "listLink": "www.google.com"
-          }
-        ]
-      },
-      {
-        "listTitle": "Support",
-        "listContents": [
-          {
-            "listText": "Popular Topics",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "Product Support",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "Account Support",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "Training & Certificacions",
-            "listLink": "www.google.com"
-          }
-        ]
-      },
-      {
-        "listTitle": "Resources",
-        "listContents": [
-          {
-            "listText": "Product Resources",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "Teach tips",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDATA News",
-            "listLink": "www.google.com"
-          }
-        ]
-      },
-      {
-        "listTitle": "About Us",
-        "listContents": [
-          {
-            "listText": "Partners ",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "Press",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "Carrers",
-            "listLink": "www.google.com"
-          }
-        ]
-      },
-      {
-        "listTitle": "Contact us",
-        "listContents": [
-          {
-            "listText": "800-697-2533",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "Email Customer Support",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "Request a Demo ",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "More Options",
-            "listLink": "www.google.com"
-          }
-        ]
-      },
-      {
-        "listTitle": "Related sites",
-        "listContents": [
-          {
-            "listText": "ALLDATA Mexico",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDTA Canada",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDATA Europe",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "ALLDATA DIY",
-            "listLink": "www.google.com"
-          },
-          {
-            "listText": "AutoZone",
-            "listLink": "www.google.com"
-          }
-        ]
-      }
-    ],
-    "singUpMessage" : "Sign up to receive email updates ",
-    "socialMedia": true,
-    "socialLinks": [
-      {
-        "mediaAvaliable": true,
-        "link": "www.youtube.com",
-        "logo" : "/images/socialyt.svg",
-        "message" : "visit our channel!"
-      },
-      {
-        "mediaAvaliable": false,
-        "link": "www.facebook.com",
-        "logo" : "/images/socialfb.svg",
-        "message" : "visit our channel!"
-      },
-      {
-        "mediaAvaliable": true,
-        "link": "www.linkedin.com",
-        "logo" : "/images/sociallink.svg",
-        "message" : "visit our channel!"
-      },
-      {
-        "mediaAvaliable": true,
-        "link": "www.twitter.com",
-        "logo" : "/images/socialtw.svg",
-        "message" : "visit our channel!"
-      },
-      {
-        "mediaAvaliable": true,
-        "link": "www.instagram.com",
-        "logo" : "/images/socialins.svg",
-        "message" : "visit our channel!"
-      }
-    ],
-    "subfooterList" : [
-      {
-        "text": "© 2019 ALLDATA",
-        "link": "link"
-      },
-      {
-        "text": "An AutoZone Company",
-        "link": "link"
-      },
-      {
-        "text": "Trademarks",
-        "link": "link"
-      },
-      {
-        "text": "Terms of Use",
-        "link": "link"
-      },
-      {
-        "text": "Privacy Policy",
-        "link": "link"
-      }
-    ]
-  }
-}
diff --git a/components/groups/footer/footer.twig b/components/groups/footer/footer.twig
deleted file mode 100644
index 2abefc7..0000000
--- a/components/groups/footer/footer.twig
+++ /dev/null
@@ -1,32 +0,0 @@
-
-

-    

-        

-            {% for menu in footerMenu %}
-                {% include "@collapse-list" with menu %}
-            {% endfor %}
-        

-       
-        

-            {% include "@simpletext" with {text:singUpMessage} %}
-            Sing Up
-             {% if socialMedia %}
-             
-            {% endif %}
-        

-    

-    

-        
    
-            {% for item in subfooterList %}
-            
  • {{item.text}}
    • 
-            {% endfor %}
-        

-    

-

\ No newline at end of file
diff --git a/components/groups/header/header.config.json b/components/groups/header/header.config.json
deleted file mode 100644
index 4619672..0000000
--- a/components/groups/header/header.config.json
+++ /dev/null
@@ -1,145 +0,0 @@
-{
-  "title": "header component",
-  "context": {
-    "text": "This is an header component!",
-    "heading": "My heading",
-    "menus": [
-      {
-        "url": "/PRODUCTS",
-        "name": "PRODUCTS",
-        "submenus": [
-          {
-            "name": "Repair Information",
-            "submenus": [
-              "ALLDATA Repair",
-              "ALLDATA Collision",
-              "ALLDATA Mobile"
-            ]
-          },
-          {
-            "name": "Diagnostics",
-            "submenus": [
-              "ALLDATA Manage Onlie",
-              "ALLDATA Diagnostics",
-              "ALLDATA Tech-Assist"
-            ]
-          },
-          {
-            "name": "shop management",
-            "submenus": ["ALLDATA Manage Onlie", "ALLDATA Titan"]
-          },
-          {
-            "name": "What's Right For My Shop",
-            "submenus": [],
-            "topicImage": "/images/workshop.png"
-          },
-          {
-            "name": "Testimonials",
-            "submenus": [],
-            "topicImage": "/images/workshop.png"
-          }
-        ]
-      },
-      {
-        "url": "/SUPPORT",
-        "name": "SUPPORT",
-        "submenus": [
-          {
-            "name": "Popular Topics",
-            "submenus": [
-              "Getting Started",
-              "Recover User Name or Password",
-              "Vehicle Information Request",
-              "Login Center"
-            ]
-          },
-          {
-            "name": "product support",
-            "submenus": [
-              "ALLDATA Repair",
-              "ALLDATA Collision",
-              "ALLDATA Mobile",
-              "ALLDATA Manage Onlie",
-              "ALLDATA Diagnostics",
-              "ALLDATA Tech-Assist"
-            ]
-          },
-          {
-            "name": "Account & billing support",
-            "submenus": ["Billing Options", "Account Options"]
-          },
-          {
-            "name": "Training & certifications",
-            "submenus": [
-              "Product Training",
-              "Traninig Videos",
-              "On-Demand Webinars",
-              "CAIS Certificaiton Program"
-            ]
-          },
-          { "name": "Contact customer support", "submenus": ["800-859-3282"] }
-        ]
-      },
-      {
-        "url": "/RESOURCES",
-        "name": "RESOURCES",
-        "submenus": [
-          {
-            "name": "product resources",
-            "submenus": [
-              "ALLDATA Repair",
-              "ALLDATA Collision",
-              "ALLDATA Mobile",
-              "ALLDATA Manage Onlie",
-              "ALLDATA Diagnostics",
-              "ALLDATA Tech-Assist"
-            ]
-          },
-          {
-            "name": "ALLDATA news by topic",
-            "submenus": [
-              "General Auto Repair",
-              "Collision Auto Repair",
-              "Shop Management",
-              "Best Practices",
-              "Training",
-              "News",
-              "Events"
-            ]
-          },
-          { "name": "ALLDATA News", "submenus": ["Latest Edition"] },
-          { "name": "Tech Tips", "submenus": [] },
-          { "name": "Industry Webinars", "submenus": [] }
-        ]
-      },
-      {
-        "url": "/ABOUT US",
-        "name": "ABOUT US",
-        "image": "/images/team.png",
-        "submenus": [
-          { "name": "ALLDATA LEADERSHIP" },
-          { "name": "PARNERS" },
-          { "name": "PRESS" },
-          { "name": "CARRERS" },
-          { "name": "CONTACT" }
-        ]
-      },
-      { "url": "/BUY NOW", "name": "BUY NOW", "submenus": [] }
-    ],
-    "menusSetup": [
-      { "url": "/call", "name": "800-697-2533", "submenus": [] },
-      { "url": "/rep", "name": "CONTACT A REP", "submenus": [] },
-      {
-        "url": "/RESOURCES",
-        "name": "US",
-        "submenus": ["Canada", "Europe", "Mexico", "US"]
-      },
-      {
-        "url": "/ABOUT US",
-        "name": "ENGLISH",
-        "submenus": ["English", "Español", "Français"]
-      },
-      { "url": "/login", "name": "LOGIN", "submenus": [] }
-    ]
-  }
-}
diff --git a/components/groups/header/header.twig b/components/groups/header/header.twig
deleted file mode 100644
index 46398d6..0000000
--- a/components/groups/header/header.twig
+++ /dev/null
@@ -1,189 +0,0 @@
-
-
-
-

-   
-    
-    

-        

-            
-        

-        

-            
-        

-        

-    

-    
-    

-        

-            {% include "@image" with {src: "/images/burguermenu.svg", alt:"Menu"}%}
-            
-            {% include "@image" with {src: "/images/cart.svg", alt:"Cart"}%}
-            {% include "@image" with {src: "/images/search.svg", alt:"Search"}%}
-            
-        

-        

-            
-        

-    

-

-
diff --git a/components/groups/hero/README.md b/components/groups/hero/README.md
deleted file mode 100644
index 91a0bde..0000000
--- a/components/groups/hero/README.md
+++ /dev/null
@@ -1,3 +0,0 @@
-## Questions
-
-* do the background Image Changes when we change the slide or just the copy and the button??
\ No newline at end of file
diff --git a/components/groups/hero/hero--slider.twig b/components/groups/hero/hero--slider.twig
deleted file mode 100644
index f313228..0000000
--- a/components/groups/hero/hero--slider.twig
+++ /dev/null
@@ -1,25 +0,0 @@
-
-
-{% set columContent %}
-  {# 
columncontent
 #}
-    {% set carouselId = "carouselHeroSlider" %}
-    {% set extraData = {extrainfo: 'hero-slides'} %}
-    {% set template = "jumbo" %}
-    {% include "@slider--dyn" with {carouselId:carouselId, models : heroes, sameHeight: true, template : template, extraData: extraData} %}
-{% endset %}
-
-{% set drupal %}
-  {% include "@drupalitemsfacade" with {items:columContent} %}
-{% endset %}
-
-{% set skewContent %}
-
-  {% include "@tricolor--position" %}
-  

-    {% include "@cols" with {content : drupal, mobileModifier: "1", tabletModifier: "2", } only %}
-  

-{% endset %}
-
-{% include "@skew" with {content: skewContent, classes: 'overlap-next-6' } %}
-
-{# {{content}} #}
diff --git a/components/groups/hero/hero.config.json b/components/groups/hero/hero.config.json
deleted file mode 100644
index 12fd4df..0000000
--- a/components/groups/hero/hero.config.json
+++ /dev/null
@@ -1,42 +0,0 @@
-{
-  "title": "hero component",
-  "context": {
-    "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
-    "heading": "AUTOMOTIVE INTELLIGENCE",
-    "headingLevel": "h1",
-    "btnText": "shop products",
-    "threelines": true,
-    "bgImage": true,
-    "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg",
-    "sizes": "100vw",
-    "alt": "hero",
-    "srcset": "https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w"
-
-  },
-  "variants": [{
-    "name": "slider",
-    "context": {
-      "heroes": [{
-          "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
-          "heading": "KYAUTOMOTIVE INTELLIGENCE",
-          "headingLevel": "h1",
-          "btnText": "shop products",
-          "threelines": true,
-          "bgImage": true
-        }, {
-          "text": "From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.",
-          "heading": "Testing Carousel",
-          "headingLevel": "h1",
-          "btnText": "hello world",
-          "threelines": true,
-          "bgImage": true
-        }
-      ],
-      "src": "https://res.cloudinary.com/alldataborn/image/upload/v1577487943/alldata/hero_jhnfsz.jpg",
-      "sizes": "100vw",
-      "alt": "hero",
-      "srcset": "https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_200/v1577487943/alldata/hero_jhnfsz.jpg 200w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_400/v1577487943/alldata/hero_jhnfsz.jpg 400w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_600/v1577487943/alldata/hero_jhnfsz.jpg 600w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_800/v1577487943/alldata/hero_jhnfsz.jpg 800w, https://res.cloudinary.com/alldataborn/image/upload/q_auto,w_1000/v1577487943/alldata/hero_jhnfsz.jpg 1000w"
-
-    }
-  }]
-}
\ No newline at end of file
diff --git a/components/groups/hero/hero.twig b/components/groups/hero/hero.twig
deleted file mode 100644
index 1b21a53..0000000
--- a/components/groups/hero/hero.twig
+++ /dev/null
@@ -1,23 +0,0 @@
-
-
-{% set columContent %}
-  {# 
columncontent
 #}
-    {% include "@jumbo" %}  
-{% endset %}
-
-{% set drupal %}
-  {% include "@drupalitemsfacade" with {items:columContent} %}
-{% endset %}
-
-
-{% set skewContent %}
-
-  {% include "@tricolor--position" %}
-  

-    {% include "@cols" with {content : drupal, mobileModifier: "1", tabletModifier: "2", } only %}
-  

-{% endset %}
-
-{% include "@skew" with {content: skewContent } %}
-
-{# {{content}} #}
diff --git a/components/groups/latest/latest.config.json b/components/groups/latest/latest.config.json
deleted file mode 100644
index e5d8179..0000000
--- a/components/groups/latest/latest.config.json
+++ /dev/null
@@ -1,29 +0,0 @@
-{
-  "title": "latest component",
-  "context": {
-    "heading": "see the latest",
-    "btnText": "see this month's issue of alldata news",
-    "cards": [
-      {
-        "latestTitle": "News",
-        "latestLink": "see all news",
-        "src": "/images/carfix.jpg",
-        "heading": "Five ways technology can help your dealership service",
-        "headingLevel": "h6",
-        "text": "At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...",
-        "textLink" : "Learn More",
-        "link" : "https://www.google.com"
-      }, 
-      {
-        "latestTitle": "Teach tips",
-        "latestLink": "See all tips",
-        "src": "/images/carfix.jpg",
-        "heading": "Five ways technology can help your dealership service",
-        "headingLevel": "h6",
-        "text": "At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...",
-        "textLink" : "Learn More",
-        "link" : "https://www.google.com"
-      }
-    ]
-  }
-}
diff --git a/components/groups/latest/latest.twig b/components/groups/latest/latest.twig
deleted file mode 100644
index 0a1d364..0000000
--- a/components/groups/latest/latest.twig
+++ /dev/null
@@ -1,28 +0,0 @@
-{% set content %}
-

-    

-        {% include "@heading" with 
-            {
-                "headingLevel": "h2",
-                "threelines": true,
-            } 
-        %}
-
-        

-            

-                {% for card in cards %}
-                

-                    {% include "@latestcard" with card %}
-                

-                {% endfor %}
-                

-                    {% include "@button" %}
-                

-            

-        

-    

-
-

-{% endset %}
-
-{% include "@skew" with {content : content, skewBg: 'bg-primary-100', skewClass:'skew-6' } %}
\ No newline at end of file
diff --git a/components/groups/serve-wedo/serve-wedo.config.json b/components/groups/serve-wedo/serve-wedo.config.json
deleted file mode 100644
index eb97b68..0000000
--- a/components/groups/serve-wedo/serve-wedo.config.json
+++ /dev/null
@@ -1,67 +0,0 @@
-{
-  "title": "serve-wedo component",
-  "context": {
-    "heading": "Who we serve",
-    "cards": [
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com"
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com",
-        "middlePos": true
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com"
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com"
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com",
-        "middlePos": true
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Go to diy site",
-        "link": "https://www.google.com",
-        "lastCard": true
-      }
-    ],
-    "inlineBgImage": "/images/carfix2.jpg",
-    "jumboContent": {
-      "heading": "WHA WE DO",
-      "headingLevel": "h2",
-      "btnText": "About Us",
-      "threelines": true,
-      "text": "We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be."
-    }
-  }
-}
diff --git a/components/groups/serve-wedo/serve-wedo.twig b/components/groups/serve-wedo/serve-wedo.twig
deleted file mode 100644
index d685e6f..0000000
--- a/components/groups/serve-wedo/serve-wedo.twig
+++ /dev/null
@@ -1,32 +0,0 @@
-
-

-    {% include "@tricolor--position" with {inverted: true}%}
-    

-        {% include "@jumbo" with 
-            {
-                "headingLevel": "h2",
-                "btnText": "",
-                "threelines": true,
-                "modifier": "No Button and no simple text"
-            } 
-        %}
-        

-     
-            {% set cardsContent %}
-                {% for card in cards %}
-                    {% include "@servcard" with card %}
-                {% endfor %}
-            {% endset %}
-
-            {% include "@drupalitemsfacade" with {items:cardsContent} %}
-        

-    

-    

-        {% include "@image" with {src: inlineBgImage} %}
-    

-    

-        

-        {% include "@jumbo" with jumboContent %}
-        

-    

-

\ No newline at end of file
diff --git a/components/groups/servicescards/servicescards.config.json b/components/groups/servicescards/servicescards.config.json
deleted file mode 100644
index 8712429..0000000
--- a/components/groups/servicescards/servicescards.config.json
+++ /dev/null
@@ -1,68 +0,0 @@
-{
-  "title": "servicescards component",
-  "context": {
-    "heading": "Who we serve",
-    "cards": [
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink" : "Learn More",
-        "link" : "https://www.google.com"
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink" : "Learn More",
-        "link" : "https://www.google.com",
-        "middlePos" : true
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink" : "Learn More",
-        "link" : "https://www.google.com"
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink" : "Learn More",
-        "link" : "https://www.google.com"
-        
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink" : "Learn More",
-        "link" : "https://www.google.com",
-        "middlePos" : true
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink" : "Go to diy site",
-        "link" : "https://www.google.com",
-        "lastCard": true
-      }
-    ],
-    "inlineBgImage": "/images/carfix2.jpg",
-    "jumboContent":
-    {
-      "headingLevel": "h2",
-      "btnText": "About Us",
-      "threelines": true,
-      "text" : "We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be."
-    }
-  }
-}
diff --git a/components/groups/servicescards/servicescards.twig b/components/groups/servicescards/servicescards.twig
deleted file mode 100644
index ad1eccc..0000000
--- a/components/groups/servicescards/servicescards.twig
+++ /dev/null
@@ -1,34 +0,0 @@
-{% set skewContent %}
-    

-        {% include "@tricolor--position" with {inverted: true}%}
-        {% include "@jumbo" with 
-            {
-                "headingLevel": "h2",
-                "btnText": "",
-                "threelines": true,
-                "modifier": "No Button and no simple text"
-            } 
-        %}
-
-
-        {% set cardsContent %}
-            
-            {% for card in cards %}
-                {% include "@servcard" with card %}
-            {% endfor %}
-        {% endset %}
-
-
-        {% set drupal %}
-            {% include "@drupalitemsfacade" with {items:cardsContent} %}
-        {% endset %}
-        

-            {% include "@cols" with {content: drupal, mobileModifier: "1", desktopModifier: "3", noGutter:true} %}
-        

-     
-        
-    

-{% endset %}
-        
-
-{% include "@skew" with {content: skewContent, overflowUnset: true, inlineBgImage: inlineBgImage} %}
diff --git a/components/groups/testimonial/testimonial.config.json b/components/groups/testimonial/testimonial.config.json
deleted file mode 100644
index 7abb277..0000000
--- a/components/groups/testimonial/testimonial.config.json
+++ /dev/null
@@ -1,18 +0,0 @@
-{
-  "title": "testimonial component",
-  "context": {
-    "testimonials": [
-      "@shadow-box",
-      "@shadow-box"
-    ],
-    "text":"See what over 400,000 technicians can't work without.",
-    "btnText":"Get Started",
-    "inlineBgImage": "/images/testimonialbg.png"
-  },
-  "variants":[
-    {"name": "overlap",
-    "context":{
-      "overlapPrev": true
-    }}
-  ]
-}
diff --git a/components/groups/testimonial/testimonial.twig b/components/groups/testimonial/testimonial.twig
deleted file mode 100644
index ed4c228..0000000
--- a/components/groups/testimonial/testimonial.twig
+++ /dev/null
@@ -1,17 +0,0 @@
-
-{% set skewContent %}
-    

-        

-            {% set carouselId = "carouselTestimonialSlider" %}
-            {# {% set extraData = {extrainfo: 'hero-slides'} %} #}
-            {% set template = "shadow-box" %}
-            {% include "@slider--dyn" with {carouselId:carouselId, models : testimonials, sameHeight: false, template : template} %}
-            

-                {% include "@simpletext" %}
-                {% include "@button" %}
-            

-        

-    

-{% endset %}
-
-{% include "@skew" with {content: skewContent,skewClass: 'skew-md-6', inlineBgImage: inlineBgImage } %}
\ No newline at end of file
diff --git a/components/groups/whatwedo/whatwedo.config.json b/components/groups/whatwedo/whatwedo.config.json
deleted file mode 100644
index 9b51fac..0000000
--- a/components/groups/whatwedo/whatwedo.config.json
+++ /dev/null
@@ -1,14 +0,0 @@
-{
-  "title": "whatwedo component",
-  "context": {
-    "inlineBgImage": "/images/carfix2.jpg",
-    "jumboContent":
-    {
-      "heading": "WHA WE DO",
-      "headingLevel": "h2",
-      "btnText": "About Us",
-      "threelines": true,
-      "text" : "We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be."
-    }
-  }
-}
diff --git a/components/groups/whatwedo/whatwedo.twig b/components/groups/whatwedo/whatwedo.twig
deleted file mode 100644
index 64b125d..0000000
--- a/components/groups/whatwedo/whatwedo.twig
+++ /dev/null
@@ -1,20 +0,0 @@
-
-

-    

-        {% set skewContent %}
-            {% include "@tricolor--position" with {inverted: true} %}
-        {% endset %}
-        {% include "@skew" with {content: skewContent, inlineBgImage: inlineBgImage, overflowUnset: true} %}
-    

-    

-        {% set skewContent %}
-            

-        {% endset %}
-        {% include "@skew" with {content: skewContent, skewClass : "skew-8"} %}
-    

-    

-        {% include "@jumbo" with jumboContent %}
-    

-

-
-
diff --git a/components/groups/whoweserve/whoweserve.config.json b/components/groups/whoweserve/whoweserve.config.json
deleted file mode 100644
index cf770b9..0000000
--- a/components/groups/whoweserve/whoweserve.config.json
+++ /dev/null
@@ -1,59 +0,0 @@
-{
-  "title": "whoweserve component",
-  "context": {
-    "heading": "Who we serve",
-    "cards": [
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com"
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen. Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com",
-        "middlePos": true
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com"
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com"
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Learn More",
-        "link": "https://www.google.com",
-        "middlePos": true
-      },
-      {
-        "src": "/images/carfix.jpg",
-        "heading": "Independent collision shops",
-        "headingLevel": "h6",
-        "text": "Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.",
-        "textLink": "Go to diy site",
-        "link": "https://www.google.com",
-        "lastCard": true
-      }
-    ]
-  }
-}
diff --git a/components/groups/whoweserve/whoweserve.twig b/components/groups/whoweserve/whoweserve.twig
deleted file mode 100644
index 9d22ad5..0000000
--- a/components/groups/whoweserve/whoweserve.twig
+++ /dev/null
@@ -1,25 +0,0 @@
-

-	{% include "@jumbo" with 
-            {
-                "headingLevel": "h2",
-                "btnText": "",
-                "threelines": true,
-                "modifier": "No Button and no simple text"
-            } 
-        %}
-
-	{% set cardsContent %}
-
-	{% for card in cards %}
-		{% include "@servcard2" with card %}
-	{% endfor %}
-	{% endset %}
-
-
-	{% set drupal %}
-	{% include "@drupalitemsfacade" with {items:cardsContent} %}
-	{% endset %}
-	

-		{% include "@cols" with {content: drupal, mobileModifier: "1", desktopModifier: "3", } %}
-	

-

diff --git a/components/pages/demo01172020/demo01172020.config.json b/components/pages/demo01172020/demo01172020.config.json
deleted file mode 100644
index 2f0f1a0..0000000
--- a/components/pages/demo01172020/demo01172020.config.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-  "title": "demo01172020 component",
-  "context": {
-    "text": "This is an demo01172020 component!",
-    "heading": "My heading"
-  }
-}
diff --git a/components/pages/demo01172020/demo01172020.scss b/components/pages/demo01172020/demo01172020.scss
deleted file mode 100644
index a484691..0000000
--- a/components/pages/demo01172020/demo01172020.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-/**
- *  Main css for Demo01172020
- */
-
-#page {
-  .cmp-servicescards__cardcontainer {
-    .field__items {
-      display: flex;
-      flex-wrap: wrap;
-      justify-content: space-between;
-
-      > .field__item {
-        @media (min-width: 992px) {
-          flex: 0 0 28%;
-        }
-      }
-    }
-
-    @media (min-width: 992px) {
-      .cmp-servcard,
-      .last-card {
-        min-width: 100%;
-      }
-    }
-  }
-
-  .cmp-brandingcard {
-    .field--name-image {
-      @extend .mx-auto;
-    }
-  }
-
-  .cmp-shadow-box-quote {
-    align-self: center;
-  }
-
-  .cmp-shadow-box-img {
-    // .field--name-field-testimonial-desk-image {
-
-    //     .field--name-image{
-    //         max-width: 100%;
-    //     }
-    // }
-  }
-
-  .cmp-image {
-    max-width: 100%;
-  }
-}
diff --git a/components/pages/homePage/homePage.config.json b/components/pages/homePage/homePage.config.json
deleted file mode 100644
index 7589cbf..0000000
--- a/components/pages/homePage/homePage.config.json
+++ /dev/null
@@ -1,12 +0,0 @@
-{
-  "title": "homePage component",
-  "context": {
-    "hero": "@hero--slider",
-    "branding": "@branding",
-    "servewedo": "@serve-wedo",
-    "testimonial": "@testimonial--overlap",
-    "affilliations": "@affilliations",
-    "latest": "@latest",
-    "footer": "@footer"
-  }
-}
diff --git a/components/pages/homePage/homePage.twig b/components/pages/homePage/homePage.twig
deleted file mode 100644
index d7b258f..0000000
--- a/components/pages/homePage/homePage.twig
+++ /dev/null
@@ -1,9 +0,0 @@
-
-{% include "@hero--slider" with hero only %}
-{% include "@branding" with branding only %}
-{% include "@serve-wedo" with servewedo %}
-{% include "@testimonial" with testimonial  only %}
-{% include "@affilliations" with affilliations %}
-{% include "@latest" with latest %}
-{% include "@footer" with footer %}
-
diff --git a/components/preview/affilliations.html b/components/preview/affilliations.html
new file mode 100644
index 0000000..919785d
--- /dev/null
+++ b/components/preview/affilliations.html
@@ -0,0 +1,434 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    
+

+
+
+
+   
+ 

+    working with 
 the industry’s best
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+    
+

+	

+
+		
+				  				  		
+		
+
+
+
+

+        
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
        
+
+
+            

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+        

+
+	

+
+	

+						  				  				  				
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+	

+            
+
        
+
+
+            

+    

+	

+
+

+    

+        
+
+
+     
+     
+     
+
+
+     

+

+
+
+    
+  
+
+
diff --git a/components/preview/branding--default.html b/components/preview/branding--default.html
new file mode 100644
index 0000000..5f60046
--- /dev/null
+++ b/components/preview/branding--default.html
@@ -0,0 +1,185 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+
+
+
+
+

+
+
+    

+                        
+    

+        
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        
+
+

+   
+
+
+           

+	            
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+ 

+    Repair Information
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    tyre
+
+    
+ 

+    diagnostics
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    key
+
+    
+ 

+    shop management
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+    
+

+
+      
+

+    

+
+            

+    
+

+
+    
+  
+
+
diff --git a/components/preview/branding--overlap.html b/components/preview/branding--overlap.html
new file mode 100644
index 0000000..6d2b8f0
--- /dev/null
+++ b/components/preview/branding--overlap.html
@@ -0,0 +1,185 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+
+
+
+
+

+
+
+    

+                        
+    

+        
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        
+
+

+   
+
+
+           

+	            
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+ 

+    Repair Information
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    tyre
+
+    
+ 

+    diagnostics
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    key
+
+    
+ 

+    shop management
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+    
+

+
+      
+

+    

+
+            

+    
+

+
+    
+  
+
+
diff --git a/components/preview/branding.html b/components/preview/branding.html
new file mode 100644
index 0000000..5f60046
--- /dev/null
+++ b/components/preview/branding.html
@@ -0,0 +1,185 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+
+
+
+
+

+
+
+    

+                        
+    

+        
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        
+
+

+   
+
+
+           

+	            
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+ 

+    Repair Information
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    tyre
+
+    
+ 

+    diagnostics
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    key
+
+    
+ 

+    shop management
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+    
+

+
+      
+

+    

+
+            

+    
+

+
+    
+  
+
+
diff --git a/components/preview/brandingcard.html b/components/preview/brandingcard.html
new file mode 100644
index 0000000..8a63f0a
--- /dev/null
+++ b/components/preview/brandingcard.html
@@ -0,0 +1,57 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+    
+
+    
+ 

+    My heading
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+
+    
+  
+
+
diff --git a/components/preview/button.html b/components/preview/button.html
new file mode 100644
index 0000000..ab7a6c5
--- /dev/null
+++ b/components/preview/button.html
@@ -0,0 +1,27 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+     
+     
+     
+
+
+ 
+    
+  
+
+
diff --git a/components/preview/cardlink.html b/components/preview/cardlink.html
new file mode 100644
index 0000000..0b080fb
--- /dev/null
+++ b/components/preview/cardlink.html
@@ -0,0 +1,22 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+Learn more
+
+
+    
+  
+
+
diff --git a/components/preview/collapse-list.html b/components/preview/collapse-list.html
new file mode 100644
index 0000000..0682928
--- /dev/null
+++ b/components/preview/collapse-list.html
@@ -0,0 +1,69 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    

+        Products
+        
+        
+    

+    
+

+
+
+    
+  
+
+
diff --git a/components/preview/cols--content.html b/components/preview/cols--content.html
new file mode 100644
index 0000000..13f1c1b
--- /dev/null
+++ b/components/preview/cols--content.html
@@ -0,0 +1,35 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+

+   
+
+
+       
+
1

+
2

+
3

+    
+
+      
+

+
+    
+  
+
+
diff --git a/components/preview/cols--default.html b/components/preview/cols--default.html
new file mode 100644
index 0000000..7e2268f
--- /dev/null
+++ b/components/preview/cols--default.html
@@ -0,0 +1,27 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+

+   
+
+
+      
+

+
+    
+  
+
+
diff --git a/components/preview/cols--drupalcontent.html b/components/preview/cols--drupalcontent.html
new file mode 100644
index 0000000..02c2d3d
--- /dev/null
+++ b/components/preview/cols--drupalcontent.html
@@ -0,0 +1,37 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+

+   
+
+
+       
+	
+	

+			
1

+		
2

+		
3

+	
+

+
+      
+

+
+    
+  
+
+
diff --git a/components/preview/cols.html b/components/preview/cols.html
new file mode 100644
index 0000000..7e2268f
--- /dev/null
+++ b/components/preview/cols.html
@@ -0,0 +1,27 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+

+   
+
+
+      
+

+
+    
+  
+
+
diff --git a/components/preview/companies--bs.html b/components/preview/companies--bs.html
new file mode 100644
index 0000000..1815d79
--- /dev/null
+++ b/components/preview/companies--bs.html
@@ -0,0 +1,383 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+	

+
+		
+				  				  		
+		
+
+
+
+

+        
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
        
+
+
+            

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+        

+
+	

+
+	

+						  				  				  				
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+	

+            
+
        
+
+
+            

+    

+	

+
+

+
+    
+  
+
+
diff --git a/components/preview/companies--default.html b/components/preview/companies--default.html
new file mode 100644
index 0000000..b856000
--- /dev/null
+++ b/components/preview/companies--default.html
@@ -0,0 +1,19 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    [object Object]
+    
+  
+
+
diff --git a/components/preview/companies--page.html b/components/preview/companies--page.html
new file mode 100644
index 0000000..1baec23
--- /dev/null
+++ b/components/preview/companies--page.html
@@ -0,0 +1,153 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+
+    
+  
+
+
diff --git a/components/preview/companies.html b/components/preview/companies.html
new file mode 100644
index 0000000..b856000
--- /dev/null
+++ b/components/preview/companies.html
@@ -0,0 +1,19 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    [object Object]
+    
+  
+
+
diff --git a/components/preview/demo01172020.html b/components/preview/demo01172020.html
new file mode 100644
index 0000000..8a97f88
--- /dev/null
+++ b/components/preview/demo01172020.html
@@ -0,0 +1,1802 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+    
+    

+        
+    

+    

+        

+
+            

+                

+                    
+                    

+                        

+
+
+                            

+
+                                

+                                    
+                                   
+                                

+
+                            

+                        

+                        

+
+
+                            

+
+                                

+                                    

+
+
+                                    

+                                    

+                                        

+                                            

+                                                

+
+
+                                                    

+
+                                                    

+                                                

+                                                

+
+
+                                                    

+                                                        

+                                                            

+                                                                

+                                                                    

+                                                                        

+                                                                            
+                                                                                
+                                                                                Previous
+                                                                            
+                                                                            
    
+                                                                                
  1. 
+                                                                                
    2. 
+                                                                                
  2. 
+                                                                            

+                                                                            
+                                                                                
+                                                                                Next
+                                                                            
+                                                                        

+                                                                        

+                                                                            

+                                                                                

+                                                                                    

+                                                                                        

+
+                                                                                            

+                                                                                                KYAUTOMOTIVE
+                                                                                                INTELLIGENCE

+
+                                                                                        

+                                                                                        
+                                                                                            
+                                                                                                
+                                                                                                
+                                                                                            
+                                                                                        
+                                                                                        

+
+                                                                                            

+                                                                                                
From providing shop
+                                                                                                    management software
+                                                                                                    to customer
+                                                                                                    communication tools,
+                                                                                                    we've been the
+                                                                                                    industry leader of
+                                                                                                    OEM auto repair
+                                                                                                    software since 1986.
+                                                                                                

+                                                                                            

+
+                                                                                        

+                                                                                        
+                                                                                    

+
+                                                                                

+
+                                                                            

+                                                                            

+                                                                                

+                                                                                    

+                                                                                        

+
+                                                                                            

+                                                                                                TESTING CAROUSEL

+
+                                                                                        

+                                                                                        
+                                                                                            
+                                                                                                
+                                                                                                
+                                                                                            
+                                                                                        
+                                                                                        

+
+                                                                                            

+                                                                                                
slider 2 - From
+                                                                                                    providing shop
+                                                                                                    management software
+                                                                                                    to customer
+                                                                                                    communication tools,
+                                                                                                    we've been the
+                                                                                                    industry leader of
+                                                                                                    OEM auto repair
+                                                                                                    software since 1986.
+                                                                                                

+                                                                                            

+
+                                                                                        

+                                                                                        
+                                                                                    

+
+                                                                                

+
+                                                                            

+                                                                        

+                                                                    

+                                                                

+                                                            

+                                                        

+
+
+                                                    

+                                                

+
+                                            

+                                        

+                                        

+                                            

+                                                

+
+
+                                                    

+                                                        

+                                                            

+                                                                

+                                                                    

+                                                                        

+
+                                                                            

+                                                                                WHY ALLDATA

+
+                                                                        

+
+                                                                        

+                                                                            
ALLDATA is the industry’s #1 choice for
+                                                                                OEM-accurate mechanical and collision
+                                                                                repair information, shop management
+                                                                                software, and support services, trusted
+                                                                                by more than 400,000 technicians in over
+                                                                                115,000 shops worldwide.

+                                                                        

+
+                                                                    

+                                                                    

+
+                                                                        

+                                                                            

+                                                                                

+                                                                                    

+
+                                                                                        

+                                                                                            

+
+
+                                                                                                

+                                                                                                    REPAIR INFORMATION
+
+                                                                                                

+
+                                                                                            

+                                                                                        

+
+                                                                                        

+
+                                                                                            

+                                                                                                REPAIR INFORMATION

+
+                                                                                        

+
+                                                                                        

+                                                                                            
Lorem ipsum dolor sit
+                                                                                                amet, consectetur
+                                                                                                adipiscing elit.
+                                                                                                Curabitur accumsan
+                                                                                                sapien a orci pharetra
+                                                                                                pretium.

+                                                                                        

+
+
+                                                                                        

+                                                                                    

+                                                                                

+                                                                            

+                                                                            

+                                                                                

+                                                                                    

+
+                                                                                        

+                                                                                            

+
+
+                                                                                                

+                                                                                                    REPAIR INFORMATION
+
+                                                                                                

+
+                                                                                            

+                                                                                        

+
+                                                                                        

+
+                                                                                            

+                                                                                                DIAGNOSTICS

+
+                                                                                        

+
+                                                                                        

+                                                                                            
Lorem ipsum dolor sit
+                                                                                                amet, consectetur
+                                                                                                adipiscing elit.
+                                                                                                Curabitur accumsan
+                                                                                                sapien a orci pharetra
+                                                                                                pretium.

+                                                                                        

+
+
+                                                                                        

+                                                                                    

+                                                                                

+                                                                            

+                                                                            

+                                                                                

+                                                                                    

+
+                                                                                        

+                                                                                            

+
+
+                                                                                                

+                                                                                                    REPAIR INFORMATION
+
+                                                                                                

+
+                                                                                            

+                                                                                        

+
+                                                                                        

+
+                                                                                            

+                                                                                                SHOP MANAGEMENT

+
+                                                                                        

+
+                                                                                        

+                                                                                            
Lorem ipsum dolor sit
+                                                                                                amet, consectetur
+                                                                                                adipiscing elit.
+                                                                                                Curabitur accumsan
+                                                                                                sapien a orci pharetra
+                                                                                                pretium.

+                                                                                        

+
+
+                                                                                        

+                                                                                    

+                                                                                

+                                                                            

+                                                                        

+
+                                                                    

+                                                                

+
+                                                            

+                                                        

+                                                    

+                                                

+
+                                            

+                                        

+                                        

+                                            

+                                                

+
+
+                                                    

+                                                        

+                                                            

+                                                                

+                                                                    

+
+                                                                        

+                                                                            Who We Serve

+
+                                                                    

+                                                                    
+                                                                        
+                                                                            
+                                                                            
+                                                                        
+                                                                    
+                                                                

+                                                                

+
+                                                                    

+                                                                        

+                                                                            

+                                                                                

+                                                                                    
+
+                                                                                

+                                                                            

+
+                                                                        

+                                                                        

+                                                                            

+                                                                                

+                                                                                    
+
+                                                                                

+                                                                            

+
+                                                                        

+                                                                        

+                                                                            

+                                                                                

+                                                                                    
+
+                                                                                

+                                                                            

+
+                                                                        

+                                                                        

+                                                                            

+                                                                                

+                                                                                    
+
+                                                                                

+                                                                            

+
+                                                                        

+                                                                        

+                                                                            

+                                                                                

+                                                                                    
+
+                                                                                

+                                                                            

+
+                                                                        

+                                                                        

+                                                                            

+                                                                                

+                                                                                    
+
+                                                                                

+                                                                            

+
+                                                                        

+                                                                    

+
+                                                                

+                                                            

+                                                        

+
+                                                    

+                                                

+                                                

+
+
+                                                    

+                                                        

+                                                            

+                                                                

+                                                                    

+                                                                        

+                                                                            

+                                                                                

+                                                                                    

+                                                                                        

+
+                                                                                            

+                                                                                                WHAT WE DO

+
+                                                                                        

+                                                                                        
+                                                                                            
+                                                                                                
+                                                                                                
+                                                                                            
+                                                                                        
+                                                                                        

+
+                                                                                            

+                                                                                                
We are a
+                                                                                                    data-driven
+                                                                                                        solutions
+                                                                                                    provider working
+                                                                                                    hard
+                                                                                                    and
+                                                                                                    smart
+                                                                                                    to help automotive
+                                                                                                    repair shop and be
+                                                                                                    the best
+                                                                                                        they can
+                                                                                                        be

+                                                                                            

+
+                                                                                        

+                                                                                        
+                                                                                    

+
+                                                                                

+
+                                                                            

+                                                                        

+                                                                    

+                                                                

+                                                            

+                                                        

+
+
+                                                    

+                                                

+
+                                            

+                                        

+                                        

+                                            

+                                                

+
+
+                                                    

+
+                                                        

+                                                            

+                                                                

+                                                                    

+                                                                        
+                                                                        

+                                                                            

+
+                                                                            

+                                                                            

+                                                                                
See what over 400,000 technicians
+                                                                                    can't work without.

+                                                                            

+
+                                                                            

+                                                                            
+                                                                        

+                                                                    

+                                                                

+                                                            

+                                                        

+                                                    

+                                                

+
+                                            

+                                        

+                                        

+                                            

+                                                

+
+
+                                                    

+
+                                                        

+                                                            

+                                                                

+                                                                    

+                                                                        

+
+                                                                            

+                                                                                SEE THE LATEST

+
+                                                                        

+                                                                        
+                                                                            
+                                                                                
+                                                                                
+                                                                            
+                                                                        
+                                                                        

+                                                                            

+                                                                                

+                                                                                    

+
+                                                                                        

+                                                                                            

+                                                                                                

+
+                                                                                                    

+                                                                                                        

+                                                                                                            

+                                                                                                                NEWS
+                                                                                                            

+                                                                                                        

+                                                                                                        
+                                                                                                    

+                                                                                                    

+
+                                                                                                        

+                                                                                                            

+                                                                                                                

+                                                                                                                    

+                                                                                                                        

+                                                                                                                            

+
+                                                                                                                                

+                                                                                                                                    

+
+
+                                                                                                                                        

+                                                                                                                                            servicecard
+
+                                                                                                                                        

+
+                                                                                                                                    

+                                                                                                                                

+
+                                                                                                                            

+                                                                                                                        

+                                                                                                                    

+                                                                                                                    

+                                                                                                                        

+
+                                                                                                                            

+                                                                                                                                FIVE
+                                                                                                                                WAYS
+                                                                                                                                TECHNOLOGY
+                                                                                                                                CAN
+                                                                                                                                HELP
+                                                                                                                                YOUR
+                                                                                                                                DEALERSHIP
+                                                                                                                                SERVICE
+                                                                                                                            

+
+                                                                                                                        

+                                                                                                                        
+                                                                                                                            more
+                                                                                                                        
+                                                                                                                        

+
+                                                                                                                            

+                                                                                                                                
At
+                                                                                                                                    the
+                                                                                                                                    NIADA
+                                                                                                                                    Convention
+                                                                                                                                    and
+                                                                                                                                    Expo,
+                                                                                                                                    George
+                                                                                                                                    Verkamp
+                                                                                                                                    (shown
+                                                                                                                                    above),
+                                                                                                                                    Vice
+                                                                                                                                    President
+                                                                                                                                    of
+                                                                                                                                    Sales
+                                                                                                                                    &
+                                                                                                                                    Business
+                                                                                                                                    Development
+                                                                                                                                    at
+                                                                                                                                    ALLDATA...
+                                                                                                                                

+                                                                                                                            

+
+                                                                                                                        

+                                                                                                                        

+                                                                                                                            

+                                                                                                                                LEARN
+                                                                                                                                    MORE
+                                                                                                                            

+                                                                                                                        

+                                                                                                                    

+                                                                                                                

+                                                                                                            

+                                                                                                        

+
+                                                                                                    

+                                                                                                

+                                                                                            

+                                                                                            

+                                                                                                

+
+                                                                                                    

+                                                                                                        

+                                                                                                            

+                                                                                                                Teach
+                                                                                                                tips
+                                                                                                            

+                                                                                                        

+                                                                                                        
+                                                                                                    

+                                                                                                    

+
+                                                                                                        

+                                                                                                            

+                                                                                                                

+                                                                                                                    

+                                                                                                                        

+                                                                                                                            

+
+                                                                                                                                

+                                                                                                                                    

+
+
+                                                                                                                                        

+                                                                                                                                            servicecard
+
+                                                                                                                                        

+
+                                                                                                                                    

+                                                                                                                                

+
+                                                                                                                            

+                                                                                                                        

+                                                                                                                    

+                                                                                                                    

+                                                                                                                        

+
+                                                                                                                            

+                                                                                                                                FIVE
+                                                                                                                                WAYS
+                                                                                                                                TECHNOLOGY
+                                                                                                                                CAN
+                                                                                                                                HELP
+                                                                                                                                YOUR
+                                                                                                                                DEALERSHIP
+                                                                                                                                SERVICE
+                                                                                                                            

+
+                                                                                                                        

+                                                                                                                        
+                                                                                                                            more
+                                                                                                                        
+                                                                                                                        

+
+                                                                                                                            

+                                                                                                                                
At
+                                                                                                                                    the
+                                                                                                                                    NIADA
+                                                                                                                                    Convention
+                                                                                                                                    and
+                                                                                                                                    Expo,
+                                                                                                                                    George
+                                                                                                                                    Verkamp
+                                                                                                                                    (shown
+                                                                                                                                    above),
+                                                                                                                                    Vice
+                                                                                                                                    President
+                                                                                                                                    of
+                                                                                                                                    Sales
+                                                                                                                                    &
+                                                                                                                                    Business
+                                                                                                                                    Development
+                                                                                                                                    at
+                                                                                                                                    ALLDATA...
+                                                                                                                                

+                                                                                                                            

+
+                                                                                                                        

+                                                                                                                        

+                                                                                                                            

+                                                                                                                                LEARN
+                                                                                                                                    MORE
+                                                                                                                            

+                                                                                                                        

+                                                                                                                    

+                                                                                                                

+                                                                                                            

+                                                                                                        

+
+                                                                                                    

+                                                                                                

+                                                                                            

+                                                                                        

+
+                                                                                    

+                                                                                

+                                                                                

+                                                                                    
+                                                                                

+                                                                            

+                                                                        

+                                                                    

+                                                                

+                                                            

+                                                        

+                                                    

+                                                

+
+                                            

+                                        

+
+                                    

+                                

+
+                            

+                        

+
+                    

+
+                

+            

+        

+    

+    
+

+    
+  
+
+
diff --git a/components/preview/drupalitemsfacade.html b/components/preview/drupalitemsfacade.html
new file mode 100644
index 0000000..144aa06
--- /dev/null
+++ b/components/preview/drupalitemsfacade.html
@@ -0,0 +1,22 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+	
+

+
+    
+  
+
+
diff --git a/components/preview/footer.html b/components/preview/footer.html
new file mode 100644
index 0000000..903fb32
--- /dev/null
+++ b/components/preview/footer.html
@@ -0,0 +1,330 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    

+        

+                            
+

+    

+        Products
+        
+        
+    

+    
+

+
+                            
+

+    

+        Support
+        
+        
+    

+    
+

+
+                            
+

+    

+        Resources
+        
+        
+    

+    
+

+
+                            
+

+    

+        About Us
+        
+        
+    

+    
+

+
+                            
+

+    

+        Contact us
+        
+        
+    

+    
+

+
+                            
+

+    

+        Related sites
+        
+        
+    

+    
+

+
+                    

+       
+        

+                  

+        Sign up to receive email updates 
+    

+              Sing Up
+                          
+                    

+    

+    

+        
+    

+

+    
+  
+
+
diff --git a/components/preview/header.html b/components/preview/header.html
new file mode 100644
index 0000000..39e8a25
--- /dev/null
+++ b/components/preview/header.html
@@ -0,0 +1,983 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+

+   
+    
+    

+        

+            
+        

+        

+            
+        

+        

+    

+    
+    

+        

+            
+
+
+
+
+    Menu
+
+
+            
+            
+
+
+
+
+    Cart
+
+
+            
+
+
+
+
+    Search
+
+
+            
+        

+        

+            
+        

+    

+

+
+
+    
+  
+
+
diff --git a/components/preview/heading--default.html b/components/preview/heading--default.html
new file mode 100644
index 0000000..7456d6c
--- /dev/null
+++ b/components/preview/heading--default.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+ 

+    My h1 heading
+ 

+
+   
+
+    
+  
+
+
diff --git a/components/preview/heading--h2.html b/components/preview/heading--h2.html
new file mode 100644
index 0000000..5410006
--- /dev/null
+++ b/components/preview/heading--h2.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+ 

+    My h2 heading
+ 

+
+   
+
+    
+  
+
+
diff --git a/components/preview/heading--h3.html b/components/preview/heading--h3.html
new file mode 100644
index 0000000..ccfb08e
--- /dev/null
+++ b/components/preview/heading--h3.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+ 

+    My h3 heading
+ 

+
+   
+
+    
+  
+
+
diff --git a/components/preview/heading--h4.html b/components/preview/heading--h4.html
new file mode 100644
index 0000000..ec9abc8
--- /dev/null
+++ b/components/preview/heading--h4.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+ 

+    My h4 heading
+ 

+
+   
+
+    
+  
+
+
diff --git a/components/preview/heading--h5.html b/components/preview/heading--h5.html
new file mode 100644
index 0000000..6019595
--- /dev/null
+++ b/components/preview/heading--h5.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+ 

+    My h5 heading
+ 

+
+   
+
+    
+  
+
+
diff --git a/components/preview/heading--h6.html b/components/preview/heading--h6.html
new file mode 100644
index 0000000..f525a1a
--- /dev/null
+++ b/components/preview/heading--h6.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+ 

+    My h6 heading
+ 

+
+   
+
+    
+  
+
+
diff --git a/components/preview/heading.html b/components/preview/heading.html
new file mode 100644
index 0000000..f41e935
--- /dev/null
+++ b/components/preview/heading.html
@@ -0,0 +1,124 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    My h1 heading
+ 

+
+
+
+

+    My h2 heading
+ 

+
+
+
+

+    My h3 heading
+ 

+
+
+
+

+    My h4 heading
+ 

+
+
+
+

+    My h5 heading
+ 

+
+
+
+

+    My h6 heading
+ 

+
+
+
+

+    My h2 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+
+

+    My h3 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+
+

+    My h4 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+
+

+    My h5 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+
+

+    My h6 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+    
+  
+
+
diff --git a/components/preview/hero--default.html b/components/preview/hero--default.html
new file mode 100644
index 0000000..0f6dfb6
--- /dev/null
+++ b/components/preview/hero--default.html
@@ -0,0 +1,117 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+            
+  
+

+    

+    

+    

+
+    
+
  

+    
+
+

+   
+
+
+         

+	  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+  
+
+

+
+      
+

+  

+
+    
+    
+

+
+
+    
+  
+
+
diff --git a/components/preview/hero--slider.html b/components/preview/hero--slider.html
new file mode 100644
index 0000000..1aeb130
--- /dev/null
+++ b/components/preview/hero--slider.html
@@ -0,0 +1,196 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+            
+  
+

+    

+    

+    

+
+    
+
  

+    
+
+

+   
+
+
+         

+	  
+                
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+

+
+
+
+   
+ 

+    KYAUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+            
+
                                                                        

+                        
+

+
+
+
+   
+ 

+    Testing Carousel
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+            
+
        
+
+
+            

+    

+

+
+      
+

+  

+
+    
+    
+

+
+
+    
+  
+
+
diff --git a/components/preview/hero.html b/components/preview/hero.html
new file mode 100644
index 0000000..0f6dfb6
--- /dev/null
+++ b/components/preview/hero.html
@@ -0,0 +1,117 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+            
+  
+

+    

+    

+    

+
+    
+
  

+    
+
+

+   
+
+
+         

+	  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+  
+
+

+
+      
+

+  

+
+    
+    
+

+
+
+    
+  
+
+
diff --git a/components/preview/homepage.html b/components/preview/homepage.html
new file mode 100644
index 0000000..d4021c3
--- /dev/null
+++ b/components/preview/homepage.html
@@ -0,0 +1,1763 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+            
+  
+

+    

+    

+    

+
+    
+
  

+    
+
+

+   
+
+
+         

+	  
+                
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+

+
+
+
+   
+ 

+    KYAUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+            
+
                                                                        

+                        
+

+
+
+
+   
+ 

+    Testing Carousel
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+            
+
        
+
+
+            

+    

+

+
+      
+

+  

+
+    
+    
+

+
+
+
+
+
+
+
+
+
+
+

+
+
+    

+                        
+    

+        
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        
+
+

+   
+
+
+           

+	            
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+ 

+    Repair Information
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    tyre
+
+    
+ 

+    diagnostics
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    key
+
+    
+ 

+    shop management
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+    
+

+
+      
+

+    

+
+            

+    
+

+
+

+    
+

+    

+    

+    

+
+    
+
    

+        
+

+
+
+
+   
+ 

+    Who we serve
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+     
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        

+     
+            
+            

+	                                                                                                                                                                                                                                                          
+

+        

+    

+    

+        
+
+
+
+
+    
+
+    
+    
+
+    

+    

+        

+        
+

+
+
+
+   
+ 

+    WHA WE DO
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        

+    

+

+
+
+
+

+
+
+    

+                        

+        

+                        
+                        
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
        
+
+
+            

+    
            

+                      

+        See what over 400,000 technicians can't work without.
+    

+                  
+
+
+     
+     
+     
+
+
+             

+        

+    

+
+            

+    
+

+

+    
+

+
+
+
+   
+ 

+    working with 
 the industry’s best
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+    
+

+	

+
+		
+				  				  		
+		
+
+
+
+

+        
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
        
+
+
+            

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+        

+
+	

+
+	

+						  				  				  				
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+	

+            
+
        
+
+
+            

+    

+	

+
+

+    

+        
+
+
+     
+     
+     
+
+
+     

+

+
+
+
+
+

+
+
+    

+                    

+    

+        
+ 

+    see the latest
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+
+        

+            

+                                

+                    

+    
+

+    
News

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Five ways technology can help your dealership service
+ 

+
+   
+            
+                more
+            
+                  

+        At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+    

+              
+Learn More
+
+        

+    

+

+                

+                                

+                    

+    
+

+    
Teach tips

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Five ways technology can help your dealership service
+ 

+
+   
+            
+                more
+            
+                  

+        At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+    

+              
+Learn More
+
+        

+    

+

+                

+                                

+                    
+
+
+     
+     
+     
+
+
+                 

+            

+        

+    

+
+

+
+            

+    
+

+

+    

+        

+                            
+

+    

+        Products
+        
+        
+    

+    
+

+
+                            
+

+    

+        Support
+        
+        
+    

+    
+

+
+                            
+

+    

+        Resources
+        
+        
+    

+    
+

+
+                            
+

+    

+        About Us
+        
+        
+    

+    
+

+
+                            
+

+    

+        Contact us
+        
+        
+    

+    
+

+
+                            
+

+    

+        Related sites
+        
+        
+    

+    
+

+
+                    

+       
+        

+                  

+        Sign up to receive email updates 
+    

+              Sing Up
+                          
+                    

+    

+    

+        
+    

+

+
+    
+  
+
+
diff --git a/components/preview/image--default.html b/components/preview/image--default.html
new file mode 100644
index 0000000..9ee21b3
--- /dev/null
+++ b/components/preview/image--default.html
@@ -0,0 +1,29 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+    mechanic
+
+    
+    
+
+
+    
+  
+
+
diff --git a/components/preview/image--svg.html b/components/preview/image--svg.html
new file mode 100644
index 0000000..a940368
--- /dev/null
+++ b/components/preview/image--svg.html
@@ -0,0 +1,26 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+    mechanic
+
+
+    
+  
+
+
diff --git a/components/preview/image.html b/components/preview/image.html
new file mode 100644
index 0000000..9ee21b3
--- /dev/null
+++ b/components/preview/image.html
@@ -0,0 +1,29 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+
+    mechanic
+
+    
+    
+
+
+    
+  
+
+
diff --git a/components/preview/imageblue.html b/components/preview/imageblue.html
new file mode 100644
index 0000000..fdc5387
--- /dev/null
+++ b/components/preview/imageblue.html
@@ -0,0 +1,31 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    
+
+
+
+
+    
+
+    
+    
+
+

+    
+  
+
+
diff --git a/components/preview/jumbo--default.html b/components/preview/jumbo--default.html
new file mode 100644
index 0000000..e863542
--- /dev/null
+++ b/components/preview/jumbo--default.html
@@ -0,0 +1,64 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+    
+  
+
+
diff --git a/components/preview/jumbo--no-button-and-no-three-lines.html b/components/preview/jumbo--no-button-and-no-three-lines.html
new file mode 100644
index 0000000..1505f88
--- /dev/null
+++ b/components/preview/jumbo--no-button-and-no-three-lines.html
@@ -0,0 +1,47 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+    
+  
+
+
diff --git a/components/preview/jumbo--no-button.html b/components/preview/jumbo--no-button.html
new file mode 100644
index 0000000..0d8b55a
--- /dev/null
+++ b/components/preview/jumbo--no-button.html
@@ -0,0 +1,56 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+    
+  
+
+
diff --git a/components/preview/jumbo--no-three-lines.html b/components/preview/jumbo--no-three-lines.html
new file mode 100644
index 0000000..ddea58a
--- /dev/null
+++ b/components/preview/jumbo--no-three-lines.html
@@ -0,0 +1,55 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+    
+  
+
+
diff --git a/components/preview/jumbo--simple.html b/components/preview/jumbo--simple.html
new file mode 100644
index 0000000..8874657
--- /dev/null
+++ b/components/preview/jumbo--simple.html
@@ -0,0 +1,47 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+    
+  
+
+
diff --git a/components/preview/jumbo.html b/components/preview/jumbo.html
new file mode 100644
index 0000000..e863542
--- /dev/null
+++ b/components/preview/jumbo.html
@@ -0,0 +1,64 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+    
+  
+
+
diff --git a/components/preview/latest.html b/components/preview/latest.html
new file mode 100644
index 0000000..de80152
--- /dev/null
+++ b/components/preview/latest.html
@@ -0,0 +1,179 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+

+
+
+    

+                    

+    

+        
+ 

+    see the latest
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+
+        

+            

+                                

+                    

+    
+

+    
News

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Five ways technology can help your dealership service
+ 

+
+   
+            
+                more
+            
+                  

+        At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+    

+              
+Learn More
+
+        

+    

+

+                

+                                

+                    

+    
+

+    
Teach tips

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Five ways technology can help your dealership service
+ 

+
+   
+            
+                more
+            
+                  

+        At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+    

+              
+Learn More
+
+        

+    

+

+                

+                                

+                    
+
+
+     
+     
+     
+
+
+                 

+            

+        

+    

+
+

+
+            

+    
+

+    
+  
+
+
diff --git a/components/preview/latestcard.html b/components/preview/latestcard.html
new file mode 100644
index 0000000..5819274
--- /dev/null
+++ b/components/preview/latestcard.html
@@ -0,0 +1,74 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+    
+

+    
news

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Independent collision shops
+ 

+
+   
+            
+                more
+            
+                  

+        Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+    

+              
+Learn More
+
+        

+    

+

+
+    
+  
+
+
diff --git a/components/preview/latestheading.html b/components/preview/latestheading.html
new file mode 100644
index 0000000..5001027
--- /dev/null
+++ b/components/preview/latestheading.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    
News

+    
+

+
+
+    
+  
+
+
diff --git a/components/preview/preview.html b/components/preview/preview.html
new file mode 100644
index 0000000..b856000
--- /dev/null
+++ b/components/preview/preview.html
@@ -0,0 +1,19 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    [object Object]
+    
+  
+
+
diff --git a/components/preview/quote.html b/components/preview/quote.html
new file mode 100644
index 0000000..1c3acc4
--- /dev/null
+++ b/components/preview/quote.html
@@ -0,0 +1,38 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+

+    
+  
+
+
diff --git a/components/preview/servcard.html b/components/preview/servcard.html
new file mode 100644
index 0000000..cbbec1c
--- /dev/null
+++ b/components/preview/servcard.html
@@ -0,0 +1,53 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+     
+    
+  
+
+
diff --git a/components/preview/servcard2.html b/components/preview/servcard2.html
new file mode 100644
index 0000000..e9bb1f7
--- /dev/null
+++ b/components/preview/servcard2.html
@@ -0,0 +1,51 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+    
+  
+
+
diff --git a/components/preview/serve-wedo.html b/components/preview/serve-wedo.html
new file mode 100644
index 0000000..b5f86be
--- /dev/null
+++ b/components/preview/serve-wedo.html
@@ -0,0 +1,336 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    
+

+    

+    

+    

+
+    
+
    

+        
+

+
+
+
+   
+ 

+    Who we serve
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+     
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        

+     
+            
+            

+	                                                                                                                                                                                                                                                          
+

+        

+    

+    

+        
+
+
+
+
+    
+
+    
+    
+
+    

+    

+        

+        
+

+
+
+
+   
+ 

+    WHA WE DO
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        

+    

+

+    
+  
+
+
diff --git a/components/preview/servicescards.html b/components/preview/servicescards.html
new file mode 100644
index 0000000..3e7aa1b
--- /dev/null
+++ b/components/preview/servicescards.html
@@ -0,0 +1,300 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+            
+
+
+
+

+
+
+    
+    
+                

+        
+

+    

+    

+    

+
+    
+
        
+

+
+
+
+   
+ 

+    Who we serve
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+     
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+
+        
+
+                

+            
+
+

+   
+
+
+                   

+	            
+                                                                                                                                                                                                  
+

+        
+      
+

+        

+     
+        
+    

+
+    
+    
+

+    
+  
+
+
diff --git a/components/preview/shadow-box.html b/components/preview/shadow-box.html
new file mode 100644
index 0000000..2ff81c8
--- /dev/null
+++ b/components/preview/shadow-box.html
@@ -0,0 +1,84 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+
+    
+  
+
+
diff --git a/components/preview/simpletext.html b/components/preview/simpletext.html
new file mode 100644
index 0000000..c44a8f2
--- /dev/null
+++ b/components/preview/simpletext.html
@@ -0,0 +1,22 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+          

+        This is an simpletext component!
+    

+  
+    
+  
+
+
diff --git a/components/preview/skew--default.html b/components/preview/skew--default.html
new file mode 100644
index 0000000..a02eab0
--- /dev/null
+++ b/components/preview/skew--default.html
@@ -0,0 +1,29 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+

+
+
+    
+    
+    
+    
+

+    
+  
+
+
diff --git a/components/preview/skew--image.html b/components/preview/skew--image.html
new file mode 100644
index 0000000..4d0a826
--- /dev/null
+++ b/components/preview/skew--image.html
@@ -0,0 +1,39 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+    
+    
+

+    
+  
+
+
diff --git a/components/preview/skew--inlineimage.html b/components/preview/skew--inlineimage.html
new file mode 100644
index 0000000..3e0e0f7
--- /dev/null
+++ b/components/preview/skew--inlineimage.html
@@ -0,0 +1,28 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+

+
+
+    

+            

+    
+

+    
+  
+
+
diff --git a/components/preview/skew--on.html b/components/preview/skew--on.html
new file mode 100644
index 0000000..00031f8
--- /dev/null
+++ b/components/preview/skew--on.html
@@ -0,0 +1,28 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+

+
+
+    

+            

+    
+

+    
+  
+
+
diff --git a/components/preview/skew.html b/components/preview/skew.html
new file mode 100644
index 0000000..a02eab0
--- /dev/null
+++ b/components/preview/skew.html
@@ -0,0 +1,29 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+

+
+
+    
+    
+    
+    
+

+    
+  
+
+
diff --git a/components/preview/slider--default.html b/components/preview/slider--default.html
new file mode 100644
index 0000000..fef92b9
--- /dev/null
+++ b/components/preview/slider--default.html
@@ -0,0 +1,91 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+                
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+            

+    

+
+
+    
+  
+
+
diff --git a/components/preview/slider--dyn.html b/components/preview/slider--dyn.html
new file mode 100644
index 0000000..933be5e
--- /dev/null
+++ b/components/preview/slider--dyn.html
@@ -0,0 +1,88 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+            

+    

+    
+  
+
+
diff --git a/components/preview/slider--dynamic.html b/components/preview/slider--dynamic.html
new file mode 100644
index 0000000..4ea2b91
--- /dev/null
+++ b/components/preview/slider--dynamic.html
@@ -0,0 +1,24 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+        

+            

+ 
+

+    
+  
+
+
diff --git a/components/preview/slider--new.html b/components/preview/slider--new.html
new file mode 100644
index 0000000..bd24404
--- /dev/null
+++ b/components/preview/slider--new.html
@@ -0,0 +1,61 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+            

+            
+            
+                
+
+            Previous
+            
+            
    
+
+                            
  1. 
+                            
  2. 
+                            
  3. 
+                        
+            

+            
+            
+            
+                
+            Next
+            
+        

+        

+                                    

+                    First slide
+                    
+                

+                            

+                    First slide
+                    
+                

+                            

+                    First slide
+                    
+                

+                        

+ 
+

+    
+  
+
+
diff --git a/components/preview/slider--slide.html b/components/preview/slider--slide.html
new file mode 100644
index 0000000..ebc2a51
--- /dev/null
+++ b/components/preview/slider--slide.html
@@ -0,0 +1,21 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+    Hello
+

+    
+  
+
+
diff --git a/components/preview/slider--slides.html b/components/preview/slider--slides.html
new file mode 100644
index 0000000..4f9da37
--- /dev/null
+++ b/components/preview/slider--slides.html
@@ -0,0 +1,92 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+    
+    
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+            

+    
    
+
+
+    
+  
+
+
diff --git a/components/preview/slider--slidessimple.html b/components/preview/slider--slidessimple.html
new file mode 100644
index 0000000..c581a33
--- /dev/null
+++ b/components/preview/slider--slidessimple.html
@@ -0,0 +1,58 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+    
+  
+
+
diff --git a/components/preview/slider.html b/components/preview/slider.html
new file mode 100644
index 0000000..fef92b9
--- /dev/null
+++ b/components/preview/slider.html
@@ -0,0 +1,91 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+                
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+            

+    

+
+
+    
+  
+
+
diff --git a/components/preview/testimonial--default.html b/components/preview/testimonial--default.html
new file mode 100644
index 0000000..7595053
--- /dev/null
+++ b/components/preview/testimonial--default.html
@@ -0,0 +1,215 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+

+
+
+    

+                        

+        

+                        
+                        
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
        
+
+
+            

+    
            

+                      

+        See what over 400,000 technicians can't work without.
+    

+                  
+
+
+     
+     
+     
+
+
+             

+        

+    

+
+            

+    
+

+    
+  
+
+
diff --git a/components/preview/testimonial--overlap.html b/components/preview/testimonial--overlap.html
new file mode 100644
index 0000000..a1234ea
--- /dev/null
+++ b/components/preview/testimonial--overlap.html
@@ -0,0 +1,215 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+

+
+
+    

+                        

+        

+                        
+                        
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
        
+
+
+            

+    
            

+                      

+        See what over 400,000 technicians can't work without.
+    

+                  
+
+
+     
+     
+     
+
+
+             

+        

+    

+
+            

+    
+

+    
+  
+
+
diff --git a/components/preview/testimonial.html b/components/preview/testimonial.html
new file mode 100644
index 0000000..7595053
--- /dev/null
+++ b/components/preview/testimonial.html
@@ -0,0 +1,215 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+

+
+
+    

+                        

+        

+                        
+                        
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
        
+
+
+            

+    
            

+                      

+        See what over 400,000 technicians can't work without.
+    

+                  
+
+
+     
+     
+     
+
+
+             

+        

+    

+
+            

+    
+

+    
+  
+
+
diff --git a/components/preview/threelines.html b/components/preview/threelines.html
new file mode 100644
index 0000000..cf05ae9
--- /dev/null
+++ b/components/preview/threelines.html
@@ -0,0 +1,26 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+    
+        
+    
+
+
+
+    
+  
+
+
diff --git a/components/preview/tricolor--default.html b/components/preview/tricolor--default.html
new file mode 100644
index 0000000..67d8749
--- /dev/null
+++ b/components/preview/tricolor--default.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+    

+    

+    

+

+
+
+    
+  
+
+
diff --git a/components/preview/tricolor--position.html b/components/preview/tricolor--position.html
new file mode 100644
index 0000000..a0b210a
--- /dev/null
+++ b/components/preview/tricolor--position.html
@@ -0,0 +1,26 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    

+    

+    

+
+    
+

+    
+  
+
+
diff --git a/components/preview/tricolor.html b/components/preview/tricolor.html
new file mode 100644
index 0000000..67d8749
--- /dev/null
+++ b/components/preview/tricolor.html
@@ -0,0 +1,25 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+    

+    

+    

+

+
+
+    
+  
+
+
diff --git a/components/preview/unitmacros.html b/components/preview/unitmacros.html
new file mode 100644
index 0000000..73d9cc1
--- /dev/null
+++ b/components/preview/unitmacros.html
@@ -0,0 +1,22 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+
+
+
+    
+  
+
+
diff --git a/components/preview/video--default.html b/components/preview/video--default.html
new file mode 100644
index 0000000..77c81a9
--- /dev/null
+++ b/components/preview/video--default.html
@@ -0,0 +1,24 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+   
+

+
+
+    
+  
+
+
diff --git a/components/preview/video--iframe.html b/components/preview/video--iframe.html
new file mode 100644
index 0000000..c6a5dce
--- /dev/null
+++ b/components/preview/video--iframe.html
@@ -0,0 +1,29 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    
+

+
+
+    
+  
+
+
diff --git a/components/preview/video.html b/components/preview/video.html
new file mode 100644
index 0000000..77c81a9
--- /dev/null
+++ b/components/preview/video.html
@@ -0,0 +1,24 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+   
+

+
+
+    
+  
+
+
diff --git a/components/preview/whatwedo.html b/components/preview/whatwedo.html
new file mode 100644
index 0000000..0704ddb
--- /dev/null
+++ b/components/preview/whatwedo.html
@@ -0,0 +1,104 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    
+

+    

+                
+
+

+
+
+    
+    
+                        
+

+    

+    

+    

+
+    
+
        
+    
+    
+
    

+    

+                
+
+

+
+
+    

+                                

+        
+            

+    
+
    

+    

+        
+

+
+
+
+   
+ 

+    WHA WE DO
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+    

+

+
+
+
+    
+  
+
+
diff --git a/components/preview/whoweserve.html b/components/preview/whoweserve.html
new file mode 100644
index 0000000..616cfd1
--- /dev/null
+++ b/components/preview/whoweserve.html
@@ -0,0 +1,283 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    

+	
+

+
+
+
+   
+ 

+    Who we serve
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+     
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+	
+
+		

+		
+
+

+   
+
+
+       	

+	
+																				
+

+	
+      
+

+	

+

+
+    
+  
+
+
diff --git a/components/groups/Affilliations/Affilliations.js b/components/raw/affilliations/Affilliations.js
similarity index 100%
rename from components/groups/Affilliations/Affilliations.js
rename to components/raw/affilliations/Affilliations.js
diff --git a/components/groups/Affilliations/Affilliations.scss b/components/raw/affilliations/Affilliations.scss
similarity index 100%
rename from components/groups/Affilliations/Affilliations.scss
rename to components/raw/affilliations/Affilliations.scss
diff --git a/components/groups/branding/branding.js b/components/raw/branding/branding.js
similarity index 100%
rename from components/groups/branding/branding.js
rename to components/raw/branding/branding.js
diff --git a/components/groups/branding/branding.scss b/components/raw/branding/branding.scss
similarity index 100%
rename from components/groups/branding/branding.scss
rename to components/raw/branding/branding.scss
diff --git a/components/blocks/brandingcard/brandingcard.js b/components/raw/brandingcard/brandingcard.js
similarity index 100%
rename from components/blocks/brandingcard/brandingcard.js
rename to components/raw/brandingcard/brandingcard.js
diff --git a/components/blocks/brandingcard/brandingcard.scss b/components/raw/brandingcard/brandingcard.scss
similarity index 100%
rename from components/blocks/brandingcard/brandingcard.scss
rename to components/raw/brandingcard/brandingcard.scss
diff --git a/components/01-units/button/button.js b/components/raw/button/button.js
similarity index 100%
rename from components/01-units/button/button.js
rename to components/raw/button/button.js
diff --git a/components/01-units/button/button.scss b/components/raw/button/button.scss
similarity index 100%
rename from components/01-units/button/button.scss
rename to components/raw/button/button.scss
diff --git a/components/01-units/cardlink/cardlink.js b/components/raw/cardlink/cardlink.js
similarity index 100%
rename from components/01-units/cardlink/cardlink.js
rename to components/raw/cardlink/cardlink.js
diff --git a/components/01-units/cardlink/cardlink.scss b/components/raw/cardlink/cardlink.scss
similarity index 80%
rename from components/01-units/cardlink/cardlink.scss
rename to components/raw/cardlink/cardlink.scss
index 4efc5e6..3352edf 100644
--- a/components/01-units/cardlink/cardlink.scss
+++ b/components/raw/cardlink/cardlink.scss
@@ -15,6 +15,7 @@
   padding-bottom: 7px;
   color: #1b3d6e;
   border-bottom: 2px solid #f16824;
+  width: fit-content; //this class is given to a div instead a link and the link is moved inside the div, so the div width must be specified
 }
 
 .cmp-cardlink:hover {
diff --git a/components/blocks/collapse-list/collapse-list.js b/components/raw/collapse-list/collapse-list.js
similarity index 100%
rename from components/blocks/collapse-list/collapse-list.js
rename to components/raw/collapse-list/collapse-list.js
diff --git a/components/blocks/collapse-list/collapse-list.scss b/components/raw/collapse-list/collapse-list.scss
similarity index 100%
rename from components/blocks/collapse-list/collapse-list.scss
rename to components/raw/collapse-list/collapse-list.scss
diff --git a/components/02-layout/cols/cols.js b/components/raw/cols/cols.js
similarity index 100%
rename from components/02-layout/cols/cols.js
rename to components/raw/cols/cols.js
diff --git a/components/02-layout/cols/cols.scss b/components/raw/cols/cols.scss
similarity index 100%
rename from components/02-layout/cols/cols.scss
rename to components/raw/cols/cols.scss
diff --git a/components/01-units/companies/companies.js b/components/raw/companies/companies.js
similarity index 100%
rename from components/01-units/companies/companies.js
rename to components/raw/companies/companies.js
diff --git a/components/01-units/companies/companies.scss b/components/raw/companies/companies.scss
similarity index 100%
rename from components/01-units/companies/companies.scss
rename to components/raw/companies/companies.scss
diff --git a/components/pages/demo01172020/demo01172020.js b/components/raw/demo01172020/demo01172020.js
similarity index 100%
rename from components/pages/demo01172020/demo01172020.js
rename to components/raw/demo01172020/demo01172020.js
diff --git a/components/raw/demo01172020/demo01172020.scss b/components/raw/demo01172020/demo01172020.scss
new file mode 100644
index 0000000..4635ee0
--- /dev/null
+++ b/components/raw/demo01172020/demo01172020.scss
@@ -0,0 +1,424 @@
+/**
+ *  Main css for Demo01172020
+ */
+
+// BEGIN OF DRUPAL SITE MARKUP STYLES
+
+.field__items > *:not([class*=" col"]):not([class^="col"]),
+.cmp-cols.cols-lg-1
+  > *:not([class*=" col"]):not([class^="col"]):not(.field__items) {
+  position: relative;
+  width: 100%;
+  padding-right: 15px;
+  padding-left: 15px;
+}
+/**
+ * Container
+ */
+.layout-container {
+  box-sizing: border-box;
+  max-width: 860px;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+@media all and (min-width: 851px) {
+  .layout-container {
+    max-width: 1290px;
+  }
+}
+
+/**
+ * Main
+ */
+.layout-main-wrapper {
+  min-height: 300px;
+}
+.layout-main {
+  margin-top: 20px;
+  margin-bottom: 40px;
+}
+
+/**
+ * @file
+ * Visual styles for Bartik's main-content component.
+ */
+
+.main-content .section {
+  padding: 0 15px;
+}
+.main-content h2 {
+  margin-bottom: 2px;
+  font-size: 1.429em;
+  line-height: 1.4;
+}
+
+@media all and (min-width: 851px) {
+  .main-content {
+    position: relative;
+    float: left; /* LTR */
+  }
+  [dir="rtl"] .main-content {
+    float: right;
+  }
+  .layout-two-sidebars .main-content {
+    width: 50%;
+    margin-right: 25%;
+    margin-left: 25%;
+  }
+  .layout-one-sidebar .main-content {
+    width: 75%;
+  }
+  .layout-no-sidebars .main-content {
+    width: 100%;
+  }
+  .layout-sidebar-first .main-content {
+    margin-right: 0; /* LTR */
+    margin-left: 25%; /* LTR */
+  }
+  [dir="rtl"] .layout-sidebar-first .main-content {
+    margin-right: 25%;
+    margin-left: 0;
+  }
+  .layout-sidebar-second .main-content {
+    margin-right: 25%; /* LTR */
+    margin-left: 0; /* LTR */
+  }
+  [dir="rtl"] .layout-sidebar-second .main-content {
+    margin-right: 0;
+    margin-left: 25%;
+  }
+}
+
+/**
+ * @file
+ * Visual styles for Bartik's field components.
+ */
+
+.field--type-entity-reference {
+  margin: 0 0 1.2em;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+.field--type-entity-reference .field__label {
+  margin: 0;
+  padding-right: 5px; /* LTR */
+  font-weight: normal;
+}
+[dir="rtl"] .field--type-entity-reference .field__label {
+  padding-right: 0;
+  padding-left: 5px;
+}
+.field--type-entity-reference .field__label,
+.field--type-entity-reference ul.links {
+  font-size: 0.8em;
+}
+.node--view-mode-teaser .field--type-entity-reference .field__label,
+.node--view-mode-teaser .field--type-entity-reference ul.links {
+  font-size: 0.821em;
+}
+.field--type-entity-reference ul.links {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+/* This is required to win over specificity of [dir="rtl"] .region-content ul */
+[dir="rtl"] .field--type-entity-reference ul.links {
+  padding: 0;
+}
+.field--type-entity-reference ul.links li {
+  float: left; /* LTR */
+  padding: 0 1em 0 0; /* LTR */
+  white-space: nowrap;
+}
+[dir="rtl"] .field--type-entity-reference ul.links li {
+  float: right;
+  padding: 0 0 0 1em;
+}
+
+@media all and (min-width: 560px) {
+  .node .field--type-image {
+    float: left; /* LTR */
+    margin: 0 1em 0 0; /* LTR */
+  }
+  [dir="rtl"] .node .field--type-image {
+    float: right;
+    margin: 0 0 0 1em;
+  }
+  .node .field--type-image + .field--type-image {
+    clear: both;
+  }
+}
+.field--type-image img,
+.field--name-user-picture img {
+  margin: 0 0 1em;
+}
+.field--type-image a {
+  border-bottom: none;
+}
+.field--name-field-tags {
+  margin: 0 0 1.2em;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+.field--name-field-tags .field__label {
+  margin: 0;
+  padding-right: 5px; /* LTR */
+  font-weight: normal;
+}
+[dir="rtl"] .field--name-field-tags .field__label {
+  padding-right: 0;
+  padding-left: 5px;
+}
+.field--name-field-tags .field__label,
+.field--name-field-tags ul.links {
+  font-size: 0.8em;
+}
+.node--view-mode-teaser .field--name-field-tags .field__label,
+.node--view-mode-teaser .field--name-field-tags ul.links {
+  font-size: 0.821em;
+}
+.field--name-field-tags ul.links {
+  margin: 0;
+  padding: 0;
+}
+.field--name-field-tags ul.links li {
+  float: left; /* LTR */
+  padding: 0 1em 0 0; /* LTR */
+  white-space: nowrap;
+}
+[dir="rtl"] .field--name-field-tags ul.links li {
+  float: right;
+  padding: 0 0 0 1em;
+}
+
+/**
+ * @file
+ * Visual styles for Bartik's blocks.
+ */
+
+/* Block has its own content wrapper. */
+.block .content {
+  margin-top: 10px;
+}
+
+/*
+ * @file
+ * Provides the layout styles for layout_onecol.
+ */
+.layout--onecol .layout__region {
+  width: 100%;
+}
+
+blockquote {
+  margin: 1.5em 10px;
+  padding: 0.5em 10px;
+  border-left: 1px solid #bbb;
+  background: #f7f7f7;
+  font-style: italic;
+}
+blockquote:before {
+  margin-right: 0.2em;
+  content: "\201C";
+  vertical-align: -0.4em;
+  color: #bbb;
+  font-size: 3em;
+  line-height: 0.1em;
+}
+blockquote .small:before,
+blockquote footer:before,
+blockquote small:before {
+  content: "\2014 \00A0";
+}
+@media (min-width: 768px) {
+  .cmp-cols.cols-md-2
+    .field__items
+    > *:not([class*=" col"]):not([class^="col"]),
+  .cmp-cols.cols-md-2
+    > *:not([class*=" col"]):not([class^="col"]):not(.field__items) {
+    -webkit-box-flex: 0;
+    flex: 0 0 50%;
+    max-width: 50%;
+  }
+}
+
+//END OF DRUPAL MARKUP STYLES
+
+#page {
+  .cmp-servicescards__cardcontainer {
+    .field__items {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: space-between;
+
+      > .field__item {
+        @media (min-width: 992px) {
+          flex: 0 0 28%;
+        }
+        .field.field--name-image.field--type-image.field--label-hidden.field__item {
+          margin: 0;
+        }
+        @media (max-width: 999px) {
+          .cmp-servcard {
+            width: 100%;
+          }
+        }
+      }
+    }
+
+    @media (min-width: 992px) {
+      .cmp-servcard,
+      .last-card {
+        min-width: 100%;
+      }
+    }
+  }
+
+  .cmp-brandingcard {
+    .clearfix.text-formatted.field.field--name-field-brand-body.field--type-text-long.field--label-hidden.field__item
+      p {
+      opacity: 0.6;
+      font-size: 0.875rem;
+    }
+    .field--name-image {
+      @extend .mx-auto;
+      .cmp-image {
+        @media (max-width: 999px) {
+          width: 50%;
+        }
+      }
+    }
+  }
+
+  .cmp-testimonial {
+    blockquote {
+      margin: 0 0 1rem;
+      padding: 0;
+      border-left: none;
+      background: white;
+      font-style: normal;
+    }
+    blockquote:before {
+      content: none;
+    }
+  }
+
+  .cmp-shadow-box-quote {
+    align-self: center;
+  }
+
+  .cmp-shadow-box-img {
+    // .field--name-field-testimonial-desk-image {
+
+    //     .field--name-image{
+    //         max-width: 100%;
+    //     }
+    // }
+  }
+
+  .cmp-image {
+    max-width: 100%;
+  }
+  .cmp-latest {
+    .container {
+      @media (min-width: 992px) {
+        max-width: 1200px;
+        padding: 0;
+      }
+    }
+    .cmp-latestcards__cardcontainer {
+      width: 100%;
+      .cmp-latestcard {
+        width: 100%;
+      }
+      .cmp-latestcard:hover {
+        box-shadow: none;
+      }
+      .cmp-latestcard:hover .cmp-imageblue .cmp-image {
+        opacity: 0.5;
+      }
+      .cmp-latestcard:hover .cmp-cardlink {
+        text-decoration: none;
+        cursor: pointer;
+        border-bottom: none;
+      }
+      .row {
+        display: grid;
+      }
+      .col-xs-12.col-sm-12.col-md-6.col-lg-6 {
+        width: 100%;
+        max-width: 100%;
+        padding: 0;
+        .cmp-latestcard {
+          .cmp-latestcard-content {
+            .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item {
+              flex: 0 0 100%;
+              max-width: 100%;
+              display: flex;
+              flex-wrap: wrap;
+              margin: 0;
+            }
+          }
+          .field__item {
+            @media (min-width: 992px) {
+              display: inline-flex;
+              flex: 0 0 45%;
+              max-width: 45%;
+              margin: 0 1.5rem;
+              padding: 0;
+              .heading-title
+                .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item {
+                min-width: 140px;
+              }
+              button.heading-link:hover {
+                border: none;
+              }
+            }
+          }
+          .field__item:hover {
+            box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+          }
+          .field__item:hover .cmp-imageblue .cmp-image {
+            opacity: 1;
+            transition: 0.3;
+          }
+          .field__item:hover .cmp-cardlink {
+            border-bottom: 2px solid #f16824;
+          }
+          .cmp-imageblue.bg-primary
+            .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item,
+          .cmp-imageblue.bg-primary
+            .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item
+            .field.field--name-image.field--type-image.field--label-hidden.field__item,
+          .cmp-latestcard__content
+            .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+          .cmp-text
+            .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+          .cmp-cardlink
+            .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item {
+            flex: 0 0 100%;
+            max-width: 100%;
+            margin: 0;
+          }
+          .cmp-text
+            .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover {
+            box-shadow: none;
+          }
+          .cmp-cardlink
+            .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item
+            a:hover {
+            text-decoration: none;
+            color: #1b3d6e;
+          }
+        }
+      }
+      .more-new.d-none.d-md-block {
+        width: 100%;
+      }
+      .more-news a {
+        color: white;
+      }
+      .more-news a:hover {
+        text-decoration: none;
+      }
+    }
+  }
+}
diff --git a/components/01-units/drupalitemsfacade/drupalitemsfacade.js b/components/raw/drupalitemsfacade/drupalitemsfacade.js
similarity index 100%
rename from components/01-units/drupalitemsfacade/drupalitemsfacade.js
rename to components/raw/drupalitemsfacade/drupalitemsfacade.js
diff --git a/components/01-units/drupalitemsfacade/drupalitemsfacade.scss b/components/raw/drupalitemsfacade/drupalitemsfacade.scss
similarity index 100%
rename from components/01-units/drupalitemsfacade/drupalitemsfacade.scss
rename to components/raw/drupalitemsfacade/drupalitemsfacade.scss
diff --git a/components/groups/footer/footer.js b/components/raw/footer/footer.js
similarity index 100%
rename from components/groups/footer/footer.js
rename to components/raw/footer/footer.js
diff --git a/components/groups/footer/footer.scss b/components/raw/footer/footer.scss
similarity index 100%
rename from components/groups/footer/footer.scss
rename to components/raw/footer/footer.scss
diff --git a/components/groups/header/header.js b/components/raw/header/header.js
similarity index 100%
rename from components/groups/header/header.js
rename to components/raw/header/header.js
diff --git a/components/groups/header/header.scss b/components/raw/header/header.scss
similarity index 100%
rename from components/groups/header/header.scss
rename to components/raw/header/header.scss
diff --git a/components/01-units/heading/heading.js b/components/raw/heading/heading.js
similarity index 100%
rename from components/01-units/heading/heading.js
rename to components/raw/heading/heading.js
diff --git a/components/01-units/heading/heading.scss b/components/raw/heading/heading.scss
similarity index 100%
rename from components/01-units/heading/heading.scss
rename to components/raw/heading/heading.scss
diff --git a/components/groups/hero/hero.js b/components/raw/hero/hero.js
similarity index 100%
rename from components/groups/hero/hero.js
rename to components/raw/hero/hero.js
diff --git a/components/groups/hero/hero.scss b/components/raw/hero/hero.scss
similarity index 100%
rename from components/groups/hero/hero.scss
rename to components/raw/hero/hero.scss
diff --git a/components/pages/homePage/homePage.js b/components/raw/homepage/homePage.js
similarity index 100%
rename from components/pages/homePage/homePage.js
rename to components/raw/homepage/homePage.js
diff --git a/components/pages/homePage/homePage.scss b/components/raw/homepage/homePage.scss
similarity index 100%
rename from components/pages/homePage/homePage.scss
rename to components/raw/homepage/homePage.scss
diff --git a/components/01-units/image/image.js b/components/raw/image/image.js
similarity index 100%
rename from components/01-units/image/image.js
rename to components/raw/image/image.js
diff --git a/components/01-units/image/image.scss b/components/raw/image/image.scss
similarity index 100%
rename from components/01-units/image/image.scss
rename to components/raw/image/image.scss
diff --git a/components/blocks/imageblue/imageblue.js b/components/raw/imageblue/imageblue.js
similarity index 100%
rename from components/blocks/imageblue/imageblue.js
rename to components/raw/imageblue/imageblue.js
diff --git a/components/blocks/imageblue/imageblue.scss b/components/raw/imageblue/imageblue.scss
similarity index 100%
rename from components/blocks/imageblue/imageblue.scss
rename to components/raw/imageblue/imageblue.scss
diff --git a/components/blocks/jumbo/jumbo.js b/components/raw/jumbo/jumbo.js
similarity index 100%
rename from components/blocks/jumbo/jumbo.js
rename to components/raw/jumbo/jumbo.js
diff --git a/components/blocks/jumbo/jumbo.scss b/components/raw/jumbo/jumbo.scss
similarity index 100%
rename from components/blocks/jumbo/jumbo.scss
rename to components/raw/jumbo/jumbo.scss
diff --git a/components/groups/latest/latest.js b/components/raw/latest/latest.js
similarity index 100%
rename from components/groups/latest/latest.js
rename to components/raw/latest/latest.js
diff --git a/components/groups/latest/latest.scss b/components/raw/latest/latest.scss
similarity index 100%
rename from components/groups/latest/latest.scss
rename to components/raw/latest/latest.scss
diff --git a/components/blocks/latestCard/latestCard.js b/components/raw/latestcard/latestCard.js
similarity index 100%
rename from components/blocks/latestCard/latestCard.js
rename to components/raw/latestcard/latestCard.js
diff --git a/components/blocks/latestCard/latestCard.scss b/components/raw/latestcard/latestCard.scss
similarity index 100%
rename from components/blocks/latestCard/latestCard.scss
rename to components/raw/latestcard/latestCard.scss
diff --git a/components/01-units/latestHeading/latestHeading.js b/components/raw/latestheading/latestHeading.js
similarity index 100%
rename from components/01-units/latestHeading/latestHeading.js
rename to components/raw/latestheading/latestHeading.js
diff --git a/components/01-units/latestHeading/latestHeading.scss b/components/raw/latestheading/latestHeading.scss
similarity index 95%
rename from components/01-units/latestHeading/latestHeading.scss
rename to components/raw/latestheading/latestHeading.scss
index a9e7629..2f4b994 100644
--- a/components/01-units/latestHeading/latestHeading.scss
+++ b/components/raw/latestheading/latestHeading.scss
@@ -3,9 +3,9 @@
  */
 
 .cmp-latestHeading {
-  margin-bottom: 2rem;
+  margin-bottom: 1rem;
   text-transform: uppercase;
-
+  height: 20px;
   .heading-title {
     color: white;
     float: left;
diff --git a/components/01-units/quote/quote.js b/components/raw/quote/quote.js
similarity index 100%
rename from components/01-units/quote/quote.js
rename to components/raw/quote/quote.js
diff --git a/components/01-units/quote/quote.scss b/components/raw/quote/quote.scss
similarity index 100%
rename from components/01-units/quote/quote.scss
rename to components/raw/quote/quote.scss
diff --git a/components/blocks/servcard/servcard.js b/components/raw/servcard/servcard.js
similarity index 100%
rename from components/blocks/servcard/servcard.js
rename to components/raw/servcard/servcard.js
diff --git a/components/blocks/servcard/servcard.scss b/components/raw/servcard/servcard.scss
similarity index 84%
rename from components/blocks/servcard/servcard.scss
rename to components/raw/servcard/servcard.scss
index df668eb..107a577 100644
--- a/components/blocks/servcard/servcard.scss
+++ b/components/raw/servcard/servcard.scss
@@ -12,6 +12,21 @@
 
   .cmp-servcard__image {
     display: none;
+
+    // Since the card image is given a couple of margin especications these must been overidden
+    .field--type-entity-reference {
+      margin: 0;
+      font-family: inherit;
+    }
+    .field--type-image img {
+      margin: 0;
+    }
+
+    @media all and (min-width: 560px) {
+      .node .field--type-image {
+        margin: 0 !important;
+      }
+    }
   }
   .cmp-servcard__content {
     padding: 30px;
@@ -34,6 +49,7 @@
       -webkit-box-orient: vertical;
       -webkit-line-clamp: 4;
       overflow-y: hidden;
+      margin-bottom: 1rem; //The text component turn from a p to a div which make it loose his margin at the bottom
     }
     .cmp-servcard__more {
       display: inline-block;
diff --git a/components/01-units/servcard2/servcard2.js b/components/raw/servcard2/servcard2.js
similarity index 100%
rename from components/01-units/servcard2/servcard2.js
rename to components/raw/servcard2/servcard2.js
diff --git a/components/01-units/servcard2/servcard2.scss b/components/raw/servcard2/servcard2.scss
similarity index 100%
rename from components/01-units/servcard2/servcard2.scss
rename to components/raw/servcard2/servcard2.scss
diff --git a/components/groups/serve-wedo/serve-wedo.js b/components/raw/serve-wedo/serve-wedo.js
similarity index 100%
rename from components/groups/serve-wedo/serve-wedo.js
rename to components/raw/serve-wedo/serve-wedo.js
diff --git a/components/groups/serve-wedo/serve-wedo.scss b/components/raw/serve-wedo/serve-wedo.scss
similarity index 100%
rename from components/groups/serve-wedo/serve-wedo.scss
rename to components/raw/serve-wedo/serve-wedo.scss
diff --git a/components/groups/servicescards/servicescards.js b/components/raw/servicescards/servicescards.js
similarity index 100%
rename from components/groups/servicescards/servicescards.js
rename to components/raw/servicescards/servicescards.js
diff --git a/components/groups/servicescards/servicescards.scss b/components/raw/servicescards/servicescards.scss
similarity index 100%
rename from components/groups/servicescards/servicescards.scss
rename to components/raw/servicescards/servicescards.scss
diff --git a/components/blocks/shadow-box/shadow-box.js b/components/raw/shadow-box/shadow-box.js
similarity index 100%
rename from components/blocks/shadow-box/shadow-box.js
rename to components/raw/shadow-box/shadow-box.js
diff --git a/components/raw/shadow-box/shadow-box.scss b/components/raw/shadow-box/shadow-box.scss
new file mode 100644
index 0000000..42fe539
--- /dev/null
+++ b/components/raw/shadow-box/shadow-box.scss
@@ -0,0 +1,75 @@
+/**
+ *  Main css for Shadow Box
+ */
+
+.cmp-shadow-box {
+  > .row {
+    margin-right: 0;
+    margin-left: 0;
+  }
+
+  .cmp-shadow-box-quote {
+    // border: red solid 1px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    // @extend .p-0;
+
+    .cmp-quote {
+      @extend .shadow-box;
+      @extend .px-4vw;
+      @extend .py-8vw;
+    }
+  }
+
+  .cmp-shadow-box-img {
+    position: relative;
+    @extend .shadow-box;
+    // border: blue solid 1px;
+    > .cmp-image {
+      object-fit: cover;
+      width: 100%;
+      max-height: 300px;
+      object-position: top;
+      margin: 0;
+    }
+    > .field--type-entity-reference {
+      margin: 0;
+    }
+    > .node .field--type-image {
+      margin: 0;
+    }
+    > .field--type-image img {
+      margin: 0;
+    }
+
+    .cmp-shadow-box-play-container {
+      @extend .fill-relative-parent;
+      display: flex;
+      align-items: flex-end;
+      button {
+        padding: 4vw;
+      }
+    }
+  }
+
+  @include media-breakpoint-up(md) {
+    .cmp-shadow-box-quote {
+      .cmp-quote {
+        @extend .my-md-4vw;
+      }
+    }
+
+    .cmp-shadow-box-img {
+      > .cmp-image {
+        min-height: 100%;
+        max-height: unset;
+      }
+
+      .cmp-shadow-box-play-container {
+        justify-content: center;
+        align-items: center;
+      }
+    }
+  }
+}
diff --git a/components/01-units/simpletext/simpletext.js b/components/raw/simpletext/simpletext.js
similarity index 100%
rename from components/01-units/simpletext/simpletext.js
rename to components/raw/simpletext/simpletext.js
diff --git a/components/01-units/simpletext/simpletext.scss b/components/raw/simpletext/simpletext.scss
similarity index 100%
rename from components/01-units/simpletext/simpletext.scss
rename to components/raw/simpletext/simpletext.scss
diff --git a/components/01-units/skew/skew.js b/components/raw/skew/skew.js
similarity index 100%
rename from components/01-units/skew/skew.js
rename to components/raw/skew/skew.js
diff --git a/components/01-units/skew/skew.scss b/components/raw/skew/skew.scss
similarity index 100%
rename from components/01-units/skew/skew.scss
rename to components/raw/skew/skew.scss
diff --git a/components/01-units/slider/slider.js b/components/raw/slider/slider.js
similarity index 100%
rename from components/01-units/slider/slider.js
rename to components/raw/slider/slider.js
diff --git a/components/01-units/slider/slider.scss b/components/raw/slider/slider.scss
similarity index 100%
rename from components/01-units/slider/slider.scss
rename to components/raw/slider/slider.scss
diff --git a/components/groups/testimonial/testimonial.js b/components/raw/testimonial/testimonial.js
similarity index 100%
rename from components/groups/testimonial/testimonial.js
rename to components/raw/testimonial/testimonial.js
diff --git a/components/groups/testimonial/testimonial.scss b/components/raw/testimonial/testimonial.scss
similarity index 100%
rename from components/groups/testimonial/testimonial.scss
rename to components/raw/testimonial/testimonial.scss
diff --git a/components/01-units/threelines/threelines.js b/components/raw/threelines/threelines.js
similarity index 100%
rename from components/01-units/threelines/threelines.js
rename to components/raw/threelines/threelines.js
diff --git a/components/01-units/threelines/threelines.scss b/components/raw/threelines/threelines.scss
similarity index 100%
rename from components/01-units/threelines/threelines.scss
rename to components/raw/threelines/threelines.scss
diff --git a/components/01-units/tricolor/example-carousel.html b/components/raw/tricolor/example-carousel.html
similarity index 100%
rename from components/01-units/tricolor/example-carousel.html
rename to components/raw/tricolor/example-carousel.html
diff --git a/components/01-units/tricolor/tricolor.js b/components/raw/tricolor/tricolor.js
similarity index 100%
rename from components/01-units/tricolor/tricolor.js
rename to components/raw/tricolor/tricolor.js
diff --git a/components/01-units/tricolor/tricolor.scss b/components/raw/tricolor/tricolor.scss
similarity index 100%
rename from components/01-units/tricolor/tricolor.scss
rename to components/raw/tricolor/tricolor.scss
diff --git a/components/01-units/unitmacros/unitmacros.js b/components/raw/unitmacros/unitmacros.js
similarity index 100%
rename from components/01-units/unitmacros/unitmacros.js
rename to components/raw/unitmacros/unitmacros.js
diff --git a/components/01-units/unitmacros/unitmacros.scss b/components/raw/unitmacros/unitmacros.scss
similarity index 100%
rename from components/01-units/unitmacros/unitmacros.scss
rename to components/raw/unitmacros/unitmacros.scss
diff --git a/components/01-units/video/video.js b/components/raw/video/video.js
similarity index 100%
rename from components/01-units/video/video.js
rename to components/raw/video/video.js
diff --git a/components/01-units/video/video.scss b/components/raw/video/video.scss
similarity index 100%
rename from components/01-units/video/video.scss
rename to components/raw/video/video.scss
diff --git a/components/groups/whatwedo/whatwedo.js b/components/raw/whatwedo/whatwedo.js
similarity index 100%
rename from components/groups/whatwedo/whatwedo.js
rename to components/raw/whatwedo/whatwedo.js
diff --git a/components/groups/whatwedo/whatwedo.scss b/components/raw/whatwedo/whatwedo.scss
similarity index 100%
rename from components/groups/whatwedo/whatwedo.scss
rename to components/raw/whatwedo/whatwedo.scss
diff --git a/components/groups/whoweserve/whoweserve.js b/components/raw/whoweserve/whoweserve.js
similarity index 100%
rename from components/groups/whoweserve/whoweserve.js
rename to components/raw/whoweserve/whoweserve.js
diff --git a/components/groups/whoweserve/whoweserve.scss b/components/raw/whoweserve/whoweserve.scss
similarity index 100%
rename from components/groups/whoweserve/whoweserve.scss
rename to components/raw/whoweserve/whoweserve.scss
diff --git a/components/render/affilliations.html b/components/render/affilliations.html
new file mode 100644
index 0000000..5cab9a1
--- /dev/null
+++ b/components/render/affilliations.html
@@ -0,0 +1,418 @@
+
+
+
+

+    
+

+
+
+
+   
+ 

+    working with 
 the industry’s best
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+    
+

+	

+
+		
+				  				  		
+		
+
+
+
+

+        
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
        
+
+
+            

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+        

+
+	

+
+	

+						  				  				  				
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+	

+            
+
        
+
+
+            

+    

+	

+
+

+    

+        
+
+
+     
+     
+     
+
+
+     

+

+
+
diff --git a/components/render/branding--default.html b/components/render/branding--default.html
new file mode 100644
index 0000000..8329fce
--- /dev/null
+++ b/components/render/branding--default.html
@@ -0,0 +1,169 @@
+
+
+
+
+
+
+
+
+
+
+
+

+
+
+    

+                        
+    

+        
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        
+
+

+   
+
+
+           

+	            
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+ 

+    Repair Information
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    tyre
+
+    
+ 

+    diagnostics
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    key
+
+    
+ 

+    shop management
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+    
+

+
+      
+

+    

+
+            

+    
+

+
diff --git a/components/render/branding--overlap.html b/components/render/branding--overlap.html
new file mode 100644
index 0000000..d96590e
--- /dev/null
+++ b/components/render/branding--overlap.html
@@ -0,0 +1,169 @@
+
+
+
+
+
+
+
+
+
+
+
+

+
+
+    

+                        
+    

+        
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        
+
+

+   
+
+
+           

+	            
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+ 

+    Repair Information
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    tyre
+
+    
+ 

+    diagnostics
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    key
+
+    
+ 

+    shop management
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+    
+

+
+      
+

+    

+
+            

+    
+

+
diff --git a/components/render/branding.html b/components/render/branding.html
new file mode 100644
index 0000000..8329fce
--- /dev/null
+++ b/components/render/branding.html
@@ -0,0 +1,169 @@
+
+
+
+
+
+
+
+
+
+
+
+

+
+
+    

+                        
+    

+        
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        
+
+

+   
+
+
+           

+	            
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+ 

+    Repair Information
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    tyre
+
+    
+ 

+    diagnostics
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    key
+
+    
+ 

+    shop management
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+    
+

+
+      
+

+    

+
+            

+    
+

+
diff --git a/components/render/brandingcard.html b/components/render/brandingcard.html
new file mode 100644
index 0000000..f879b8f
--- /dev/null
+++ b/components/render/brandingcard.html
@@ -0,0 +1,41 @@
+
+
+
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+    
+
+    
+ 

+    My heading
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+
diff --git a/components/render/button.html b/components/render/button.html
new file mode 100644
index 0000000..e82d657
--- /dev/null
+++ b/components/render/button.html
@@ -0,0 +1,11 @@
+
+
+
+
+
+     
+     
+     
+
+
+ 
diff --git a/components/render/cardlink.html b/components/render/cardlink.html
new file mode 100644
index 0000000..9b4a76e
--- /dev/null
+++ b/components/render/cardlink.html
@@ -0,0 +1,6 @@
+
+
+
+Learn more
+
+
diff --git a/components/render/collapse-list.html b/components/render/collapse-list.html
new file mode 100644
index 0000000..67e2a3b
--- /dev/null
+++ b/components/render/collapse-list.html
@@ -0,0 +1,53 @@
+
+
+
+

+    

+        Products
+        
+        
+    

+    
+

+
+
diff --git a/components/render/cols--content.html b/components/render/cols--content.html
new file mode 100644
index 0000000..13789fc
--- /dev/null
+++ b/components/render/cols--content.html
@@ -0,0 +1,19 @@
+
+
+
+
+
+
+

+   
+
+
+       
+
1

+
2

+
3

+    
+
+      
+

+
diff --git a/components/render/cols--default.html b/components/render/cols--default.html
new file mode 100644
index 0000000..adada31
--- /dev/null
+++ b/components/render/cols--default.html
@@ -0,0 +1,11 @@
+
+
+
+
+

+   
+
+
+      
+

+
diff --git a/components/render/cols--drupalcontent.html b/components/render/cols--drupalcontent.html
new file mode 100644
index 0000000..6994635
--- /dev/null
+++ b/components/render/cols--drupalcontent.html
@@ -0,0 +1,21 @@
+
+
+
+
+
+

+   
+
+
+       
+	
+	

+			
1

+		
2

+		
3

+	
+

+
+      
+

+
diff --git a/components/render/cols.html b/components/render/cols.html
new file mode 100644
index 0000000..adada31
--- /dev/null
+++ b/components/render/cols.html
@@ -0,0 +1,11 @@
+
+
+
+
+

+   
+
+
+      
+

+
diff --git a/components/render/companies--bs.html b/components/render/companies--bs.html
new file mode 100644
index 0000000..c75ee17
--- /dev/null
+++ b/components/render/companies--bs.html
@@ -0,0 +1,367 @@
+
+
+
+

+	

+
+		
+				  				  		
+		
+
+
+
+

+        
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
        
+
+
+            

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+        

+
+	

+
+	

+						  				  				  				
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+	

+            
+
        
+
+
+            

+    

+	

+
+

+
diff --git a/components/render/companies--default.html b/components/render/companies--default.html
new file mode 100644
index 0000000..b28b04f
--- /dev/null
+++ b/components/render/companies--default.html
@@ -0,0 +1,3 @@
+
+
+
diff --git a/components/render/companies--page.html b/components/render/companies--page.html
new file mode 100644
index 0000000..0b35db1
--- /dev/null
+++ b/components/render/companies--page.html
@@ -0,0 +1,137 @@
+
+
+

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+
diff --git a/components/render/companies.html b/components/render/companies.html
new file mode 100644
index 0000000..b28b04f
--- /dev/null
+++ b/components/render/companies.html
@@ -0,0 +1,3 @@
+
+
+
diff --git a/components/pages/demo01172020/demo01172020.twig b/components/render/demo01172020.html
similarity index 75%
rename from components/pages/demo01172020/demo01172020.twig
rename to components/render/demo01172020.html
index 9554237..8e213ff 100644
--- a/components/pages/demo01172020/demo01172020.twig
+++ b/components/render/demo01172020.html
@@ -1,803 +1,7 @@
-

-    {#  #}
+

+    
     

         

-    {#  #}
-

\ No newline at end of file
+    
+

diff --git a/components/01-units/drupalitemsfacade/drupalitemsfacade.twig b/components/render/drupalitemsfacade.html
similarity index 92%
rename from components/01-units/drupalitemsfacade/drupalitemsfacade.twig
rename to components/render/drupalitemsfacade.html
index 5b3251e..757e860 100644
--- a/components/01-units/drupalitemsfacade/drupalitemsfacade.twig
+++ b/components/render/drupalitemsfacade.html
@@ -1,3 +1,6 @@
+
+
 

-	{{items}}
+	
 

+
diff --git a/components/render/footer.html b/components/render/footer.html
new file mode 100644
index 0000000..7e8c9a5
--- /dev/null
+++ b/components/render/footer.html
@@ -0,0 +1,314 @@
+
+
+
+

+    

+        

+                            
+

+    

+        Products
+        
+        
+    

+    
+

+
+                            
+

+    

+        Support
+        
+        
+    

+    
+

+
+                            
+

+    

+        Resources
+        
+        
+    

+    
+

+
+                            
+

+    

+        About Us
+        
+        
+    

+    
+

+
+                            
+

+    

+        Contact us
+        
+        
+    

+    
+

+
+                            
+

+    

+        Related sites
+        
+        
+    

+    
+

+
+                    

+       
+        

+                  

+        Sign up to receive email updates 
+    

+              Sing Up
+                          
+                    

+    

+    

+        
+    

+

diff --git a/components/render/header.html b/components/render/header.html
new file mode 100644
index 0000000..8c22c97
--- /dev/null
+++ b/components/render/header.html
@@ -0,0 +1,967 @@
+
+
+
+
+
+

+   
+    
+    

+        

+            
+        

+        

+            
+        

+        

+    

+    
+    

+        

+            
+
+
+
+
+    Menu
+
+
+            
+            
+
+
+
+
+    Cart
+
+
+            
+
+
+
+
+    Search
+
+
+            
+        

+        

+            
+        

+    

+

+
+
diff --git a/components/render/heading--default.html b/components/render/heading--default.html
new file mode 100644
index 0000000..765c11f
--- /dev/null
+++ b/components/render/heading--default.html
@@ -0,0 +1,9 @@
+
+
+
+ 

+    My h1 heading
+ 

+
+   
+
diff --git a/components/render/heading--h2.html b/components/render/heading--h2.html
new file mode 100644
index 0000000..f1b108d
--- /dev/null
+++ b/components/render/heading--h2.html
@@ -0,0 +1,9 @@
+
+
+
+ 

+    My h2 heading
+ 

+
+   
+
diff --git a/components/render/heading--h3.html b/components/render/heading--h3.html
new file mode 100644
index 0000000..b3a5145
--- /dev/null
+++ b/components/render/heading--h3.html
@@ -0,0 +1,9 @@
+
+
+
+ 

+    My h3 heading
+ 

+
+   
+
diff --git a/components/render/heading--h4.html b/components/render/heading--h4.html
new file mode 100644
index 0000000..dbc07c3
--- /dev/null
+++ b/components/render/heading--h4.html
@@ -0,0 +1,9 @@
+
+
+
+ 

+    My h4 heading
+ 

+
+   
+
diff --git a/components/render/heading--h5.html b/components/render/heading--h5.html
new file mode 100644
index 0000000..870f468
--- /dev/null
+++ b/components/render/heading--h5.html
@@ -0,0 +1,9 @@
+
+
+
+ 

+    My h5 heading
+ 

+
+   
+
diff --git a/components/render/heading--h6.html b/components/render/heading--h6.html
new file mode 100644
index 0000000..a6fc3a1
--- /dev/null
+++ b/components/render/heading--h6.html
@@ -0,0 +1,9 @@
+
+
+
+ 

+    My h6 heading
+ 

+
+   
+
diff --git a/components/render/heading.html b/components/render/heading.html
new file mode 100644
index 0000000..2aca7ae
--- /dev/null
+++ b/components/render/heading.html
@@ -0,0 +1,108 @@
+
+
+
+

+    My h1 heading
+ 

+
+
+
+

+    My h2 heading
+ 

+
+
+
+

+    My h3 heading
+ 

+
+
+
+

+    My h4 heading
+ 

+
+
+
+

+    My h5 heading
+ 

+
+
+
+

+    My h6 heading
+ 

+
+
+
+

+    My h2 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+
+

+    My h3 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+
+

+    My h4 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+
+

+    My h5 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+
+

+    My h6 heading
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
diff --git a/components/render/hero--default.html b/components/render/hero--default.html
new file mode 100644
index 0000000..098e88b
--- /dev/null
+++ b/components/render/hero--default.html
@@ -0,0 +1,101 @@
+
+
+
+
+
+
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+            
+  
+

+    

+    

+    

+
+    
+
  

+    
+
+

+   
+
+
+         

+	  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+  
+
+

+
+      
+

+  

+
+    
+    
+

+
+
diff --git a/components/render/hero--slider.html b/components/render/hero--slider.html
new file mode 100644
index 0000000..51cd4ee
--- /dev/null
+++ b/components/render/hero--slider.html
@@ -0,0 +1,180 @@
+
+
+
+
+
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+            
+  
+

+    

+    

+    

+
+    
+
  

+    
+
+

+   
+
+
+         

+	  
+                
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+

+
+
+
+   
+ 

+    KYAUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+            
+
                                                                        

+                        
+

+
+
+
+   
+ 

+    Testing Carousel
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+            
+
        
+
+
+            

+    

+

+
+      
+

+  

+
+    
+    
+

+
+
diff --git a/components/render/hero.html b/components/render/hero.html
new file mode 100644
index 0000000..098e88b
--- /dev/null
+++ b/components/render/hero.html
@@ -0,0 +1,101 @@
+
+
+
+
+
+
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+            
+  
+

+    

+    

+    

+
+    
+
  

+    
+
+

+   
+
+
+         

+	  
+    
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+  
+
+

+
+      
+

+  

+
+    
+    
+

+
+
diff --git a/components/render/homepage.html b/components/render/homepage.html
new file mode 100644
index 0000000..c5379f3
--- /dev/null
+++ b/components/render/homepage.html
@@ -0,0 +1,1747 @@
+
+
+
+
+
+
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+            
+  
+

+    

+    

+    

+
+    
+
  

+    
+
+

+   
+
+
+         

+	  
+                
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+

+
+
+
+   
+ 

+    KYAUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+            
+
                                                                        

+                        
+

+
+
+
+   
+ 

+    Testing Carousel
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+            
+
        
+
+
+            

+    

+

+
+      
+

+  

+
+    
+    
+

+
+
+
+
+
+
+
+
+
+
+

+
+
+    

+                        
+    

+        
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        
+
+

+   
+
+
+           

+	            
+
+

+
+
+    
+
+        
+
+
+
+
+    mechanic
+
+    
+ 

+    Repair Information
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    tyre
+
+    
+ 

+    diagnostics
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+            
+
+

+
+
+    
+
+        
+
+
+
+
+    key
+
+    
+ 

+    shop management
+ 

+
+   
+          

+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur accumsan sapien a orci pharetra pretium.
+    

+  
+    

+

+
+    
+

+
+      
+

+    

+
+            

+    
+

+
+

+    
+

+    

+    

+    

+
+    
+
    

+        
+

+
+
+
+   
+ 

+    Who we serve
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+     
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        

+     
+            
+            

+	                                                                                                                                                                                                                                                          
+

+        

+    

+    

+        
+
+
+
+
+    
+
+    
+    
+
+    

+    

+        

+        
+

+
+
+
+   
+ 

+    WHA WE DO
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        

+    

+

+
+
+
+

+
+
+    

+                        

+        

+                        
+                        
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
        
+
+
+            

+    
            

+                      

+        See what over 400,000 technicians can't work without.
+    

+                  
+
+
+     
+     
+     
+
+
+             

+        

+    

+
+            

+    
+

+

+    
+

+
+
+
+   
+ 

+    working with 
 the industry’s best
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        ALLDATA proudly partners with other leaders in the automotive industry. These affiliations help ensure that the OEM information found in ALLDATA products is used in major organizations nationwide for vehicle repair and maintenance.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+    
+

+	

+
+		
+				  				  		
+		
+
+
+
+

+        
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
        
+
+
+            

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+        

+
+	

+
+	

+						  				  				  				
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+			

+			
+		

+	

+            
+
                                            

+                        

+			

+			
+		

+	

+            
+
        
+
+
+            

+    

+	

+
+

+    

+        
+
+
+     
+     
+     
+
+
+     

+

+
+
+
+
+

+
+
+    

+                    

+    

+        
+ 

+    see the latest
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+
+        

+            

+                                

+                    

+    
+

+    
News

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Five ways technology can help your dealership service
+ 

+
+   
+            
+                more
+            
+                  

+        At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+    

+              
+Learn More
+
+        

+    

+

+                

+                                

+                    

+    
+

+    
Teach tips

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Five ways technology can help your dealership service
+ 

+
+   
+            
+                more
+            
+                  

+        At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+    

+              
+Learn More
+
+        

+    

+

+                

+                                

+                    
+
+
+     
+     
+     
+
+
+                 

+            

+        

+    

+
+

+
+            

+    
+

+

+    

+        

+                            
+

+    

+        Products
+        
+        
+    

+    
+

+
+                            
+

+    

+        Support
+        
+        
+    

+    
+

+
+                            
+

+    

+        Resources
+        
+        
+    

+    
+

+
+                            
+

+    

+        About Us
+        
+        
+    

+    
+

+
+                            
+

+    

+        Contact us
+        
+        
+    

+    
+

+
+                            
+

+    

+        Related sites
+        
+        
+    

+    
+

+
+                    

+       
+        

+                  

+        Sign up to receive email updates 
+    

+              Sing Up
+                          
+                    

+    

+    

+        
+    

+

+
diff --git a/components/render/image--default.html b/components/render/image--default.html
new file mode 100644
index 0000000..9af3218
--- /dev/null
+++ b/components/render/image--default.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+
+    mechanic
+
+    
+    
+
+
diff --git a/components/render/image--svg.html b/components/render/image--svg.html
new file mode 100644
index 0000000..5d30f61
--- /dev/null
+++ b/components/render/image--svg.html
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+    mechanic
+
+
diff --git a/components/render/image.html b/components/render/image.html
new file mode 100644
index 0000000..9af3218
--- /dev/null
+++ b/components/render/image.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+
+    mechanic
+
+    
+    
+
+
diff --git a/components/render/imageblue.html b/components/render/imageblue.html
new file mode 100644
index 0000000..fab632b
--- /dev/null
+++ b/components/render/imageblue.html
@@ -0,0 +1,15 @@
+
+
+
+

+    
+
+
+
+
+    
+
+    
+    
+
+

diff --git a/components/render/jumbo--default.html b/components/render/jumbo--default.html
new file mode 100644
index 0000000..5925f39
--- /dev/null
+++ b/components/render/jumbo--default.html
@@ -0,0 +1,48 @@
+
+
+
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
diff --git a/components/render/jumbo--no-button-and-no-three-lines.html b/components/render/jumbo--no-button-and-no-three-lines.html
new file mode 100644
index 0000000..3351ff7
--- /dev/null
+++ b/components/render/jumbo--no-button-and-no-three-lines.html
@@ -0,0 +1,31 @@
+
+
+
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
diff --git a/components/render/jumbo--no-button.html b/components/render/jumbo--no-button.html
new file mode 100644
index 0000000..5296879
--- /dev/null
+++ b/components/render/jumbo--no-button.html
@@ -0,0 +1,40 @@
+
+
+
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
diff --git a/components/render/jumbo--no-three-lines.html b/components/render/jumbo--no-three-lines.html
new file mode 100644
index 0000000..93f2e5f
--- /dev/null
+++ b/components/render/jumbo--no-three-lines.html
@@ -0,0 +1,39 @@
+
+
+
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
diff --git a/components/render/jumbo--simple.html b/components/render/jumbo--simple.html
new file mode 100644
index 0000000..3c8e86a
--- /dev/null
+++ b/components/render/jumbo--simple.html
@@ -0,0 +1,31 @@
+
+
+
+

+
+
+
+   
+ 

+    Why ALLDATA
+ 

+
+   
+ 
+         

+        ALLDATA is the industry’s #1 choice for OEM-accurate mechanical and collision repair information, shop management software, and support services, trusted by more than 400,000 technicians in over 115,000 shops worldwide.
+    

+  
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
diff --git a/components/render/jumbo.html b/components/render/jumbo.html
new file mode 100644
index 0000000..5925f39
--- /dev/null
+++ b/components/render/jumbo.html
@@ -0,0 +1,48 @@
+
+
+
+

+
+
+
+   
+ 

+    AUTOMOTIVE INTELLIGENCE
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        From providing shop management software to customer communication tools, we've been the industry leader of OEM auto repair software since 1986.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
diff --git a/components/render/latest.html b/components/render/latest.html
new file mode 100644
index 0000000..eeba3c9
--- /dev/null
+++ b/components/render/latest.html
@@ -0,0 +1,163 @@
+
+
+
+
+
+

+
+
+    

+                    

+    

+        
+ 

+    see the latest
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+
+        

+            

+                                

+                    

+    
+

+    
News

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Five ways technology can help your dealership service
+ 

+
+   
+            
+                more
+            
+                  

+        At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+    

+              
+Learn More
+
+        

+    

+

+                

+                                

+                    

+    
+

+    
Teach tips

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Five ways technology can help your dealership service
+ 

+
+   
+            
+                more
+            
+                  

+        At the NIADA Convention and Expo, George Verkamp (shown above), Vice President of Sales & Business Development at ALLDATA...
+    

+              
+Learn More
+
+        

+    

+

+                

+                                

+                    
+
+
+     
+     
+     
+
+
+                 

+            

+        

+    

+
+

+
+            

+    
+

diff --git a/components/render/latestcard.html b/components/render/latestcard.html
new file mode 100644
index 0000000..62f3acf
--- /dev/null
+++ b/components/render/latestcard.html
@@ -0,0 +1,58 @@
+
+
+

+    
+

+    
news

+    
+

+
+    

+        

+            

+                
+

+    
+
+
+
+
+    
+
+    
+    
+
+
            

+            

+                
+
+
+
+
+    
+
+    
+    
+
+            

+        

+        

+            
+ 

+    Independent collision shops
+ 

+
+   
+            
+                more
+            
+                  

+        Our Collision Advantage integrates with the three major estimating systems, analyzing your estimate in seconds and displaying on a single screen.
+    

+              
+Learn More
+
+        

+    

+

+
diff --git a/components/render/latestheading.html b/components/render/latestheading.html
new file mode 100644
index 0000000..42659d9
--- /dev/null
+++ b/components/render/latestheading.html
@@ -0,0 +1,9 @@
+
+
+
+

+    
News

+    
+

+
+
diff --git a/components/render/preview.html b/components/render/preview.html
new file mode 100644
index 0000000..b856000
--- /dev/null
+++ b/components/render/preview.html
@@ -0,0 +1,19 @@
+
+
+
+
+  
+    
+    kykyn
+    
+    
+    
+    
+  
+
+  
+    [object Object]
+    
+  
+
+
diff --git a/components/render/quote.html b/components/render/quote.html
new file mode 100644
index 0000000..4595325
--- /dev/null
+++ b/components/render/quote.html
@@ -0,0 +1,22 @@
+
+
+

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+

diff --git a/components/render/servcard.html b/components/render/servcard.html
new file mode 100644
index 0000000..a09d1c1
--- /dev/null
+++ b/components/render/servcard.html
@@ -0,0 +1,37 @@
+
+
+ 
diff --git a/components/render/servcard2.html b/components/render/servcard2.html
new file mode 100644
index 0000000..87caf64
--- /dev/null
+++ b/components/render/servcard2.html
@@ -0,0 +1,35 @@
+
+
+
diff --git a/components/render/serve-wedo.html b/components/render/serve-wedo.html
new file mode 100644
index 0000000..0cf097d
--- /dev/null
+++ b/components/render/serve-wedo.html
@@ -0,0 +1,320 @@
+
+
+
+

+    
+

+    

+    

+    

+
+    
+
    

+        
+

+
+
+
+   
+ 

+    Who we serve
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+     
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        

+     
+            
+            

+	                                                                                                                                                                                                                                                          
+

+        

+    

+    

+        
+
+
+
+
+    
+
+    
+    
+
+    

+    

+        

+        
+

+
+
+
+   
+ 

+    WHA WE DO
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+        

+    

+

diff --git a/components/render/servicescards.html b/components/render/servicescards.html
new file mode 100644
index 0000000..e327229
--- /dev/null
+++ b/components/render/servicescards.html
@@ -0,0 +1,284 @@
+
+
+        
+
+
+
+

+
+
+    
+    
+                

+        
+

+    

+    

+    

+
+    
+
        
+

+
+
+
+   
+ 

+    Who we serve
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+     
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+
+        
+
+                

+            
+
+

+   
+
+
+                   

+	            
+                                                                                                                                                                                                  
+

+        
+      
+

+        

+     
+        
+    

+
+    
+    
+

diff --git a/components/render/shadow-box.html b/components/render/shadow-box.html
new file mode 100644
index 0000000..5161a3c
--- /dev/null
+++ b/components/render/shadow-box.html
@@ -0,0 +1,68 @@
+
+
+
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+
diff --git a/components/render/simpletext.html b/components/render/simpletext.html
new file mode 100644
index 0000000..e6f1dfa
--- /dev/null
+++ b/components/render/simpletext.html
@@ -0,0 +1,6 @@
+
+
+      

+        This is an simpletext component!
+    

+  
diff --git a/components/render/skew--default.html b/components/render/skew--default.html
new file mode 100644
index 0000000..c0fa109
--- /dev/null
+++ b/components/render/skew--default.html
@@ -0,0 +1,13 @@
+
+
+
+
+

+
+
+    
+    
+    
+    
+

diff --git a/components/render/skew--image.html b/components/render/skew--image.html
new file mode 100644
index 0000000..b52c3f1
--- /dev/null
+++ b/components/render/skew--image.html
@@ -0,0 +1,23 @@
+
+
+
+
+

+
+
+    
+            
+
+
+
+
+    hero
+
+    
+    
+
+    
+    
+    
+

diff --git a/components/render/skew--inlineimage.html b/components/render/skew--inlineimage.html
new file mode 100644
index 0000000..9523f96
--- /dev/null
+++ b/components/render/skew--inlineimage.html
@@ -0,0 +1,12 @@
+
+
+
+
+

+
+
+    

+            

+    
+

diff --git a/components/render/skew--on.html b/components/render/skew--on.html
new file mode 100644
index 0000000..e28e03f
--- /dev/null
+++ b/components/render/skew--on.html
@@ -0,0 +1,12 @@
+
+
+
+
+

+
+
+    

+            

+    
+

diff --git a/components/render/skew.html b/components/render/skew.html
new file mode 100644
index 0000000..c0fa109
--- /dev/null
+++ b/components/render/skew.html
@@ -0,0 +1,13 @@
+
+
+
+
+

+
+
+    
+    
+    
+    
+

diff --git a/components/render/slider--default.html b/components/render/slider--default.html
new file mode 100644
index 0000000..77ce7a7
--- /dev/null
+++ b/components/render/slider--default.html
@@ -0,0 +1,75 @@
+
+
+
+                
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+            

+    

+
+
diff --git a/components/render/slider--dyn.html b/components/render/slider--dyn.html
new file mode 100644
index 0000000..a41b3fe
--- /dev/null
+++ b/components/render/slider--dyn.html
@@ -0,0 +1,72 @@
+
+
+
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+            

+    

diff --git a/components/render/slider--dynamic.html b/components/render/slider--dynamic.html
new file mode 100644
index 0000000..c095c74
--- /dev/null
+++ b/components/render/slider--dynamic.html
@@ -0,0 +1,8 @@
+
+
+
+

+        

+            

+ 
+

diff --git a/components/render/slider--new.html b/components/render/slider--new.html
new file mode 100644
index 0000000..599e633
--- /dev/null
+++ b/components/render/slider--new.html
@@ -0,0 +1,45 @@
+
+
+
+

+            

+            
+            
+                
+
+            Previous
+            
+            
    
+
+                            
  1. 
+                            
  2. 
+                            
  3. 
+                        
+            

+            
+            
+            
+                
+            Next
+            
+        

+        

+                                    

+                    First slide
+                    
+                

+                            

+                    First slide
+                    
+                

+                            

+                    First slide
+                    
+                

+                        

+ 
+

diff --git a/components/render/slider--slide.html b/components/render/slider--slide.html
new file mode 100644
index 0000000..0e0380f
--- /dev/null
+++ b/components/render/slider--slide.html
@@ -0,0 +1,5 @@
+
+
+

+    Hello
+

diff --git a/components/render/slider--slides.html b/components/render/slider--slides.html
new file mode 100644
index 0000000..3b87cd3
--- /dev/null
+++ b/components/render/slider--slides.html
@@ -0,0 +1,76 @@
+
+
+
+    
+    
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+            

+    
    
+
+
diff --git a/components/render/slider--slidessimple.html b/components/render/slider--slidessimple.html
new file mode 100644
index 0000000..c20a0f2
--- /dev/null
+++ b/components/render/slider--slidessimple.html
@@ -0,0 +1,42 @@
+
+
+
+                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                            

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
diff --git a/components/render/slider.html b/components/render/slider.html
new file mode 100644
index 0000000..77ce7a7
--- /dev/null
+++ b/components/render/slider.html
@@ -0,0 +1,75 @@
+
+
+
+                
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                                    
  3. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
                                                                        

+                        
+
+
+
+
+    
+
+    
+    
+
+            
+
        
+
+
+            

+    

+
+
diff --git a/components/render/testimonial--default.html b/components/render/testimonial--default.html
new file mode 100644
index 0000000..ae58605
--- /dev/null
+++ b/components/render/testimonial--default.html
@@ -0,0 +1,199 @@
+
+
+
+
+
+
+

+
+
+    

+                        

+        

+                        
+                        
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
        
+
+
+            

+    
            

+                      

+        See what over 400,000 technicians can't work without.
+    

+                  
+
+
+     
+     
+     
+
+
+             

+        

+    

+
+            

+    
+

diff --git a/components/render/testimonial--overlap.html b/components/render/testimonial--overlap.html
new file mode 100644
index 0000000..18c284b
--- /dev/null
+++ b/components/render/testimonial--overlap.html
@@ -0,0 +1,199 @@
+
+
+
+
+
+
+

+
+
+    

+                        

+        

+                        
+                        
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
        
+
+
+            

+    
            

+                      

+        See what over 400,000 technicians can't work without.
+    

+                  
+
+
+     
+     
+     
+
+
+             

+        

+    

+
+            

+    
+

diff --git a/components/render/testimonial.html b/components/render/testimonial.html
new file mode 100644
index 0000000..ae58605
--- /dev/null
+++ b/components/render/testimonial.html
@@ -0,0 +1,199 @@
+
+
+
+
+
+
+

+
+
+    

+                        

+        

+                        
+                        
+
+
+
+

+                

+            
+                
+
+                Previous
+            
+            
    
+                                    
  1. 
+                                    
  2. 
+                            

+            
+                
+                Next
+            
+        

+            
+
+    

+                        
+                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
                                            

+                        
+
+
+
+

+    
+
+

+   
+
+
+         

+    
+
+
+
+
+    happy man
+
+    
+    
+
+
+    
+    

+      
+    

+
+  

+  

+      

+    
+
+
+
+
+    
+
+    

+        
ALLDATA allows us to have access to the information we need, and it’s completely portable, so our techs have everything at their fingertips.

+        
Josh Kazdan, Autosphere

+    

+    
+
+
+
+
+    
+
+
  
 
+
+      
+

+

+
+            
+
        
+
+
+            

+    
            

+                      

+        See what over 400,000 technicians can't work without.
+    

+                  
+
+
+     
+     
+     
+
+
+             

+        

+    

+
+            

+    
+

diff --git a/components/01-units/threelines/threelines.twig b/components/render/threelines.html
similarity index 98%
rename from components/01-units/threelines/threelines.twig
rename to components/render/threelines.html
index 17ea355..bcbf600 100644
--- a/components/01-units/threelines/threelines.twig
+++ b/components/render/threelines.html
@@ -1,7 +1,10 @@
 
+
+
 
     
         
     
 
 
+
diff --git a/components/01-units/tricolor/tricolor.twig b/components/render/tricolor--default.html
similarity index 98%
rename from components/01-units/tricolor/tricolor.twig
rename to components/render/tricolor--default.html
index 82f6e2c..e14e744 100644
--- a/components/01-units/tricolor/tricolor.twig
+++ b/components/render/tricolor--default.html
@@ -1,6 +1,9 @@
+
+
 

     

     

     

 

 
+
diff --git a/components/render/tricolor--position.html b/components/render/tricolor--position.html
new file mode 100644
index 0000000..b2ecb9a
--- /dev/null
+++ b/components/render/tricolor--position.html
@@ -0,0 +1,10 @@
+
+
+
+

+    

+    

+    

+
+    
+

diff --git a/components/render/tricolor.html b/components/render/tricolor.html
new file mode 100644
index 0000000..e14e744
--- /dev/null
+++ b/components/render/tricolor.html
@@ -0,0 +1,9 @@
+
+
+

+    

+    

+    

+

+
+
diff --git a/components/render/unitmacros.html b/components/render/unitmacros.html
new file mode 100644
index 0000000..6fb66a5
--- /dev/null
+++ b/components/render/unitmacros.html
@@ -0,0 +1,6 @@
+
+
+
+
+
+
diff --git a/components/01-units/video/video.twig b/components/render/video--default.html
similarity index 66%
rename from components/01-units/video/video.twig
rename to components/render/video--default.html
index 41e1748..7ee59a6 100644
--- a/components/01-units/video/video.twig
+++ b/components/render/video--default.html
@@ -1,5 +1,8 @@
 
-

+
+
+

    
 

 
+
diff --git a/components/01-units/video/video--iframe.twig b/components/render/video--iframe.html
similarity index 80%
rename from components/01-units/video/video--iframe.twig
rename to components/render/video--iframe.html
index 266f004..576eb09 100644
--- a/components/01-units/video/video--iframe.twig
+++ b/components/render/video--iframe.html
@@ -1,10 +1,13 @@
 
+
+
 

     
 

 
+
diff --git a/components/render/video.html b/components/render/video.html
new file mode 100644
index 0000000..7ee59a6
--- /dev/null
+++ b/components/render/video.html
@@ -0,0 +1,8 @@
+
+
+
+

+   
+

+
+
diff --git a/components/render/whatwedo.html b/components/render/whatwedo.html
new file mode 100644
index 0000000..ec313d8
--- /dev/null
+++ b/components/render/whatwedo.html
@@ -0,0 +1,88 @@
+
+
+
+

+    

+                
+
+

+
+
+    
+    
+                        
+

+    

+    

+    

+
+    
+
        
+    
+    
+
    

+    

+                
+
+

+
+
+    

+                                

+        
+            

+    
+
    

+    

+        
+

+
+
+
+   
+ 

+    WHA WE DO
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+         

+        We are a data-driven solutions provider working hard and smart to help automotive repair shops be the best they can be.
+    

+  
+         
+
+
+     
+     
+     
+
+
+    

+
+
+   
+   
+   
+   
+  
+
+
+
+
+    

+

+
+
+
diff --git a/components/render/whoweserve.html b/components/render/whoweserve.html
new file mode 100644
index 0000000..90ff63b
--- /dev/null
+++ b/components/render/whoweserve.html
@@ -0,0 +1,267 @@
+
+
+

+	
+

+
+
+
+   
+ 

+    Who we serve
+ 

+
+         
+      
+
+    
+        
+    
+
+
+
+   
+ 
+     
+   

+
+
+   
+   
+   
+   
+  
+
+
+
+
+
+	
+
+		

+		
+
+

+   
+
+
+       	

+	
+																				
+

+	
+      
+

+	

+

+
diff --git a/css/Gotham-Bold.7f7e1605.woff b/css/Gotham-Bold.7f7e1605.woff
new file mode 100644
index 0000000..d80b9db
Binary files /dev/null and b/css/Gotham-Bold.7f7e1605.woff differ
diff --git a/css/Gotham-Book.9316bc27.woff b/css/Gotham-Book.9316bc27.woff
new file mode 100644
index 0000000..f9cde27
Binary files /dev/null and b/css/Gotham-Book.9316bc27.woff differ
diff --git a/css/Gotham-Light.23be3122.woff b/css/Gotham-Light.23be3122.woff
new file mode 100644
index 0000000..25feff7
Binary files /dev/null and b/css/Gotham-Light.23be3122.woff differ
diff --git a/css/Gotham-Medium.b074dd9f.woff b/css/Gotham-Medium.b074dd9f.woff
new file mode 100644
index 0000000..71785a4
Binary files /dev/null and b/css/Gotham-Medium.b074dd9f.woff differ
diff --git a/css/Gotham-Thin.cb57ce42.woff b/css/Gotham-Thin.cb57ce42.woff
new file mode 100644
index 0000000..93bec7a
Binary files /dev/null and b/css/Gotham-Thin.cb57ce42.woff differ
diff --git a/css/Gotham-Ultra.2d842462.woff b/css/Gotham-Ultra.2d842462.woff
new file mode 100644
index 0000000..965954b
Binary files /dev/null and b/css/Gotham-Ultra.2d842462.woff differ
diff --git a/css/carfix2.4b1927a0.jpg b/css/carfix2.4b1927a0.jpg
new file mode 100644
index 0000000..b42a2a4
Binary files /dev/null and b/css/carfix2.4b1927a0.jpg differ
diff --git a/css/global.css b/css/global.css
new file mode 100644
index 0000000..f179e6c
--- /dev/null
+++ b/css/global.css
@@ -0,0 +1,16097 @@
+@charset "UTF-8";
+:root {
+  --blue: #1b3d6e;
+  --indigo: #6610f2;
+  --purple: #6f42c1;
+  --pink: #e83e8c;
+  --red: #dc3545;
+  --orange: #f16824;
+  --yellow: #ffc107;
+  --green: #28a745;
+  --teal: #20c997;
+  --cyan: #17a2b8;
+  --white: #fff;
+  --gray: #6c757d;
+  --gray-dark: #343a40;
+  --primary: #1b3d6e;
+  --secondary: #f16824;
+  --success: #28a745;
+  --info: #17a2b8;
+  --warning: #ffc107;
+  --danger: #dc3545;
+  --light: #f8f9fa;
+  --dark: #343a40;
+  --breakpoint-xs: 0;
+  --breakpoint-sm: 576px;
+  --breakpoint-md: 768px;
+  --breakpoint-lg: 992px;
+  --breakpoint-xl: 1200px;
+  --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+html {
+  font-family: sans-serif;
+  line-height: 1.15;
+  -webkit-text-size-adjust: 100%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
+  display: block;
+}
+
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #212529;
+  text-align: left;
+  background-color: #fff;
+}
+
+[tabindex="-1"]:focus:not(:focus-visible) {
+  outline: 0 !important;
+}
+
+hr {
+  box-sizing: content-box;
+  height: 0;
+  overflow: visible;
+}
+
+h1, h2, h3, h4, h5, h6 {
+  margin-top: 0;
+  margin-bottom: 0.5rem;
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+abbr[title],
+abbr[data-original-title] {
+  text-decoration: underline;
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
+  cursor: help;
+  border-bottom: 0;
+  -webkit-text-decoration-skip-ink: none;
+          text-decoration-skip-ink: none;
+}
+
+address {
+  margin-bottom: 1rem;
+  font-style: normal;
+  line-height: inherit;
+}
+
+ol,
+ul,
+dl {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+ol ol,
+ul ul,
+ol ul,
+ul ol {
+  margin-bottom: 0;
+}
+
+dt {
+  font-weight: 700;
+}
+
+dd {
+  margin-bottom: 0.5rem;
+  margin-left: 0;
+}
+
+blockquote {
+  margin: 0 0 1rem;
+}
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+small {
+  font-size: 80%;
+}
+
+sub,
+sup {
+  position: relative;
+  font-size: 75%;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+a {
+  color: #1b3d6e;
+  text-decoration: none;
+  background-color: transparent;
+}
+a:hover {
+  color: #0c1b31;
+  text-decoration: underline;
+}
+
+a:not([href]) {
+  color: inherit;
+  text-decoration: none;
+}
+a:not([href]):hover {
+  color: inherit;
+  text-decoration: none;
+}
+
+pre,
+code,
+kbd,
+samp {
+  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-size: 1em;
+}
+
+pre {
+  margin-top: 0;
+  margin-bottom: 1rem;
+  overflow: auto;
+}
+
+figure {
+  margin: 0 0 1rem;
+}
+
+img {
+  vertical-align: middle;
+  border-style: none;
+}
+
+svg {
+  overflow: hidden;
+  vertical-align: middle;
+}
+
+table {
+  border-collapse: collapse;
+}
+
+caption {
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
+  color: #6c757d;
+  text-align: left;
+  caption-side: bottom;
+}
+
+th {
+  text-align: inherit;
+}
+
+label {
+  display: inline-block;
+  margin-bottom: 0.5rem;
+}
+
+button {
+  border-radius: 0;
+}
+
+button:focus {
+  outline: 1px dotted;
+  outline: 5px auto -webkit-focus-ring-color;
+}
+
+input,
+button,
+select,
+optgroup,
+textarea {
+  margin: 0;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+button,
+input {
+  overflow: visible;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+select {
+  word-wrap: normal;
+}
+
+button,
+[type=button],
+[type=reset],
+[type=submit] {
+  -webkit-appearance: button;
+}
+
+button:not(:disabled),
+[type=button]:not(:disabled),
+[type=reset]:not(:disabled),
+[type=submit]:not(:disabled) {
+  cursor: pointer;
+}
+
+button::-moz-focus-inner,
+[type=button]::-moz-focus-inner,
+[type=reset]::-moz-focus-inner,
+[type=submit]::-moz-focus-inner {
+  padding: 0;
+  border-style: none;
+}
+
+input[type=radio],
+input[type=checkbox] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+input[type=date],
+input[type=time],
+input[type=datetime-local],
+input[type=month] {
+  -webkit-appearance: listbox;
+}
+
+textarea {
+  overflow: auto;
+  resize: vertical;
+}
+
+fieldset {
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+legend {
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  padding: 0;
+  margin-bottom: 0.5rem;
+  font-size: 1.5rem;
+  line-height: inherit;
+  color: inherit;
+  white-space: normal;
+}
+
+progress {
+  vertical-align: baseline;
+}
+
+[type=number]::-webkit-inner-spin-button,
+[type=number]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+[type=search] {
+  outline-offset: -2px;
+  -webkit-appearance: none;
+}
+
+[type=search]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+::-webkit-file-upload-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+output {
+  display: inline-block;
+}
+
+summary {
+  display: list-item;
+  cursor: pointer;
+}
+
+template {
+  display: none;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+h1, h2, h3, h4, h5, h6,
+.h1, .h2, .h3, .h4, .h5, .h6 {
+  margin-bottom: 0.5rem;
+  font-weight: 500;
+  line-height: 1.2;
+}
+
+h1, .h1 {
+  font-size: 2.5rem;
+}
+
+h2, .h2 {
+  font-size: 2rem;
+}
+
+h3, .h3 {
+  font-size: 1.75rem;
+}
+
+h4, .h4 {
+  font-size: 1.5rem;
+}
+
+h5, .h5 {
+  font-size: 1.25rem;
+}
+
+h6, .h6 {
+  font-size: 1rem;
+}
+
+.lead {
+  font-size: 1.25rem;
+  font-weight: 300;
+}
+
+.display-1 {
+  font-size: 6rem;
+  font-weight: 300;
+  line-height: 1.2;
+}
+
+.display-2 {
+  font-size: 5.5rem;
+  font-weight: 300;
+  line-height: 1.2;
+}
+
+.display-3 {
+  font-size: 4.5rem;
+  font-weight: 300;
+  line-height: 1.2;
+}
+
+.display-4 {
+  font-size: 3.5rem;
+  font-weight: 300;
+  line-height: 1.2;
+}
+
+hr {
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+  border: 0;
+  border-top: 1px solid rgba(0, 0, 0, 0.1);
+}
+
+small,
+.small {
+  font-size: 80%;
+  font-weight: 400;
+}
+
+mark,
+.mark {
+  padding: 0.2em;
+  background-color: #fcf8e3;
+}
+
+.list-unstyled {
+  padding-left: 0;
+  list-style: none;
+}
+
+.list-inline {
+  padding-left: 0;
+  list-style: none;
+}
+
+.list-inline-item {
+  display: inline-block;
+}
+.list-inline-item:not(:last-child) {
+  margin-right: 0.5rem;
+}
+
+.initialism {
+  font-size: 90%;
+  text-transform: uppercase;
+}
+
+.blockquote {
+  margin-bottom: 1rem;
+  font-size: 1.25rem;
+}
+
+.blockquote-footer {
+  display: block;
+  font-size: 80%;
+  color: #6c757d;
+}
+.blockquote-footer::before {
+  content: "— ";
+}
+
+.img-fluid, .cmp-skew > .cmp-image {
+  max-width: 100%;
+  height: auto;
+}
+
+.img-thumbnail {
+  padding: 0.25rem;
+  background-color: #fff;
+  border: 1px solid #dee2e6;
+  max-width: 100%;
+  height: auto;
+}
+
+.figure {
+  display: inline-block;
+}
+
+.figure-img {
+  margin-bottom: 0.5rem;
+  line-height: 1;
+}
+
+.figure-caption {
+  font-size: 90%;
+  color: #6c757d;
+}
+
+code {
+  font-size: 87.5%;
+  color: #e83e8c;
+  word-wrap: break-word;
+}
+a > code {
+  color: inherit;
+}
+
+kbd {
+  padding: 0.2rem 0.4rem;
+  font-size: 87.5%;
+  color: #fff;
+  background-color: #212529;
+}
+kbd kbd {
+  padding: 0;
+  font-size: 100%;
+  font-weight: 700;
+}
+
+pre {
+  display: block;
+  font-size: 87.5%;
+  color: #212529;
+}
+pre code {
+  font-size: inherit;
+  color: inherit;
+  word-break: normal;
+}
+
+.pre-scrollable {
+  max-height: 340px;
+  overflow-y: scroll;
+}
+
+.container {
+  width: 100%;
+  padding-right: 15px;
+  padding-left: 15px;
+  margin-right: auto;
+  margin-left: auto;
+}
+@media (min-width: 576px) {
+  .container {
+    max-width: 540px;
+  }
+}
+@media (min-width: 768px) {
+  .container {
+    max-width: 720px;
+  }
+}
+@media (min-width: 992px) {
+  .container {
+    max-width: 960px;
+  }
+}
+@media (min-width: 1200px) {
+  .container {
+    max-width: 1140px;
+  }
+}
+
+.container-fluid, .container-xl, .container-lg, .container-md, .container-sm {
+  width: 100%;
+  padding-right: 15px;
+  padding-left: 15px;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+@media (min-width: 576px) {
+  .container-sm, .container {
+    max-width: 540px;
+  }
+}
+@media (min-width: 768px) {
+  .container-md, .container-sm, .container {
+    max-width: 720px;
+  }
+}
+@media (min-width: 992px) {
+  .container-lg, .container-md, .container-sm, .container {
+    max-width: 960px;
+  }
+}
+@media (min-width: 1200px) {
+  .container-xl, .container-lg, .container-md, .container-sm, .container {
+    max-width: 1140px;
+  }
+}
+.row, .cmp-cols .field__items, .cmp-cols {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  margin-right: -15px;
+  margin-left: -15px;
+}
+
+.no-gutters {
+  margin-right: 0;
+  margin-left: 0;
+}
+.no-gutters > .col, .cmp-cols .field__items.no-gutters > *:not([class*=" col"]):not([class^=col]), .cmp-cols.no-gutters > *:not([class*=" col"]):not([class^=col]):not(.field__items),
+.no-gutters > [class*=col-] {
+  padding-right: 0;
+  padding-left: 0;
+}
+
+.col-xl,
+.col-xl-auto, .col-xl-12, .col-xl-11, .col-xl-10, .col-xl-9, .col-xl-8, .col-xl-7, .col-xl-6, .col-xl-5, .col-xl-4, .col-xl-3, .col-xl-2, .col-xl-1, .col-lg,
+.col-lg-auto, .col-lg-12, .cmp-cols.cols-lg-1 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-1 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-lg-11, .col-lg-10, .col-lg-9, .col-lg-8, .col-lg-7, .col-lg-6, .cmp-cols.cols-lg-2 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-2 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-lg-5, .col-lg-4, .cmp-cols.cols-lg-3 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-3 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-lg-3, .cmp-cols.cols-lg-4 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-4 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-lg-2, .col-lg-1, .col-md,
+.col-md-auto, .col-md-12, .cmp-cols.cols-md-1 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-1 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-md-11, .col-md-10, .col-md-9, .col-md-8, .col-md-7, .col-md-6, .cmp-cols.cols-md-2 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-2 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-md-5, .col-md-4, .cmp-cols.cols-md-3 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-3 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-md-3, .cmp-cols.cols-md-4 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-4 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-md-2, .col-md-1, .col-sm,
+.col-sm-auto, .col-sm-12, .col-sm-11, .col-sm-10, .col-sm-9, .col-sm-8, .col-sm-7, .col-sm-6, .col-sm-5, .col-sm-4, .col-sm-3, .col-sm-2, .col-sm-1, .col, .cmp-cols .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols > *:not([class*=" col"]):not([class^=col]):not(.field__items),
+.col-auto, .col-12, .cmp-cols.cols-1 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-1 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-11, .col-10, .col-9, .col-8, .col-7, .col-6, .cmp-cols.cols-2 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-2 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-5, .col-4, .cmp-cols.cols-3 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-3 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-3, .cmp-cols.cols-4 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-4 > *:not([class*=" col"]):not([class^=col]):not(.field__items), .col-2, .col-1 {
+  position: relative;
+  width: 100%;
+  padding-right: 15px;
+  padding-left: 15px;
+}
+
+.col, .cmp-cols .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+  flex-basis: 0;
+  -webkit-box-flex: 1;
+          flex-grow: 1;
+  max-width: 100%;
+}
+
+.row-cols-1 > * {
+  -webkit-box-flex: 0;
+          flex: 0 0 100%;
+  max-width: 100%;
+}
+
+.row-cols-2 > * {
+  -webkit-box-flex: 0;
+          flex: 0 0 50%;
+  max-width: 50%;
+}
+
+.row-cols-3 > * {
+  -webkit-box-flex: 0;
+          flex: 0 0 33.3333333333%;
+  max-width: 33.3333333333%;
+}
+
+.row-cols-4 > * {
+  -webkit-box-flex: 0;
+          flex: 0 0 25%;
+  max-width: 25%;
+}
+
+.row-cols-5 > * {
+  -webkit-box-flex: 0;
+          flex: 0 0 20%;
+  max-width: 20%;
+}
+
+.row-cols-6 > * {
+  -webkit-box-flex: 0;
+          flex: 0 0 16.6666666667%;
+  max-width: 16.6666666667%;
+}
+
+.col-auto {
+  -webkit-box-flex: 0;
+          flex: 0 0 auto;
+  width: auto;
+  max-width: 100%;
+}
+
+.col-1 {
+  -webkit-box-flex: 0;
+          flex: 0 0 8.3333333333%;
+  max-width: 8.3333333333%;
+}
+
+.col-2 {
+  -webkit-box-flex: 0;
+          flex: 0 0 16.6666666667%;
+  max-width: 16.6666666667%;
+}
+
+.col-3, .cmp-cols.cols-4 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-4 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+  -webkit-box-flex: 0;
+          flex: 0 0 25%;
+  max-width: 25%;
+}
+
+.col-4, .cmp-cols.cols-3 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-3 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+  -webkit-box-flex: 0;
+          flex: 0 0 33.3333333333%;
+  max-width: 33.3333333333%;
+}
+
+.col-5 {
+  -webkit-box-flex: 0;
+          flex: 0 0 41.6666666667%;
+  max-width: 41.6666666667%;
+}
+
+.col-6, .cmp-cols.cols-2 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-2 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+  -webkit-box-flex: 0;
+          flex: 0 0 50%;
+  max-width: 50%;
+}
+
+.col-7 {
+  -webkit-box-flex: 0;
+          flex: 0 0 58.3333333333%;
+  max-width: 58.3333333333%;
+}
+
+.col-8 {
+  -webkit-box-flex: 0;
+          flex: 0 0 66.6666666667%;
+  max-width: 66.6666666667%;
+}
+
+.col-9 {
+  -webkit-box-flex: 0;
+          flex: 0 0 75%;
+  max-width: 75%;
+}
+
+.col-10 {
+  -webkit-box-flex: 0;
+          flex: 0 0 83.3333333333%;
+  max-width: 83.3333333333%;
+}
+
+.col-11 {
+  -webkit-box-flex: 0;
+          flex: 0 0 91.6666666667%;
+  max-width: 91.6666666667%;
+}
+
+.col-12, .cmp-cols.cols-1 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-1 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+  -webkit-box-flex: 0;
+          flex: 0 0 100%;
+  max-width: 100%;
+}
+
+.order-first {
+  -webkit-box-ordinal-group: 0;
+          order: -1;
+}
+
+.order-last {
+  -webkit-box-ordinal-group: 14;
+          order: 13;
+}
+
+.order-0 {
+  -webkit-box-ordinal-group: 1;
+          order: 0;
+}
+
+.order-1 {
+  -webkit-box-ordinal-group: 2;
+          order: 1;
+}
+
+.order-2 {
+  -webkit-box-ordinal-group: 3;
+          order: 2;
+}
+
+.order-3 {
+  -webkit-box-ordinal-group: 4;
+          order: 3;
+}
+
+.order-4 {
+  -webkit-box-ordinal-group: 5;
+          order: 4;
+}
+
+.order-5 {
+  -webkit-box-ordinal-group: 6;
+          order: 5;
+}
+
+.order-6 {
+  -webkit-box-ordinal-group: 7;
+          order: 6;
+}
+
+.order-7 {
+  -webkit-box-ordinal-group: 8;
+          order: 7;
+}
+
+.order-8 {
+  -webkit-box-ordinal-group: 9;
+          order: 8;
+}
+
+.order-9 {
+  -webkit-box-ordinal-group: 10;
+          order: 9;
+}
+
+.order-10 {
+  -webkit-box-ordinal-group: 11;
+          order: 10;
+}
+
+.order-11 {
+  -webkit-box-ordinal-group: 12;
+          order: 11;
+}
+
+.order-12 {
+  -webkit-box-ordinal-group: 13;
+          order: 12;
+}
+
+.offset-1 {
+  margin-left: 8.3333333333%;
+}
+
+.offset-2 {
+  margin-left: 16.6666666667%;
+}
+
+.offset-3 {
+  margin-left: 25%;
+}
+
+.offset-4 {
+  margin-left: 33.3333333333%;
+}
+
+.offset-5 {
+  margin-left: 41.6666666667%;
+}
+
+.offset-6 {
+  margin-left: 50%;
+}
+
+.offset-7 {
+  margin-left: 58.3333333333%;
+}
+
+.offset-8 {
+  margin-left: 66.6666666667%;
+}
+
+.offset-9 {
+  margin-left: 75%;
+}
+
+.offset-10 {
+  margin-left: 83.3333333333%;
+}
+
+.offset-11 {
+  margin-left: 91.6666666667%;
+}
+
+@media (min-width: 576px) {
+  .col-sm {
+    flex-basis: 0;
+    -webkit-box-flex: 1;
+            flex-grow: 1;
+    max-width: 100%;
+  }
+
+  .row-cols-sm-1 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 100%;
+    max-width: 100%;
+  }
+
+  .row-cols-sm-2 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 50%;
+    max-width: 50%;
+  }
+
+  .row-cols-sm-3 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+  }
+
+  .row-cols-sm-4 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 25%;
+    max-width: 25%;
+  }
+
+  .row-cols-sm-5 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 20%;
+    max-width: 20%;
+  }
+
+  .row-cols-sm-6 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 16.6666666667%;
+    max-width: 16.6666666667%;
+  }
+
+  .col-sm-auto {
+    -webkit-box-flex: 0;
+            flex: 0 0 auto;
+    width: auto;
+    max-width: 100%;
+  }
+
+  .col-sm-1 {
+    -webkit-box-flex: 0;
+            flex: 0 0 8.3333333333%;
+    max-width: 8.3333333333%;
+  }
+
+  .col-sm-2 {
+    -webkit-box-flex: 0;
+            flex: 0 0 16.6666666667%;
+    max-width: 16.6666666667%;
+  }
+
+  .col-sm-3 {
+    -webkit-box-flex: 0;
+            flex: 0 0 25%;
+    max-width: 25%;
+  }
+
+  .col-sm-4 {
+    -webkit-box-flex: 0;
+            flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+  }
+
+  .col-sm-5 {
+    -webkit-box-flex: 0;
+            flex: 0 0 41.6666666667%;
+    max-width: 41.6666666667%;
+  }
+
+  .col-sm-6 {
+    -webkit-box-flex: 0;
+            flex: 0 0 50%;
+    max-width: 50%;
+  }
+
+  .col-sm-7 {
+    -webkit-box-flex: 0;
+            flex: 0 0 58.3333333333%;
+    max-width: 58.3333333333%;
+  }
+
+  .col-sm-8 {
+    -webkit-box-flex: 0;
+            flex: 0 0 66.6666666667%;
+    max-width: 66.6666666667%;
+  }
+
+  .col-sm-9 {
+    -webkit-box-flex: 0;
+            flex: 0 0 75%;
+    max-width: 75%;
+  }
+
+  .col-sm-10 {
+    -webkit-box-flex: 0;
+            flex: 0 0 83.3333333333%;
+    max-width: 83.3333333333%;
+  }
+
+  .col-sm-11 {
+    -webkit-box-flex: 0;
+            flex: 0 0 91.6666666667%;
+    max-width: 91.6666666667%;
+  }
+
+  .col-sm-12 {
+    -webkit-box-flex: 0;
+            flex: 0 0 100%;
+    max-width: 100%;
+  }
+
+  .order-sm-first {
+    -webkit-box-ordinal-group: 0;
+            order: -1;
+  }
+
+  .order-sm-last {
+    -webkit-box-ordinal-group: 14;
+            order: 13;
+  }
+
+  .order-sm-0 {
+    -webkit-box-ordinal-group: 1;
+            order: 0;
+  }
+
+  .order-sm-1 {
+    -webkit-box-ordinal-group: 2;
+            order: 1;
+  }
+
+  .order-sm-2 {
+    -webkit-box-ordinal-group: 3;
+            order: 2;
+  }
+
+  .order-sm-3 {
+    -webkit-box-ordinal-group: 4;
+            order: 3;
+  }
+
+  .order-sm-4 {
+    -webkit-box-ordinal-group: 5;
+            order: 4;
+  }
+
+  .order-sm-5 {
+    -webkit-box-ordinal-group: 6;
+            order: 5;
+  }
+
+  .order-sm-6 {
+    -webkit-box-ordinal-group: 7;
+            order: 6;
+  }
+
+  .order-sm-7 {
+    -webkit-box-ordinal-group: 8;
+            order: 7;
+  }
+
+  .order-sm-8 {
+    -webkit-box-ordinal-group: 9;
+            order: 8;
+  }
+
+  .order-sm-9 {
+    -webkit-box-ordinal-group: 10;
+            order: 9;
+  }
+
+  .order-sm-10 {
+    -webkit-box-ordinal-group: 11;
+            order: 10;
+  }
+
+  .order-sm-11 {
+    -webkit-box-ordinal-group: 12;
+            order: 11;
+  }
+
+  .order-sm-12 {
+    -webkit-box-ordinal-group: 13;
+            order: 12;
+  }
+
+  .offset-sm-0 {
+    margin-left: 0;
+  }
+
+  .offset-sm-1 {
+    margin-left: 8.3333333333%;
+  }
+
+  .offset-sm-2 {
+    margin-left: 16.6666666667%;
+  }
+
+  .offset-sm-3 {
+    margin-left: 25%;
+  }
+
+  .offset-sm-4 {
+    margin-left: 33.3333333333%;
+  }
+
+  .offset-sm-5 {
+    margin-left: 41.6666666667%;
+  }
+
+  .offset-sm-6 {
+    margin-left: 50%;
+  }
+
+  .offset-sm-7 {
+    margin-left: 58.3333333333%;
+  }
+
+  .offset-sm-8 {
+    margin-left: 66.6666666667%;
+  }
+
+  .offset-sm-9 {
+    margin-left: 75%;
+  }
+
+  .offset-sm-10 {
+    margin-left: 83.3333333333%;
+  }
+
+  .offset-sm-11 {
+    margin-left: 91.6666666667%;
+  }
+}
+@media (min-width: 768px) {
+  .col-md {
+    flex-basis: 0;
+    -webkit-box-flex: 1;
+            flex-grow: 1;
+    max-width: 100%;
+  }
+
+  .row-cols-md-1 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 100%;
+    max-width: 100%;
+  }
+
+  .row-cols-md-2 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 50%;
+    max-width: 50%;
+  }
+
+  .row-cols-md-3 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+  }
+
+  .row-cols-md-4 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 25%;
+    max-width: 25%;
+  }
+
+  .row-cols-md-5 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 20%;
+    max-width: 20%;
+  }
+
+  .row-cols-md-6 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 16.6666666667%;
+    max-width: 16.6666666667%;
+  }
+
+  .col-md-auto {
+    -webkit-box-flex: 0;
+            flex: 0 0 auto;
+    width: auto;
+    max-width: 100%;
+  }
+
+  .col-md-1 {
+    -webkit-box-flex: 0;
+            flex: 0 0 8.3333333333%;
+    max-width: 8.3333333333%;
+  }
+
+  .col-md-2 {
+    -webkit-box-flex: 0;
+            flex: 0 0 16.6666666667%;
+    max-width: 16.6666666667%;
+  }
+
+  .col-md-3, .cmp-cols.cols-md-4 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-4 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+            flex: 0 0 25%;
+    max-width: 25%;
+  }
+
+  .col-md-4, .cmp-cols.cols-md-3 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-3 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+            flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+  }
+
+  .col-md-5 {
+    -webkit-box-flex: 0;
+            flex: 0 0 41.6666666667%;
+    max-width: 41.6666666667%;
+  }
+
+  .col-md-6, .cmp-cols.cols-md-2 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-2 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+            flex: 0 0 50%;
+    max-width: 50%;
+  }
+
+  .col-md-7 {
+    -webkit-box-flex: 0;
+            flex: 0 0 58.3333333333%;
+    max-width: 58.3333333333%;
+  }
+
+  .col-md-8 {
+    -webkit-box-flex: 0;
+            flex: 0 0 66.6666666667%;
+    max-width: 66.6666666667%;
+  }
+
+  .col-md-9 {
+    -webkit-box-flex: 0;
+            flex: 0 0 75%;
+    max-width: 75%;
+  }
+
+  .col-md-10 {
+    -webkit-box-flex: 0;
+            flex: 0 0 83.3333333333%;
+    max-width: 83.3333333333%;
+  }
+
+  .col-md-11 {
+    -webkit-box-flex: 0;
+            flex: 0 0 91.6666666667%;
+    max-width: 91.6666666667%;
+  }
+
+  .col-md-12, .cmp-cols.cols-md-1 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-1 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+            flex: 0 0 100%;
+    max-width: 100%;
+  }
+
+  .order-md-first {
+    -webkit-box-ordinal-group: 0;
+            order: -1;
+  }
+
+  .order-md-last {
+    -webkit-box-ordinal-group: 14;
+            order: 13;
+  }
+
+  .order-md-0 {
+    -webkit-box-ordinal-group: 1;
+            order: 0;
+  }
+
+  .order-md-1 {
+    -webkit-box-ordinal-group: 2;
+            order: 1;
+  }
+
+  .order-md-2 {
+    -webkit-box-ordinal-group: 3;
+            order: 2;
+  }
+
+  .order-md-3 {
+    -webkit-box-ordinal-group: 4;
+            order: 3;
+  }
+
+  .order-md-4 {
+    -webkit-box-ordinal-group: 5;
+            order: 4;
+  }
+
+  .order-md-5 {
+    -webkit-box-ordinal-group: 6;
+            order: 5;
+  }
+
+  .order-md-6 {
+    -webkit-box-ordinal-group: 7;
+            order: 6;
+  }
+
+  .order-md-7 {
+    -webkit-box-ordinal-group: 8;
+            order: 7;
+  }
+
+  .order-md-8 {
+    -webkit-box-ordinal-group: 9;
+            order: 8;
+  }
+
+  .order-md-9 {
+    -webkit-box-ordinal-group: 10;
+            order: 9;
+  }
+
+  .order-md-10 {
+    -webkit-box-ordinal-group: 11;
+            order: 10;
+  }
+
+  .order-md-11 {
+    -webkit-box-ordinal-group: 12;
+            order: 11;
+  }
+
+  .order-md-12 {
+    -webkit-box-ordinal-group: 13;
+            order: 12;
+  }
+
+  .offset-md-0 {
+    margin-left: 0;
+  }
+
+  .offset-md-1 {
+    margin-left: 8.3333333333%;
+  }
+
+  .offset-md-2 {
+    margin-left: 16.6666666667%;
+  }
+
+  .offset-md-3 {
+    margin-left: 25%;
+  }
+
+  .offset-md-4 {
+    margin-left: 33.3333333333%;
+  }
+
+  .offset-md-5 {
+    margin-left: 41.6666666667%;
+  }
+
+  .offset-md-6 {
+    margin-left: 50%;
+  }
+
+  .offset-md-7 {
+    margin-left: 58.3333333333%;
+  }
+
+  .offset-md-8 {
+    margin-left: 66.6666666667%;
+  }
+
+  .offset-md-9 {
+    margin-left: 75%;
+  }
+
+  .offset-md-10 {
+    margin-left: 83.3333333333%;
+  }
+
+  .offset-md-11 {
+    margin-left: 91.6666666667%;
+  }
+}
+@media (min-width: 992px) {
+  .col-lg {
+    flex-basis: 0;
+    -webkit-box-flex: 1;
+            flex-grow: 1;
+    max-width: 100%;
+  }
+
+  .row-cols-lg-1 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 100%;
+    max-width: 100%;
+  }
+
+  .row-cols-lg-2 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 50%;
+    max-width: 50%;
+  }
+
+  .row-cols-lg-3 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+  }
+
+  .row-cols-lg-4 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 25%;
+    max-width: 25%;
+  }
+
+  .row-cols-lg-5 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 20%;
+    max-width: 20%;
+  }
+
+  .row-cols-lg-6 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 16.6666666667%;
+    max-width: 16.6666666667%;
+  }
+
+  .col-lg-auto {
+    -webkit-box-flex: 0;
+            flex: 0 0 auto;
+    width: auto;
+    max-width: 100%;
+  }
+
+  .col-lg-1 {
+    -webkit-box-flex: 0;
+            flex: 0 0 8.3333333333%;
+    max-width: 8.3333333333%;
+  }
+
+  .col-lg-2 {
+    -webkit-box-flex: 0;
+            flex: 0 0 16.6666666667%;
+    max-width: 16.6666666667%;
+  }
+
+  .col-lg-3, .cmp-cols.cols-lg-4 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-4 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+            flex: 0 0 25%;
+    max-width: 25%;
+  }
+
+  .col-lg-4, .cmp-cols.cols-lg-3 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-3 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+            flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+  }
+
+  .col-lg-5 {
+    -webkit-box-flex: 0;
+            flex: 0 0 41.6666666667%;
+    max-width: 41.6666666667%;
+  }
+
+  .col-lg-6, .cmp-cols.cols-lg-2 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-2 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+            flex: 0 0 50%;
+    max-width: 50%;
+  }
+
+  .col-lg-7 {
+    -webkit-box-flex: 0;
+            flex: 0 0 58.3333333333%;
+    max-width: 58.3333333333%;
+  }
+
+  .col-lg-8 {
+    -webkit-box-flex: 0;
+            flex: 0 0 66.6666666667%;
+    max-width: 66.6666666667%;
+  }
+
+  .col-lg-9 {
+    -webkit-box-flex: 0;
+            flex: 0 0 75%;
+    max-width: 75%;
+  }
+
+  .col-lg-10 {
+    -webkit-box-flex: 0;
+            flex: 0 0 83.3333333333%;
+    max-width: 83.3333333333%;
+  }
+
+  .col-lg-11 {
+    -webkit-box-flex: 0;
+            flex: 0 0 91.6666666667%;
+    max-width: 91.6666666667%;
+  }
+
+  .col-lg-12, .cmp-cols.cols-lg-1 .field__items > *:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-1 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+            flex: 0 0 100%;
+    max-width: 100%;
+  }
+
+  .order-lg-first {
+    -webkit-box-ordinal-group: 0;
+            order: -1;
+  }
+
+  .order-lg-last {
+    -webkit-box-ordinal-group: 14;
+            order: 13;
+  }
+
+  .order-lg-0 {
+    -webkit-box-ordinal-group: 1;
+            order: 0;
+  }
+
+  .order-lg-1 {
+    -webkit-box-ordinal-group: 2;
+            order: 1;
+  }
+
+  .order-lg-2 {
+    -webkit-box-ordinal-group: 3;
+            order: 2;
+  }
+
+  .order-lg-3 {
+    -webkit-box-ordinal-group: 4;
+            order: 3;
+  }
+
+  .order-lg-4 {
+    -webkit-box-ordinal-group: 5;
+            order: 4;
+  }
+
+  .order-lg-5 {
+    -webkit-box-ordinal-group: 6;
+            order: 5;
+  }
+
+  .order-lg-6 {
+    -webkit-box-ordinal-group: 7;
+            order: 6;
+  }
+
+  .order-lg-7 {
+    -webkit-box-ordinal-group: 8;
+            order: 7;
+  }
+
+  .order-lg-8 {
+    -webkit-box-ordinal-group: 9;
+            order: 8;
+  }
+
+  .order-lg-9 {
+    -webkit-box-ordinal-group: 10;
+            order: 9;
+  }
+
+  .order-lg-10 {
+    -webkit-box-ordinal-group: 11;
+            order: 10;
+  }
+
+  .order-lg-11 {
+    -webkit-box-ordinal-group: 12;
+            order: 11;
+  }
+
+  .order-lg-12 {
+    -webkit-box-ordinal-group: 13;
+            order: 12;
+  }
+
+  .offset-lg-0 {
+    margin-left: 0;
+  }
+
+  .offset-lg-1 {
+    margin-left: 8.3333333333%;
+  }
+
+  .offset-lg-2 {
+    margin-left: 16.6666666667%;
+  }
+
+  .offset-lg-3 {
+    margin-left: 25%;
+  }
+
+  .offset-lg-4 {
+    margin-left: 33.3333333333%;
+  }
+
+  .offset-lg-5 {
+    margin-left: 41.6666666667%;
+  }
+
+  .offset-lg-6 {
+    margin-left: 50%;
+  }
+
+  .offset-lg-7 {
+    margin-left: 58.3333333333%;
+  }
+
+  .offset-lg-8 {
+    margin-left: 66.6666666667%;
+  }
+
+  .offset-lg-9 {
+    margin-left: 75%;
+  }
+
+  .offset-lg-10 {
+    margin-left: 83.3333333333%;
+  }
+
+  .offset-lg-11 {
+    margin-left: 91.6666666667%;
+  }
+}
+@media (min-width: 1200px) {
+  .col-xl {
+    flex-basis: 0;
+    -webkit-box-flex: 1;
+            flex-grow: 1;
+    max-width: 100%;
+  }
+
+  .row-cols-xl-1 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 100%;
+    max-width: 100%;
+  }
+
+  .row-cols-xl-2 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 50%;
+    max-width: 50%;
+  }
+
+  .row-cols-xl-3 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+  }
+
+  .row-cols-xl-4 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 25%;
+    max-width: 25%;
+  }
+
+  .row-cols-xl-5 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 20%;
+    max-width: 20%;
+  }
+
+  .row-cols-xl-6 > * {
+    -webkit-box-flex: 0;
+            flex: 0 0 16.6666666667%;
+    max-width: 16.6666666667%;
+  }
+
+  .col-xl-auto {
+    -webkit-box-flex: 0;
+            flex: 0 0 auto;
+    width: auto;
+    max-width: 100%;
+  }
+
+  .col-xl-1 {
+    -webkit-box-flex: 0;
+            flex: 0 0 8.3333333333%;
+    max-width: 8.3333333333%;
+  }
+
+  .col-xl-2 {
+    -webkit-box-flex: 0;
+            flex: 0 0 16.6666666667%;
+    max-width: 16.6666666667%;
+  }
+
+  .col-xl-3 {
+    -webkit-box-flex: 0;
+            flex: 0 0 25%;
+    max-width: 25%;
+  }
+
+  .col-xl-4 {
+    -webkit-box-flex: 0;
+            flex: 0 0 33.3333333333%;
+    max-width: 33.3333333333%;
+  }
+
+  .col-xl-5 {
+    -webkit-box-flex: 0;
+            flex: 0 0 41.6666666667%;
+    max-width: 41.6666666667%;
+  }
+
+  .col-xl-6 {
+    -webkit-box-flex: 0;
+            flex: 0 0 50%;
+    max-width: 50%;
+  }
+
+  .col-xl-7 {
+    -webkit-box-flex: 0;
+            flex: 0 0 58.3333333333%;
+    max-width: 58.3333333333%;
+  }
+
+  .col-xl-8 {
+    -webkit-box-flex: 0;
+            flex: 0 0 66.6666666667%;
+    max-width: 66.6666666667%;
+  }
+
+  .col-xl-9 {
+    -webkit-box-flex: 0;
+            flex: 0 0 75%;
+    max-width: 75%;
+  }
+
+  .col-xl-10 {
+    -webkit-box-flex: 0;
+            flex: 0 0 83.3333333333%;
+    max-width: 83.3333333333%;
+  }
+
+  .col-xl-11 {
+    -webkit-box-flex: 0;
+            flex: 0 0 91.6666666667%;
+    max-width: 91.6666666667%;
+  }
+
+  .col-xl-12 {
+    -webkit-box-flex: 0;
+            flex: 0 0 100%;
+    max-width: 100%;
+  }
+
+  .order-xl-first {
+    -webkit-box-ordinal-group: 0;
+            order: -1;
+  }
+
+  .order-xl-last {
+    -webkit-box-ordinal-group: 14;
+            order: 13;
+  }
+
+  .order-xl-0 {
+    -webkit-box-ordinal-group: 1;
+            order: 0;
+  }
+
+  .order-xl-1 {
+    -webkit-box-ordinal-group: 2;
+            order: 1;
+  }
+
+  .order-xl-2 {
+    -webkit-box-ordinal-group: 3;
+            order: 2;
+  }
+
+  .order-xl-3 {
+    -webkit-box-ordinal-group: 4;
+            order: 3;
+  }
+
+  .order-xl-4 {
+    -webkit-box-ordinal-group: 5;
+            order: 4;
+  }
+
+  .order-xl-5 {
+    -webkit-box-ordinal-group: 6;
+            order: 5;
+  }
+
+  .order-xl-6 {
+    -webkit-box-ordinal-group: 7;
+            order: 6;
+  }
+
+  .order-xl-7 {
+    -webkit-box-ordinal-group: 8;
+            order: 7;
+  }
+
+  .order-xl-8 {
+    -webkit-box-ordinal-group: 9;
+            order: 8;
+  }
+
+  .order-xl-9 {
+    -webkit-box-ordinal-group: 10;
+            order: 9;
+  }
+
+  .order-xl-10 {
+    -webkit-box-ordinal-group: 11;
+            order: 10;
+  }
+
+  .order-xl-11 {
+    -webkit-box-ordinal-group: 12;
+            order: 11;
+  }
+
+  .order-xl-12 {
+    -webkit-box-ordinal-group: 13;
+            order: 12;
+  }
+
+  .offset-xl-0 {
+    margin-left: 0;
+  }
+
+  .offset-xl-1 {
+    margin-left: 8.3333333333%;
+  }
+
+  .offset-xl-2 {
+    margin-left: 16.6666666667%;
+  }
+
+  .offset-xl-3 {
+    margin-left: 25%;
+  }
+
+  .offset-xl-4 {
+    margin-left: 33.3333333333%;
+  }
+
+  .offset-xl-5 {
+    margin-left: 41.6666666667%;
+  }
+
+  .offset-xl-6 {
+    margin-left: 50%;
+  }
+
+  .offset-xl-7 {
+    margin-left: 58.3333333333%;
+  }
+
+  .offset-xl-8 {
+    margin-left: 66.6666666667%;
+  }
+
+  .offset-xl-9 {
+    margin-left: 75%;
+  }
+
+  .offset-xl-10 {
+    margin-left: 83.3333333333%;
+  }
+
+  .offset-xl-11 {
+    margin-left: 91.6666666667%;
+  }
+}
+.table {
+  width: 100%;
+  margin-bottom: 1rem;
+  color: #212529;
+}
+.table th,
+.table td {
+  padding: 0.75rem;
+  vertical-align: top;
+  border-top: 1px solid #dee2e6;
+}
+.table thead th {
+  vertical-align: bottom;
+  border-bottom: 2px solid #dee2e6;
+}
+.table tbody + tbody {
+  border-top: 2px solid #dee2e6;
+}
+
+.table-sm th,
+.table-sm td {
+  padding: 0.3rem;
+}
+
+.table-bordered {
+  border: 1px solid #dee2e6;
+}
+.table-bordered th,
+.table-bordered td {
+  border: 1px solid #dee2e6;
+}
+.table-bordered thead th,
+.table-bordered thead td {
+  border-bottom-width: 2px;
+}
+
+.table-borderless th,
+.table-borderless td,
+.table-borderless thead th,
+.table-borderless tbody + tbody {
+  border: 0;
+}
+
+.table-striped tbody tr:nth-of-type(odd) {
+  background-color: rgba(0, 0, 0, 0.05);
+}
+
+.table-hover tbody tr:hover {
+  color: #212529;
+  background-color: rgba(0, 0, 0, 0.075);
+}
+
+.table-primary,
+.table-primary > th,
+.table-primary > td {
+  background-color: #bfc9d6;
+}
+.table-primary th,
+.table-primary td,
+.table-primary thead th,
+.table-primary tbody + tbody {
+  border-color: #889ab4;
+}
+
+.table-hover .table-primary:hover {
+  background-color: #afbccc;
+}
+.table-hover .table-primary:hover > td,
+.table-hover .table-primary:hover > th {
+  background-color: #afbccc;
+}
+
+.table-secondary,
+.table-secondary > th,
+.table-secondary > td {
+  background-color: #fbd5c2;
+}
+.table-secondary th,
+.table-secondary td,
+.table-secondary thead th,
+.table-secondary tbody + tbody {
+  border-color: #f8b08d;
+}
+
+.table-hover .table-secondary:hover {
+  background-color: #f9c5aa;
+}
+.table-hover .table-secondary:hover > td,
+.table-hover .table-secondary:hover > th {
+  background-color: #f9c5aa;
+}
+
+.table-success,
+.table-success > th,
+.table-success > td {
+  background-color: #c3e6cb;
+}
+.table-success th,
+.table-success td,
+.table-success thead th,
+.table-success tbody + tbody {
+  border-color: #8fd19e;
+}
+
+.table-hover .table-success:hover {
+  background-color: #b1dfbb;
+}
+.table-hover .table-success:hover > td,
+.table-hover .table-success:hover > th {
+  background-color: #b1dfbb;
+}
+
+.table-info,
+.table-info > th,
+.table-info > td {
+  background-color: #bee5eb;
+}
+.table-info th,
+.table-info td,
+.table-info thead th,
+.table-info tbody + tbody {
+  border-color: #86cfda;
+}
+
+.table-hover .table-info:hover {
+  background-color: #abdde5;
+}
+.table-hover .table-info:hover > td,
+.table-hover .table-info:hover > th {
+  background-color: #abdde5;
+}
+
+.table-warning,
+.table-warning > th,
+.table-warning > td {
+  background-color: #ffeeba;
+}
+.table-warning th,
+.table-warning td,
+.table-warning thead th,
+.table-warning tbody + tbody {
+  border-color: #ffdf7e;
+}
+
+.table-hover .table-warning:hover {
+  background-color: #ffe8a1;
+}
+.table-hover .table-warning:hover > td,
+.table-hover .table-warning:hover > th {
+  background-color: #ffe8a1;
+}
+
+.table-danger,
+.table-danger > th,
+.table-danger > td {
+  background-color: #f5c6cb;
+}
+.table-danger th,
+.table-danger td,
+.table-danger thead th,
+.table-danger tbody + tbody {
+  border-color: #ed969e;
+}
+
+.table-hover .table-danger:hover {
+  background-color: #f1b0b7;
+}
+.table-hover .table-danger:hover > td,
+.table-hover .table-danger:hover > th {
+  background-color: #f1b0b7;
+}
+
+.table-light,
+.table-light > th,
+.table-light > td {
+  background-color: #fdfdfe;
+}
+.table-light th,
+.table-light td,
+.table-light thead th,
+.table-light tbody + tbody {
+  border-color: #fbfcfc;
+}
+
+.table-hover .table-light:hover {
+  background-color: #ececf6;
+}
+.table-hover .table-light:hover > td,
+.table-hover .table-light:hover > th {
+  background-color: #ececf6;
+}
+
+.table-dark,
+.table-dark > th,
+.table-dark > td {
+  background-color: #c6c8ca;
+}
+.table-dark th,
+.table-dark td,
+.table-dark thead th,
+.table-dark tbody + tbody {
+  border-color: #95999c;
+}
+
+.table-hover .table-dark:hover {
+  background-color: #b9bbbe;
+}
+.table-hover .table-dark:hover > td,
+.table-hover .table-dark:hover > th {
+  background-color: #b9bbbe;
+}
+
+.table-active,
+.table-active > th,
+.table-active > td {
+  background-color: rgba(0, 0, 0, 0.075);
+}
+
+.table-hover .table-active:hover {
+  background-color: rgba(0, 0, 0, 0.075);
+}
+.table-hover .table-active:hover > td,
+.table-hover .table-active:hover > th {
+  background-color: rgba(0, 0, 0, 0.075);
+}
+
+.table .thead-dark th {
+  color: #fff;
+  background-color: #343a40;
+  border-color: #454d55;
+}
+.table .thead-light th {
+  color: #495057;
+  background-color: #e9ecef;
+  border-color: #dee2e6;
+}
+
+.table-dark {
+  color: #fff;
+  background-color: #343a40;
+}
+.table-dark th,
+.table-dark td,
+.table-dark thead th {
+  border-color: #454d55;
+}
+.table-dark.table-bordered {
+  border: 0;
+}
+.table-dark.table-striped tbody tr:nth-of-type(odd) {
+  background-color: rgba(255, 255, 255, 0.05);
+}
+.table-dark.table-hover tbody tr:hover {
+  color: #fff;
+  background-color: rgba(255, 255, 255, 0.075);
+}
+
+@media (max-width: 575.98px) {
+  .table-responsive-sm {
+    display: block;
+    width: 100%;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+  .table-responsive-sm > .table-bordered {
+    border: 0;
+  }
+}
+@media (max-width: 767.98px) {
+  .table-responsive-md {
+    display: block;
+    width: 100%;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+  .table-responsive-md > .table-bordered {
+    border: 0;
+  }
+}
+@media (max-width: 991.98px) {
+  .table-responsive-lg {
+    display: block;
+    width: 100%;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+  .table-responsive-lg > .table-bordered {
+    border: 0;
+  }
+}
+@media (max-width: 1199.98px) {
+  .table-responsive-xl {
+    display: block;
+    width: 100%;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+  .table-responsive-xl > .table-bordered {
+    border: 0;
+  }
+}
+.table-responsive {
+  display: block;
+  width: 100%;
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch;
+}
+.table-responsive > .table-bordered {
+  border: 0;
+}
+
+.form-control {
+  display: block;
+  width: 100%;
+  height: calc(1.5em + 0.75rem + 2px);
+  padding: 0.375rem 0.75rem;
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #495057;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid #ced4da;
+  border-radius: 0;
+  -webkit-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-control {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.form-control::-ms-expand {
+  background-color: transparent;
+  border: 0;
+}
+.form-control:-moz-focusring {
+  color: transparent;
+  text-shadow: 0 0 0 #495057;
+}
+.form-control:focus {
+  color: #495057;
+  background-color: #fff;
+  border-color: #3a77cf;
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+.form-control::-webkit-input-placeholder {
+  color: #6c757d;
+  opacity: 1;
+}
+.form-control::-moz-placeholder {
+  color: #6c757d;
+  opacity: 1;
+}
+.form-control:-ms-input-placeholder {
+  color: #6c757d;
+  opacity: 1;
+}
+.form-control::-ms-input-placeholder {
+  color: #6c757d;
+  opacity: 1;
+}
+.form-control::placeholder {
+  color: #6c757d;
+  opacity: 1;
+}
+.form-control:disabled, .form-control[readonly] {
+  background-color: #e9ecef;
+  opacity: 1;
+}
+
+select.form-control:focus::-ms-value {
+  color: #495057;
+  background-color: #fff;
+}
+
+.form-control-file,
+.form-control-range {
+  display: block;
+  width: 100%;
+}
+
+.col-form-label {
+  padding-top: calc(0.375rem + 1px);
+  padding-bottom: calc(0.375rem + 1px);
+  margin-bottom: 0;
+  font-size: inherit;
+  line-height: 1.5;
+}
+
+.col-form-label-lg {
+  padding-top: calc(0.5rem + 1px);
+  padding-bottom: calc(0.5rem + 1px);
+  font-size: 1.25rem;
+  line-height: 1.5;
+}
+
+.col-form-label-sm {
+  padding-top: calc(0.25rem + 1px);
+  padding-bottom: calc(0.25rem + 1px);
+  font-size: 0.875rem;
+  line-height: 1.5;
+}
+
+.form-control-plaintext {
+  display: block;
+  width: 100%;
+  padding: 0.375rem 0;
+  margin-bottom: 0;
+  font-size: 1rem;
+  line-height: 1.5;
+  color: #212529;
+  background-color: transparent;
+  border: solid transparent;
+  border-width: 1px 0;
+}
+.form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg {
+  padding-right: 0;
+  padding-left: 0;
+}
+
+.form-control-sm {
+  height: calc(1.5em + 0.5rem + 2px);
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+}
+
+.form-control-lg {
+  height: calc(1.5em + 1rem + 2px);
+  padding: 0.5rem 1rem;
+  font-size: 1.25rem;
+  line-height: 1.5;
+}
+
+select.form-control[size], select.form-control[multiple] {
+  height: auto;
+}
+
+textarea.form-control {
+  height: auto;
+}
+
+.form-group {
+  margin-bottom: 1rem;
+}
+
+.form-text {
+  display: block;
+  margin-top: 0.25rem;
+}
+
+.form-row {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  margin-right: -5px;
+  margin-left: -5px;
+}
+.form-row > .col, .cmp-cols .field__items.form-row > *:not([class*=" col"]):not([class^=col]), .cmp-cols.form-row > *:not([class*=" col"]):not([class^=col]):not(.field__items),
+.form-row > [class*=col-] {
+  padding-right: 5px;
+  padding-left: 5px;
+}
+
+.form-check {
+  position: relative;
+  display: block;
+  padding-left: 1.25rem;
+}
+
+.form-check-input {
+  position: absolute;
+  margin-top: 0.3rem;
+  margin-left: -1.25rem;
+}
+.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label {
+  color: #6c757d;
+}
+
+.form-check-label {
+  margin-bottom: 0;
+}
+
+.form-check-inline {
+  display: -webkit-inline-box;
+  display: inline-flex;
+  -webkit-box-align: center;
+          align-items: center;
+  padding-left: 0;
+  margin-right: 0.75rem;
+}
+.form-check-inline .form-check-input {
+  position: static;
+  margin-top: 0;
+  margin-right: 0.3125rem;
+  margin-left: 0;
+}
+
+.valid-feedback {
+  display: none;
+  width: 100%;
+  margin-top: 0.25rem;
+  font-size: 80%;
+  color: #28a745;
+}
+
+.valid-tooltip {
+  position: absolute;
+  top: 100%;
+  z-index: 5;
+  display: none;
+  max-width: 100%;
+  padding: 0.25rem 0.5rem;
+  margin-top: 0.1rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  color: #fff;
+  background-color: rgba(40, 167, 69, 0.9);
+}
+
+.was-validated :valid ~ .valid-feedback,
+.was-validated :valid ~ .valid-tooltip,
+.is-valid ~ .valid-feedback,
+.is-valid ~ .valid-tooltip {
+  display: block;
+}
+
+.was-validated .form-control:valid, .form-control.is-valid {
+  border-color: #28a745;
+  padding-right: calc(1.5em + 0.75rem);
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-position: right calc(0.375em + 0.1875rem) center;
+  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+}
+.was-validated .form-control:valid:focus, .form-control.is-valid:focus {
+  border-color: #28a745;
+  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
+}
+
+.was-validated textarea.form-control:valid, textarea.form-control.is-valid {
+  padding-right: calc(1.5em + 0.75rem);
+  background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
+}
+
+.was-validated .custom-select:valid, .custom-select.is-valid {
+  border-color: #28a745;
+  padding-right: calc(0.75em + 2.3125rem);
+  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") #fff no-repeat center right 1.75rem/calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+}
+.was-validated .custom-select:valid:focus, .custom-select.is-valid:focus {
+  border-color: #28a745;
+  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
+}
+
+.was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label {
+  color: #28a745;
+}
+.was-validated .form-check-input:valid ~ .valid-feedback,
+.was-validated .form-check-input:valid ~ .valid-tooltip, .form-check-input.is-valid ~ .valid-feedback,
+.form-check-input.is-valid ~ .valid-tooltip {
+  display: block;
+}
+
+.was-validated .custom-control-input:valid ~ .custom-control-label, .custom-control-input.is-valid ~ .custom-control-label {
+  color: #28a745;
+}
+.was-validated .custom-control-input:valid ~ .custom-control-label::before, .custom-control-input.is-valid ~ .custom-control-label::before {
+  border-color: #28a745;
+}
+.was-validated .custom-control-input:valid:checked ~ .custom-control-label::before, .custom-control-input.is-valid:checked ~ .custom-control-label::before {
+  border-color: #34ce57;
+  background-color: #34ce57;
+}
+.was-validated .custom-control-input:valid:focus ~ .custom-control-label::before, .custom-control-input.is-valid:focus ~ .custom-control-label::before {
+  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
+}
+.was-validated .custom-control-input:valid:focus:not(:checked) ~ .custom-control-label::before, .custom-control-input.is-valid:focus:not(:checked) ~ .custom-control-label::before {
+  border-color: #28a745;
+}
+
+.was-validated .custom-file-input:valid ~ .custom-file-label, .custom-file-input.is-valid ~ .custom-file-label {
+  border-color: #28a745;
+}
+.was-validated .custom-file-input:valid:focus ~ .custom-file-label, .custom-file-input.is-valid:focus ~ .custom-file-label {
+  border-color: #28a745;
+  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
+}
+
+.invalid-feedback {
+  display: none;
+  width: 100%;
+  margin-top: 0.25rem;
+  font-size: 80%;
+  color: #dc3545;
+}
+
+.invalid-tooltip {
+  position: absolute;
+  top: 100%;
+  z-index: 5;
+  display: none;
+  max-width: 100%;
+  padding: 0.25rem 0.5rem;
+  margin-top: 0.1rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  color: #fff;
+  background-color: rgba(220, 53, 69, 0.9);
+}
+
+.was-validated :invalid ~ .invalid-feedback,
+.was-validated :invalid ~ .invalid-tooltip,
+.is-invalid ~ .invalid-feedback,
+.is-invalid ~ .invalid-tooltip {
+  display: block;
+}
+
+.was-validated .form-control:invalid, .form-control.is-invalid {
+  border-color: #dc3545;
+  padding-right: calc(1.5em + 0.75rem);
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-position: right calc(0.375em + 0.1875rem) center;
+  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+}
+.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {
+  border-color: #dc3545;
+  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
+}
+
+.was-validated textarea.form-control:invalid, textarea.form-control.is-invalid {
+  padding-right: calc(1.5em + 0.75rem);
+  background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
+}
+
+.was-validated .custom-select:invalid, .custom-select.is-invalid {
+  border-color: #dc3545;
+  padding-right: calc(0.75em + 2.3125rem);
+  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") #fff no-repeat center right 1.75rem/calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+}
+.was-validated .custom-select:invalid:focus, .custom-select.is-invalid:focus {
+  border-color: #dc3545;
+  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
+}
+
+.was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label {
+  color: #dc3545;
+}
+.was-validated .form-check-input:invalid ~ .invalid-feedback,
+.was-validated .form-check-input:invalid ~ .invalid-tooltip, .form-check-input.is-invalid ~ .invalid-feedback,
+.form-check-input.is-invalid ~ .invalid-tooltip {
+  display: block;
+}
+
+.was-validated .custom-control-input:invalid ~ .custom-control-label, .custom-control-input.is-invalid ~ .custom-control-label {
+  color: #dc3545;
+}
+.was-validated .custom-control-input:invalid ~ .custom-control-label::before, .custom-control-input.is-invalid ~ .custom-control-label::before {
+  border-color: #dc3545;
+}
+.was-validated .custom-control-input:invalid:checked ~ .custom-control-label::before, .custom-control-input.is-invalid:checked ~ .custom-control-label::before {
+  border-color: #e4606d;
+  background-color: #e4606d;
+}
+.was-validated .custom-control-input:invalid:focus ~ .custom-control-label::before, .custom-control-input.is-invalid:focus ~ .custom-control-label::before {
+  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
+}
+.was-validated .custom-control-input:invalid:focus:not(:checked) ~ .custom-control-label::before, .custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before {
+  border-color: #dc3545;
+}
+
+.was-validated .custom-file-input:invalid ~ .custom-file-label, .custom-file-input.is-invalid ~ .custom-file-label {
+  border-color: #dc3545;
+}
+.was-validated .custom-file-input:invalid:focus ~ .custom-file-label, .custom-file-input.is-invalid:focus ~ .custom-file-label {
+  border-color: #dc3545;
+  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
+}
+
+.form-inline {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+          flex-flow: row wrap;
+  -webkit-box-align: center;
+          align-items: center;
+}
+.form-inline .form-check {
+  width: 100%;
+}
+@media (min-width: 576px) {
+  .form-inline label {
+    display: -webkit-box;
+    display: flex;
+    -webkit-box-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+            justify-content: center;
+    margin-bottom: 0;
+  }
+  .form-inline .form-group {
+    display: -webkit-box;
+    display: flex;
+    -webkit-box-flex: 0;
+            flex: 0 0 auto;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-flow: row wrap;
+    -webkit-box-align: center;
+            align-items: center;
+    margin-bottom: 0;
+  }
+  .form-inline .form-control {
+    display: inline-block;
+    width: auto;
+    vertical-align: middle;
+  }
+  .form-inline .form-control-plaintext {
+    display: inline-block;
+  }
+  .form-inline .input-group,
+.form-inline .custom-select {
+    width: auto;
+  }
+  .form-inline .form-check {
+    display: -webkit-box;
+    display: flex;
+    -webkit-box-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+            justify-content: center;
+    width: auto;
+    padding-left: 0;
+  }
+  .form-inline .form-check-input {
+    position: relative;
+    flex-shrink: 0;
+    margin-top: 0;
+    margin-right: 0.25rem;
+    margin-left: 0;
+  }
+  .form-inline .custom-control {
+    -webkit-box-align: center;
+            align-items: center;
+    -webkit-box-pack: center;
+            justify-content: center;
+  }
+  .form-inline .custom-control-label {
+    margin-bottom: 0;
+  }
+}
+
+.btn {
+  display: inline-block;
+  font-weight: 400;
+  color: #212529;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  background-color: transparent;
+  border: 1px solid transparent;
+  padding: 0.375rem 0.75rem;
+  font-size: 1rem;
+  line-height: 1.5;
+  border-radius: 0;
+  -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .btn {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.btn:hover {
+  color: #212529;
+  text-decoration: none;
+}
+.btn:focus, .btn.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+.btn.disabled, .btn:disabled {
+  opacity: 0.65;
+}
+a.btn.disabled,
+fieldset:disabled a.btn {
+  pointer-events: none;
+}
+
+.btn-primary {
+  color: #fff;
+  background-color: #1b3d6e;
+  border-color: #1b3d6e;
+}
+.btn-primary:hover {
+  color: #fff;
+  background-color: #132c4f;
+  border-color: #112645;
+}
+.btn-primary:focus, .btn-primary.focus {
+  color: #fff;
+  background-color: #132c4f;
+  border-color: #112645;
+  box-shadow: 0 0 0 0.2rem rgba(61, 90, 132, 0.5);
+}
+.btn-primary.disabled, .btn-primary:disabled {
+  color: #fff;
+  background-color: #1b3d6e;
+  border-color: #1b3d6e;
+}
+.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
+  color: #fff;
+  background-color: #112645;
+  border-color: #0e213b;
+}
+.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(61, 90, 132, 0.5);
+}
+
+.btn-secondary {
+  color: #fff;
+  background-color: #f16824;
+  border-color: #f16824;
+}
+.btn-secondary:hover {
+  color: #fff;
+  background-color: #e0540e;
+  border-color: #d4500e;
+}
+.btn-secondary:focus, .btn-secondary.focus {
+  color: #fff;
+  background-color: #e0540e;
+  border-color: #d4500e;
+  box-shadow: 0 0 0 0.2rem rgba(243, 127, 69, 0.5);
+}
+.btn-secondary.disabled, .btn-secondary:disabled {
+  color: #fff;
+  background-color: #f16824;
+  border-color: #f16824;
+}
+.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, .show > .btn-secondary.dropdown-toggle {
+  color: #fff;
+  background-color: #d4500e;
+  border-color: #c84b0d;
+}
+.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-secondary.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(243, 127, 69, 0.5);
+}
+
+.btn-success {
+  color: #fff;
+  background-color: #28a745;
+  border-color: #28a745;
+}
+.btn-success:hover {
+  color: #fff;
+  background-color: #218838;
+  border-color: #1e7e34;
+}
+.btn-success:focus, .btn-success.focus {
+  color: #fff;
+  background-color: #218838;
+  border-color: #1e7e34;
+  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
+}
+.btn-success.disabled, .btn-success:disabled {
+  color: #fff;
+  background-color: #28a745;
+  border-color: #28a745;
+}
+.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, .show > .btn-success.dropdown-toggle {
+  color: #fff;
+  background-color: #1e7e34;
+  border-color: #1c7430;
+}
+.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, .show > .btn-success.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
+}
+
+.btn-info {
+  color: #fff;
+  background-color: #17a2b8;
+  border-color: #17a2b8;
+}
+.btn-info:hover {
+  color: #fff;
+  background-color: #138496;
+  border-color: #117a8b;
+}
+.btn-info:focus, .btn-info.focus {
+  color: #fff;
+  background-color: #138496;
+  border-color: #117a8b;
+  box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5);
+}
+.btn-info.disabled, .btn-info:disabled {
+  color: #fff;
+  background-color: #17a2b8;
+  border-color: #17a2b8;
+}
+.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, .show > .btn-info.dropdown-toggle {
+  color: #fff;
+  background-color: #117a8b;
+  border-color: #10707f;
+}
+.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, .show > .btn-info.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(58, 176, 195, 0.5);
+}
+
+.btn-warning {
+  color: #212529;
+  background-color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-warning:hover {
+  color: #212529;
+  background-color: #e0a800;
+  border-color: #d39e00;
+}
+.btn-warning:focus, .btn-warning.focus {
+  color: #212529;
+  background-color: #e0a800;
+  border-color: #d39e00;
+  box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5);
+}
+.btn-warning.disabled, .btn-warning:disabled {
+  color: #212529;
+  background-color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, .show > .btn-warning.dropdown-toggle {
+  color: #212529;
+  background-color: #d39e00;
+  border-color: #c69500;
+}
+.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-warning.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5);
+}
+
+.btn-danger {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-danger:hover {
+  color: #fff;
+  background-color: #c82333;
+  border-color: #bd2130;
+}
+.btn-danger:focus, .btn-danger.focus {
+  color: #fff;
+  background-color: #c82333;
+  border-color: #bd2130;
+  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
+}
+.btn-danger.disabled, .btn-danger:disabled {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, .show > .btn-danger.dropdown-toggle {
+  color: #fff;
+  background-color: #bd2130;
+  border-color: #b21f2d;
+}
+.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-danger.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
+}
+
+.btn-light {
+  color: #212529;
+  background-color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-light:hover {
+  color: #212529;
+  background-color: #e2e6ea;
+  border-color: #dae0e5;
+}
+.btn-light:focus, .btn-light.focus {
+  color: #212529;
+  background-color: #e2e6ea;
+  border-color: #dae0e5;
+  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
+}
+.btn-light.disabled, .btn-light:disabled {
+  color: #212529;
+  background-color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, .show > .btn-light.dropdown-toggle {
+  color: #212529;
+  background-color: #dae0e5;
+  border-color: #d3d9df;
+}
+.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, .show > .btn-light.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
+}
+
+.btn-dark {
+  color: #fff;
+  background-color: #343a40;
+  border-color: #343a40;
+}
+.btn-dark:hover {
+  color: #fff;
+  background-color: #23272b;
+  border-color: #1d2124;
+}
+.btn-dark:focus, .btn-dark.focus {
+  color: #fff;
+  background-color: #23272b;
+  border-color: #1d2124;
+  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
+}
+.btn-dark.disabled, .btn-dark:disabled {
+  color: #fff;
+  background-color: #343a40;
+  border-color: #343a40;
+}
+.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, .show > .btn-dark.dropdown-toggle {
+  color: #fff;
+  background-color: #1d2124;
+  border-color: #171a1d;
+}
+.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-dark.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
+}
+
+.btn-outline-primary {
+  color: #1b3d6e;
+  border-color: #1b3d6e;
+}
+.btn-outline-primary:hover {
+  color: #fff;
+  background-color: #1b3d6e;
+  border-color: #1b3d6e;
+}
+.btn-outline-primary:focus, .btn-outline-primary.focus {
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.5);
+}
+.btn-outline-primary.disabled, .btn-outline-primary:disabled {
+  color: #1b3d6e;
+  background-color: transparent;
+}
+.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle {
+  color: #fff;
+  background-color: #1b3d6e;
+  border-color: #1b3d6e;
+}
+.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.5);
+}
+
+.btn-outline-secondary {
+  color: #f16824;
+  border-color: #f16824;
+}
+.btn-outline-secondary:hover {
+  color: #fff;
+  background-color: #f16824;
+  border-color: #f16824;
+}
+.btn-outline-secondary:focus, .btn-outline-secondary.focus {
+  box-shadow: 0 0 0 0.2rem rgba(241, 104, 36, 0.5);
+}
+.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
+  color: #f16824;
+  background-color: transparent;
+}
+.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, .show > .btn-outline-secondary.dropdown-toggle {
+  color: #fff;
+  background-color: #f16824;
+  border-color: #f16824;
+}
+.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-secondary.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(241, 104, 36, 0.5);
+}
+
+.btn-outline-success {
+  color: #28a745;
+  border-color: #28a745;
+}
+.btn-outline-success:hover {
+  color: #fff;
+  background-color: #28a745;
+  border-color: #28a745;
+}
+.btn-outline-success:focus, .btn-outline-success.focus {
+  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
+}
+.btn-outline-success.disabled, .btn-outline-success:disabled {
+  color: #28a745;
+  background-color: transparent;
+}
+.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, .show > .btn-outline-success.dropdown-toggle {
+  color: #fff;
+  background-color: #28a745;
+  border-color: #28a745;
+}
+.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-success.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
+}
+
+.btn-outline-info {
+  color: #17a2b8;
+  border-color: #17a2b8;
+}
+.btn-outline-info:hover {
+  color: #fff;
+  background-color: #17a2b8;
+  border-color: #17a2b8;
+}
+.btn-outline-info:focus, .btn-outline-info.focus {
+  box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
+}
+.btn-outline-info.disabled, .btn-outline-info:disabled {
+  color: #17a2b8;
+  background-color: transparent;
+}
+.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, .show > .btn-outline-info.dropdown-toggle {
+  color: #fff;
+  background-color: #17a2b8;
+  border-color: #17a2b8;
+}
+.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-info.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
+}
+
+.btn-outline-warning {
+  color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-outline-warning:hover {
+  color: #212529;
+  background-color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-outline-warning:focus, .btn-outline-warning.focus {
+  box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
+}
+.btn-outline-warning.disabled, .btn-outline-warning:disabled {
+  color: #ffc107;
+  background-color: transparent;
+}
+.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, .show > .btn-outline-warning.dropdown-toggle {
+  color: #212529;
+  background-color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-warning.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
+}
+
+.btn-outline-danger {
+  color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-outline-danger:hover {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-outline-danger:focus, .btn-outline-danger.focus {
+  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
+}
+.btn-outline-danger.disabled, .btn-outline-danger:disabled {
+  color: #dc3545;
+  background-color: transparent;
+}
+.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, .show > .btn-outline-danger.dropdown-toggle {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-danger.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
+}
+
+.btn-outline-light {
+  color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-outline-light:hover {
+  color: #212529;
+  background-color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-outline-light:focus, .btn-outline-light.focus {
+  box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
+}
+.btn-outline-light.disabled, .btn-outline-light:disabled {
+  color: #f8f9fa;
+  background-color: transparent;
+}
+.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, .show > .btn-outline-light.dropdown-toggle {
+  color: #212529;
+  background-color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-light.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
+}
+
+.btn-outline-dark {
+  color: #343a40;
+  border-color: #343a40;
+}
+.btn-outline-dark:hover {
+  color: #fff;
+  background-color: #343a40;
+  border-color: #343a40;
+}
+.btn-outline-dark:focus, .btn-outline-dark.focus {
+  box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
+}
+.btn-outline-dark.disabled, .btn-outline-dark:disabled {
+  color: #343a40;
+  background-color: transparent;
+}
+.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, .show > .btn-outline-dark.dropdown-toggle {
+  color: #fff;
+  background-color: #343a40;
+  border-color: #343a40;
+}
+.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-dark.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
+}
+
+.btn-link {
+  font-weight: 400;
+  color: #1b3d6e;
+  text-decoration: none;
+}
+.btn-link:hover {
+  color: #0c1b31;
+  text-decoration: underline;
+}
+.btn-link:focus, .btn-link.focus {
+  text-decoration: underline;
+  box-shadow: none;
+}
+.btn-link:disabled, .btn-link.disabled {
+  color: #6c757d;
+  pointer-events: none;
+}
+
+.btn-lg, .btn-group-lg > .btn {
+  padding: 0.5rem 1rem;
+  font-size: 1.25rem;
+  line-height: 1.5;
+  border-radius: 0;
+}
+
+.btn-sm, .btn-group-sm > .btn {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  border-radius: 0;
+}
+
+.btn-block {
+  display: block;
+  width: 100%;
+}
+.btn-block + .btn-block {
+  margin-top: 0.5rem;
+}
+
+input[type=submit].btn-block,
+input[type=reset].btn-block,
+input[type=button].btn-block {
+  width: 100%;
+}
+
+.fade {
+  -webkit-transition: opacity 0.15s linear;
+  transition: opacity 0.15s linear;
+}
+@media (prefers-reduced-motion: reduce) {
+  .fade {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.fade:not(.show) {
+  opacity: 0;
+}
+
+.collapse:not(.show) {
+  display: none;
+}
+
+.collapsing {
+  position: relative;
+  height: 0;
+  overflow: hidden;
+  -webkit-transition: height 0.35s ease;
+  transition: height 0.35s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .collapsing {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+
+.dropup,
+.dropright,
+.dropdown,
+.dropleft {
+  position: relative;
+}
+
+.dropdown-toggle {
+  white-space: nowrap;
+}
+.dropdown-toggle::after {
+  display: inline-block;
+  margin-left: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+  border-top: 0.3em solid;
+  border-right: 0.3em solid transparent;
+  border-bottom: 0;
+  border-left: 0.3em solid transparent;
+}
+.dropdown-toggle:empty::after {
+  margin-left: 0;
+}
+
+.dropdown-menu {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  z-index: 1000;
+  display: none;
+  float: left;
+  min-width: 10rem;
+  padding: 0.5rem 0;
+  margin: 0.125rem 0 0;
+  font-size: 1rem;
+  color: #212529;
+  text-align: left;
+  list-style: none;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+}
+
+.dropdown-menu-left {
+  right: auto;
+  left: 0;
+}
+
+.dropdown-menu-right {
+  right: 0;
+  left: auto;
+}
+
+@media (min-width: 576px) {
+  .dropdown-menu-sm-left {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-sm-right {
+    right: 0;
+    left: auto;
+  }
+}
+@media (min-width: 768px) {
+  .dropdown-menu-md-left {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-md-right {
+    right: 0;
+    left: auto;
+  }
+}
+@media (min-width: 992px) {
+  .dropdown-menu-lg-left {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-lg-right {
+    right: 0;
+    left: auto;
+  }
+}
+@media (min-width: 1200px) {
+  .dropdown-menu-xl-left {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-xl-right {
+    right: 0;
+    left: auto;
+  }
+}
+.dropup .dropdown-menu {
+  top: auto;
+  bottom: 100%;
+  margin-top: 0;
+  margin-bottom: 0.125rem;
+}
+.dropup .dropdown-toggle::after {
+  display: inline-block;
+  margin-left: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+  border-top: 0;
+  border-right: 0.3em solid transparent;
+  border-bottom: 0.3em solid;
+  border-left: 0.3em solid transparent;
+}
+.dropup .dropdown-toggle:empty::after {
+  margin-left: 0;
+}
+
+.dropright .dropdown-menu {
+  top: 0;
+  right: auto;
+  left: 100%;
+  margin-top: 0;
+  margin-left: 0.125rem;
+}
+.dropright .dropdown-toggle::after {
+  display: inline-block;
+  margin-left: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+  border-top: 0.3em solid transparent;
+  border-right: 0;
+  border-bottom: 0.3em solid transparent;
+  border-left: 0.3em solid;
+}
+.dropright .dropdown-toggle:empty::after {
+  margin-left: 0;
+}
+.dropright .dropdown-toggle::after {
+  vertical-align: 0;
+}
+
+.dropleft .dropdown-menu {
+  top: 0;
+  right: 100%;
+  left: auto;
+  margin-top: 0;
+  margin-right: 0.125rem;
+}
+.dropleft .dropdown-toggle::after {
+  display: inline-block;
+  margin-left: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+}
+.dropleft .dropdown-toggle::after {
+  display: none;
+}
+.dropleft .dropdown-toggle::before {
+  display: inline-block;
+  margin-right: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+  border-top: 0.3em solid transparent;
+  border-right: 0.3em solid;
+  border-bottom: 0.3em solid transparent;
+}
+.dropleft .dropdown-toggle:empty::after {
+  margin-left: 0;
+}
+.dropleft .dropdown-toggle::before {
+  vertical-align: 0;
+}
+
+.dropdown-menu[x-placement^=top], .dropdown-menu[x-placement^=right], .dropdown-menu[x-placement^=bottom], .dropdown-menu[x-placement^=left] {
+  right: auto;
+  bottom: auto;
+}
+
+.dropdown-divider {
+  height: 0;
+  margin: 0.5rem 0;
+  overflow: hidden;
+  border-top: 1px solid #e9ecef;
+}
+
+.dropdown-item {
+  display: block;
+  width: 100%;
+  padding: 0.25rem 1.5rem;
+  clear: both;
+  font-weight: 400;
+  color: #212529;
+  text-align: inherit;
+  white-space: nowrap;
+  background-color: transparent;
+  border: 0;
+}
+.dropdown-item:hover, .dropdown-item:focus {
+  color: #16181b;
+  text-decoration: none;
+  background-color: #f8f9fa;
+}
+.dropdown-item.active, .dropdown-item:active {
+  color: #fff;
+  text-decoration: none;
+  background-color: #1b3d6e;
+}
+.dropdown-item.disabled, .dropdown-item:disabled {
+  color: #6c757d;
+  pointer-events: none;
+  background-color: transparent;
+}
+
+.dropdown-menu.show {
+  display: block;
+}
+
+.dropdown-header {
+  display: block;
+  padding: 0.5rem 1.5rem;
+  margin-bottom: 0;
+  font-size: 0.875rem;
+  color: #6c757d;
+  white-space: nowrap;
+}
+
+.dropdown-item-text {
+  display: block;
+  padding: 0.25rem 1.5rem;
+  color: #212529;
+}
+
+.btn-group,
+.btn-group-vertical {
+  position: relative;
+  display: -webkit-inline-box;
+  display: inline-flex;
+  vertical-align: middle;
+}
+.btn-group > .btn,
+.btn-group-vertical > .btn {
+  position: relative;
+  -webkit-box-flex: 1;
+          flex: 1 1 auto;
+}
+.btn-group > .btn:hover,
+.btn-group-vertical > .btn:hover {
+  z-index: 1;
+}
+.btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active,
+.btn-group-vertical > .btn:focus,
+.btn-group-vertical > .btn:active,
+.btn-group-vertical > .btn.active {
+  z-index: 1;
+}
+
+.btn-toolbar {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  -webkit-box-pack: start;
+          justify-content: flex-start;
+}
+.btn-toolbar .input-group {
+  width: auto;
+}
+
+.btn-group > .btn:not(:first-child),
+.btn-group > .btn-group:not(:first-child) {
+  margin-left: -1px;
+}
+.dropdown-toggle-split {
+  padding-right: 0.5625rem;
+  padding-left: 0.5625rem;
+}
+.dropdown-toggle-split::after, .dropup .dropdown-toggle-split::after, .dropright .dropdown-toggle-split::after {
+  margin-left: 0;
+}
+.dropleft .dropdown-toggle-split::before {
+  margin-right: 0;
+}
+
+.btn-sm + .dropdown-toggle-split, .btn-group-sm > .btn + .dropdown-toggle-split {
+  padding-right: 0.375rem;
+  padding-left: 0.375rem;
+}
+
+.btn-lg + .dropdown-toggle-split, .btn-group-lg > .btn + .dropdown-toggle-split {
+  padding-right: 0.75rem;
+  padding-left: 0.75rem;
+}
+
+.btn-group-vertical {
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  -webkit-box-align: start;
+          align-items: flex-start;
+  -webkit-box-pack: center;
+          justify-content: center;
+}
+.btn-group-vertical > .btn,
+.btn-group-vertical > .btn-group {
+  width: 100%;
+}
+.btn-group-vertical > .btn:not(:first-child),
+.btn-group-vertical > .btn-group:not(:first-child) {
+  margin-top: -1px;
+}
+.btn-group-toggle > .btn,
+.btn-group-toggle > .btn-group > .btn {
+  margin-bottom: 0;
+}
+.btn-group-toggle > .btn input[type=radio],
+.btn-group-toggle > .btn input[type=checkbox],
+.btn-group-toggle > .btn-group > .btn input[type=radio],
+.btn-group-toggle > .btn-group > .btn input[type=checkbox] {
+  position: absolute;
+  clip: rect(0, 0, 0, 0);
+  pointer-events: none;
+}
+
+.input-group {
+  position: relative;
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  -webkit-box-align: stretch;
+          align-items: stretch;
+  width: 100%;
+}
+.input-group > .form-control,
+.input-group > .form-control-plaintext,
+.input-group > .custom-select,
+.input-group > .custom-file {
+  position: relative;
+  -webkit-box-flex: 1;
+          flex: 1 1 0%;
+  min-width: 0;
+  margin-bottom: 0;
+}
+.input-group > .form-control + .form-control,
+.input-group > .form-control + .custom-select,
+.input-group > .form-control + .custom-file,
+.input-group > .form-control-plaintext + .form-control,
+.input-group > .form-control-plaintext + .custom-select,
+.input-group > .form-control-plaintext + .custom-file,
+.input-group > .custom-select + .form-control,
+.input-group > .custom-select + .custom-select,
+.input-group > .custom-select + .custom-file,
+.input-group > .custom-file + .form-control,
+.input-group > .custom-file + .custom-select,
+.input-group > .custom-file + .custom-file {
+  margin-left: -1px;
+}
+.input-group > .form-control:focus,
+.input-group > .custom-select:focus,
+.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label {
+  z-index: 3;
+}
+.input-group > .custom-file .custom-file-input:focus {
+  z-index: 4;
+}
+.input-group > .custom-file {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-align: center;
+          align-items: center;
+}
+.input-group-prepend,
+.input-group-append {
+  display: -webkit-box;
+  display: flex;
+}
+.input-group-prepend .btn,
+.input-group-append .btn {
+  position: relative;
+  z-index: 2;
+}
+.input-group-prepend .btn:focus,
+.input-group-append .btn:focus {
+  z-index: 3;
+}
+.input-group-prepend .btn + .btn,
+.input-group-prepend .btn + .input-group-text,
+.input-group-prepend .input-group-text + .input-group-text,
+.input-group-prepend .input-group-text + .btn,
+.input-group-append .btn + .btn,
+.input-group-append .btn + .input-group-text,
+.input-group-append .input-group-text + .input-group-text,
+.input-group-append .input-group-text + .btn {
+  margin-left: -1px;
+}
+
+.input-group-prepend {
+  margin-right: -1px;
+}
+
+.input-group-append {
+  margin-left: -1px;
+}
+
+.input-group-text {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-align: center;
+          align-items: center;
+  padding: 0.375rem 0.75rem;
+  margin-bottom: 0;
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #495057;
+  text-align: center;
+  white-space: nowrap;
+  background-color: #e9ecef;
+  border: 1px solid #ced4da;
+}
+.input-group-text input[type=radio],
+.input-group-text input[type=checkbox] {
+  margin-top: 0;
+}
+
+.input-group-lg > .form-control:not(textarea),
+.input-group-lg > .custom-select {
+  height: calc(1.5em + 1rem + 2px);
+}
+
+.input-group-lg > .form-control,
+.input-group-lg > .custom-select,
+.input-group-lg > .input-group-prepend > .input-group-text,
+.input-group-lg > .input-group-append > .input-group-text,
+.input-group-lg > .input-group-prepend > .btn,
+.input-group-lg > .input-group-append > .btn {
+  padding: 0.5rem 1rem;
+  font-size: 1.25rem;
+  line-height: 1.5;
+}
+
+.input-group-sm > .form-control:not(textarea),
+.input-group-sm > .custom-select {
+  height: calc(1.5em + 0.5rem + 2px);
+}
+
+.input-group-sm > .form-control,
+.input-group-sm > .custom-select,
+.input-group-sm > .input-group-prepend > .input-group-text,
+.input-group-sm > .input-group-append > .input-group-text,
+.input-group-sm > .input-group-prepend > .btn,
+.input-group-sm > .input-group-append > .btn {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+}
+
+.input-group-lg > .custom-select,
+.input-group-sm > .custom-select {
+  padding-right: 1.75rem;
+}
+
+.custom-control {
+  position: relative;
+  display: block;
+  min-height: 1.5rem;
+  padding-left: 1.5rem;
+}
+
+.custom-control-inline {
+  display: -webkit-inline-box;
+  display: inline-flex;
+  margin-right: 1rem;
+}
+
+.custom-control-input {
+  position: absolute;
+  left: 0;
+  z-index: -1;
+  width: 1rem;
+  height: 1.25rem;
+  opacity: 0;
+}
+.custom-control-input:checked ~ .custom-control-label::before {
+  color: #fff;
+  border-color: #1b3d6e;
+  background-color: #1b3d6e;
+}
+.custom-control-input:focus ~ .custom-control-label::before {
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
+  border-color: #3a77cf;
+}
+.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
+  color: #fff;
+  background-color: #6393d9;
+  border-color: #6393d9;
+}
+.custom-control-input[disabled] ~ .custom-control-label, .custom-control-input:disabled ~ .custom-control-label {
+  color: #6c757d;
+}
+.custom-control-input[disabled] ~ .custom-control-label::before, .custom-control-input:disabled ~ .custom-control-label::before {
+  background-color: #e9ecef;
+}
+
+.custom-control-label {
+  position: relative;
+  margin-bottom: 0;
+  vertical-align: top;
+}
+.custom-control-label::before {
+  position: absolute;
+  top: 0.25rem;
+  left: -1.5rem;
+  display: block;
+  width: 1rem;
+  height: 1rem;
+  pointer-events: none;
+  content: "";
+  background-color: #fff;
+  border: #adb5bd solid 1px;
+}
+.custom-control-label::after {
+  position: absolute;
+  top: 0.25rem;
+  left: -1.5rem;
+  display: block;
+  width: 1rem;
+  height: 1rem;
+  content: "";
+  background: no-repeat 50%/50% 50%;
+}
+
+.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
+}
+.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
+  border-color: #1b3d6e;
+  background-color: #1b3d6e;
+}
+.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e");
+}
+.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before {
+  background-color: rgba(27, 61, 110, 0.5);
+}
+.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
+  background-color: rgba(27, 61, 110, 0.5);
+}
+
+.custom-radio .custom-control-label::before {
+  border-radius: 50%;
+}
+.custom-radio .custom-control-input:checked ~ .custom-control-label::after {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
+}
+.custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before {
+  background-color: rgba(27, 61, 110, 0.5);
+}
+
+.custom-switch {
+  padding-left: 2.25rem;
+}
+.custom-switch .custom-control-label::before {
+  left: -2.25rem;
+  width: 1.75rem;
+  pointer-events: all;
+  border-radius: 0.5rem;
+}
+.custom-switch .custom-control-label::after {
+  top: calc(0.25rem + 2px);
+  left: calc(-2.25rem + 2px);
+  width: calc(1rem - 4px);
+  height: calc(1rem - 4px);
+  background-color: #adb5bd;
+  border-radius: 0.5rem;
+  -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
+  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
+  transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .custom-switch .custom-control-label::after {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
+  background-color: #fff;
+  -webkit-transform: translateX(0.75rem);
+          transform: translateX(0.75rem);
+}
+.custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before {
+  background-color: rgba(27, 61, 110, 0.5);
+}
+
+.custom-select {
+  display: inline-block;
+  width: 100%;
+  height: calc(1.5em + 0.75rem + 2px);
+  padding: 0.375rem 1.75rem 0.375rem 0.75rem;
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #495057;
+  vertical-align: middle;
+  background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px;
+  border: 1px solid #ced4da;
+  border-radius: 0;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+}
+.custom-select:focus {
+  border-color: #3a77cf;
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+.custom-select:focus::-ms-value {
+  color: #495057;
+  background-color: #fff;
+}
+.custom-select[multiple], .custom-select[size]:not([size="1"]) {
+  height: auto;
+  padding-right: 0.75rem;
+  background-image: none;
+}
+.custom-select:disabled {
+  color: #6c757d;
+  background-color: #e9ecef;
+}
+.custom-select::-ms-expand {
+  display: none;
+}
+.custom-select:-moz-focusring {
+  color: transparent;
+  text-shadow: 0 0 0 #495057;
+}
+
+.custom-select-sm {
+  height: calc(1.5em + 0.5rem + 2px);
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+  padding-left: 0.5rem;
+  font-size: 0.875rem;
+}
+
+.custom-select-lg {
+  height: calc(1.5em + 1rem + 2px);
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  padding-left: 1rem;
+  font-size: 1.25rem;
+}
+
+.custom-file {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  height: calc(1.5em + 0.75rem + 2px);
+  margin-bottom: 0;
+}
+
+.custom-file-input {
+  position: relative;
+  z-index: 2;
+  width: 100%;
+  height: calc(1.5em + 0.75rem + 2px);
+  margin: 0;
+  opacity: 0;
+}
+.custom-file-input:focus ~ .custom-file-label {
+  border-color: #3a77cf;
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+.custom-file-input[disabled] ~ .custom-file-label, .custom-file-input:disabled ~ .custom-file-label {
+  background-color: #e9ecef;
+}
+.custom-file-input:lang(en) ~ .custom-file-label::after {
+  content: "Browse";
+}
+.custom-file-input ~ .custom-file-label[data-browse]::after {
+  content: attr(data-browse);
+}
+
+.custom-file-label {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  z-index: 1;
+  height: calc(1.5em + 0.75rem + 2px);
+  padding: 0.375rem 0.75rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #495057;
+  background-color: #fff;
+  border: 1px solid #ced4da;
+}
+.custom-file-label::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 3;
+  display: block;
+  height: calc(1.5em + 0.75rem);
+  padding: 0.375rem 0.75rem;
+  line-height: 1.5;
+  color: #495057;
+  content: "Browse";
+  background-color: #e9ecef;
+  border-left: inherit;
+}
+
+.custom-range {
+  width: 100%;
+  height: 1.4rem;
+  padding: 0;
+  background-color: transparent;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+}
+.custom-range:focus {
+  outline: none;
+}
+.custom-range:focus::-webkit-slider-thumb {
+  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+.custom-range:focus::-moz-range-thumb {
+  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+.custom-range:focus::-ms-thumb {
+  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+.custom-range::-moz-focus-outer {
+  border: 0;
+}
+.custom-range::-webkit-slider-thumb {
+  width: 1rem;
+  height: 1rem;
+  margin-top: -0.25rem;
+  background-color: #1b3d6e;
+  border: 0;
+  -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  -webkit-appearance: none;
+          appearance: none;
+}
+@media (prefers-reduced-motion: reduce) {
+  .custom-range::-webkit-slider-thumb {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.custom-range::-webkit-slider-thumb:active {
+  background-color: #6393d9;
+}
+.custom-range::-webkit-slider-runnable-track {
+  width: 100%;
+  height: 0.5rem;
+  color: transparent;
+  cursor: pointer;
+  background-color: #dee2e6;
+  border-color: transparent;
+}
+.custom-range::-moz-range-thumb {
+  width: 1rem;
+  height: 1rem;
+  background-color: #1b3d6e;
+  border: 0;
+  -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  -moz-appearance: none;
+       appearance: none;
+}
+@media (prefers-reduced-motion: reduce) {
+  .custom-range::-moz-range-thumb {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.custom-range::-moz-range-thumb:active {
+  background-color: #6393d9;
+}
+.custom-range::-moz-range-track {
+  width: 100%;
+  height: 0.5rem;
+  color: transparent;
+  cursor: pointer;
+  background-color: #dee2e6;
+  border-color: transparent;
+}
+.custom-range::-ms-thumb {
+  width: 1rem;
+  height: 1rem;
+  margin-top: 0;
+  margin-right: 0.2rem;
+  margin-left: 0.2rem;
+  background-color: #1b3d6e;
+  border: 0;
+  -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  appearance: none;
+}
+@media (prefers-reduced-motion: reduce) {
+  .custom-range::-ms-thumb {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.custom-range::-ms-thumb:active {
+  background-color: #6393d9;
+}
+.custom-range::-ms-track {
+  width: 100%;
+  height: 0.5rem;
+  color: transparent;
+  cursor: pointer;
+  background-color: transparent;
+  border-color: transparent;
+  border-width: 0.5rem;
+}
+.custom-range::-ms-fill-lower {
+  background-color: #dee2e6;
+}
+.custom-range::-ms-fill-upper {
+  margin-right: 15px;
+  background-color: #dee2e6;
+}
+.custom-range:disabled::-webkit-slider-thumb {
+  background-color: #adb5bd;
+}
+.custom-range:disabled::-webkit-slider-runnable-track {
+  cursor: default;
+}
+.custom-range:disabled::-moz-range-thumb {
+  background-color: #adb5bd;
+}
+.custom-range:disabled::-moz-range-track {
+  cursor: default;
+}
+.custom-range:disabled::-ms-thumb {
+  background-color: #adb5bd;
+}
+
+.custom-control-label::before,
+.custom-file-label,
+.custom-select {
+  -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .custom-control-label::before,
+.custom-file-label,
+.custom-select {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+
+.nav {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  padding-left: 0;
+  margin-bottom: 0;
+  list-style: none;
+}
+
+.nav-link {
+  display: block;
+  padding: 0.5rem 1rem;
+}
+.nav-link:hover, .nav-link:focus {
+  text-decoration: none;
+}
+.nav-link.disabled {
+  color: #6c757d;
+  pointer-events: none;
+  cursor: default;
+}
+
+.nav-tabs {
+  border-bottom: 1px solid #dee2e6;
+}
+.nav-tabs .nav-item {
+  margin-bottom: -1px;
+}
+.nav-tabs .nav-link {
+  border: 1px solid transparent;
+}
+.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
+  border-color: #e9ecef #e9ecef #dee2e6;
+}
+.nav-tabs .nav-link.disabled {
+  color: #6c757d;
+  background-color: transparent;
+  border-color: transparent;
+}
+.nav-tabs .nav-link.active,
+.nav-tabs .nav-item.show .nav-link {
+  color: #495057;
+  background-color: #fff;
+  border-color: #dee2e6 #dee2e6 #fff;
+}
+.nav-tabs .dropdown-menu {
+  margin-top: -1px;
+}
+
+.nav-pills .nav-link.active,
+.nav-pills .show > .nav-link {
+  color: #fff;
+  background-color: #1b3d6e;
+}
+
+.nav-fill .nav-item {
+  -webkit-box-flex: 1;
+          flex: 1 1 auto;
+  text-align: center;
+}
+
+.nav-justified .nav-item {
+  flex-basis: 0;
+  -webkit-box-flex: 1;
+          flex-grow: 1;
+  text-align: center;
+}
+
+.tab-content > .tab-pane {
+  display: none;
+}
+.tab-content > .active {
+  display: block;
+}
+
+.navbar {
+  position: relative;
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  -webkit-box-align: center;
+          align-items: center;
+  -webkit-box-pack: justify;
+          justify-content: space-between;
+  padding: 0.5rem 1rem;
+}
+.navbar .container,
+.navbar .container-fluid,
+.navbar .container-sm,
+.navbar .container-md,
+.navbar .container-lg,
+.navbar .container-xl {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  -webkit-box-align: center;
+          align-items: center;
+  -webkit-box-pack: justify;
+          justify-content: space-between;
+}
+.navbar-brand {
+  display: inline-block;
+  padding-top: 0.3125rem;
+  padding-bottom: 0.3125rem;
+  margin-right: 1rem;
+  font-size: 1.25rem;
+  line-height: inherit;
+  white-space: nowrap;
+}
+.navbar-brand:hover, .navbar-brand:focus {
+  text-decoration: none;
+}
+
+.navbar-nav {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  padding-left: 0;
+  margin-bottom: 0;
+  list-style: none;
+}
+.navbar-nav .nav-link {
+  padding-right: 0;
+  padding-left: 0;
+}
+.navbar-nav .dropdown-menu {
+  position: static;
+  float: none;
+}
+
+.navbar-text {
+  display: inline-block;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+
+.navbar-collapse {
+  flex-basis: 100%;
+  -webkit-box-flex: 1;
+          flex-grow: 1;
+  -webkit-box-align: center;
+          align-items: center;
+}
+
+.navbar-toggler {
+  padding: 0.25rem 0.75rem;
+  font-size: 1.25rem;
+  line-height: 1;
+  background-color: transparent;
+  border: 1px solid transparent;
+}
+.navbar-toggler:hover, .navbar-toggler:focus {
+  text-decoration: none;
+}
+
+.navbar-toggler-icon {
+  display: inline-block;
+  width: 1.5em;
+  height: 1.5em;
+  vertical-align: middle;
+  content: "";
+  background: no-repeat center center;
+  background-size: 100% 100%;
+}
+
+@media (max-width: 575.98px) {
+  .navbar-expand-sm > .container,
+.navbar-expand-sm > .container-fluid,
+.navbar-expand-sm > .container-sm,
+.navbar-expand-sm > .container-md,
+.navbar-expand-sm > .container-lg,
+.navbar-expand-sm > .container-xl {
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+@media (min-width: 576px) {
+  .navbar-expand-sm {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-flow: row nowrap;
+    -webkit-box-pack: start;
+            justify-content: flex-start;
+  }
+  .navbar-expand-sm .navbar-nav {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-direction: row;
+  }
+  .navbar-expand-sm .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-sm .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-sm > .container,
+.navbar-expand-sm > .container-fluid,
+.navbar-expand-sm > .container-sm,
+.navbar-expand-sm > .container-md,
+.navbar-expand-sm > .container-lg,
+.navbar-expand-sm > .container-xl {
+    flex-wrap: nowrap;
+  }
+  .navbar-expand-sm .navbar-collapse {
+    display: -webkit-box !important;
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-sm .navbar-toggler {
+    display: none;
+  }
+}
+@media (max-width: 767.98px) {
+  .navbar-expand-md > .container,
+.navbar-expand-md > .container-fluid,
+.navbar-expand-md > .container-sm,
+.navbar-expand-md > .container-md,
+.navbar-expand-md > .container-lg,
+.navbar-expand-md > .container-xl {
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+@media (min-width: 768px) {
+  .navbar-expand-md {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-flow: row nowrap;
+    -webkit-box-pack: start;
+            justify-content: flex-start;
+  }
+  .navbar-expand-md .navbar-nav {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-direction: row;
+  }
+  .navbar-expand-md .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-md .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-md > .container,
+.navbar-expand-md > .container-fluid,
+.navbar-expand-md > .container-sm,
+.navbar-expand-md > .container-md,
+.navbar-expand-md > .container-lg,
+.navbar-expand-md > .container-xl {
+    flex-wrap: nowrap;
+  }
+  .navbar-expand-md .navbar-collapse {
+    display: -webkit-box !important;
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-md .navbar-toggler {
+    display: none;
+  }
+}
+@media (max-width: 991.98px) {
+  .navbar-expand-lg > .container,
+.navbar-expand-lg > .container-fluid,
+.navbar-expand-lg > .container-sm,
+.navbar-expand-lg > .container-md,
+.navbar-expand-lg > .container-lg,
+.navbar-expand-lg > .container-xl {
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+@media (min-width: 992px) {
+  .navbar-expand-lg {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-flow: row nowrap;
+    -webkit-box-pack: start;
+            justify-content: flex-start;
+  }
+  .navbar-expand-lg .navbar-nav {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-direction: row;
+  }
+  .navbar-expand-lg .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-lg .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-lg > .container,
+.navbar-expand-lg > .container-fluid,
+.navbar-expand-lg > .container-sm,
+.navbar-expand-lg > .container-md,
+.navbar-expand-lg > .container-lg,
+.navbar-expand-lg > .container-xl {
+    flex-wrap: nowrap;
+  }
+  .navbar-expand-lg .navbar-collapse {
+    display: -webkit-box !important;
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-lg .navbar-toggler {
+    display: none;
+  }
+}
+@media (max-width: 1199.98px) {
+  .navbar-expand-xl > .container,
+.navbar-expand-xl > .container-fluid,
+.navbar-expand-xl > .container-sm,
+.navbar-expand-xl > .container-md,
+.navbar-expand-xl > .container-lg,
+.navbar-expand-xl > .container-xl {
+    padding-right: 0;
+    padding-left: 0;
+  }
+}
+@media (min-width: 1200px) {
+  .navbar-expand-xl {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-flow: row nowrap;
+    -webkit-box-pack: start;
+            justify-content: flex-start;
+  }
+  .navbar-expand-xl .navbar-nav {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-direction: row;
+  }
+  .navbar-expand-xl .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-xl .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-xl > .container,
+.navbar-expand-xl > .container-fluid,
+.navbar-expand-xl > .container-sm,
+.navbar-expand-xl > .container-md,
+.navbar-expand-xl > .container-lg,
+.navbar-expand-xl > .container-xl {
+    flex-wrap: nowrap;
+  }
+  .navbar-expand-xl .navbar-collapse {
+    display: -webkit-box !important;
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-xl .navbar-toggler {
+    display: none;
+  }
+}
+.navbar-expand {
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+          flex-flow: row nowrap;
+  -webkit-box-pack: start;
+          justify-content: flex-start;
+}
+.navbar-expand > .container,
+.navbar-expand > .container-fluid,
+.navbar-expand > .container-sm,
+.navbar-expand > .container-md,
+.navbar-expand > .container-lg,
+.navbar-expand > .container-xl {
+  padding-right: 0;
+  padding-left: 0;
+}
+.navbar-expand .navbar-nav {
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+          flex-direction: row;
+}
+.navbar-expand .navbar-nav .dropdown-menu {
+  position: absolute;
+}
+.navbar-expand .navbar-nav .nav-link {
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+.navbar-expand > .container,
+.navbar-expand > .container-fluid,
+.navbar-expand > .container-sm,
+.navbar-expand > .container-md,
+.navbar-expand > .container-lg,
+.navbar-expand > .container-xl {
+  flex-wrap: nowrap;
+}
+.navbar-expand .navbar-collapse {
+  display: -webkit-box !important;
+  display: flex !important;
+  flex-basis: auto;
+}
+.navbar-expand .navbar-toggler {
+  display: none;
+}
+
+.navbar-light .navbar-brand {
+  color: rgba(0, 0, 0, 0.9);
+}
+.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
+  color: rgba(0, 0, 0, 0.9);
+}
+.navbar-light .navbar-nav .nav-link {
+  color: rgba(0, 0, 0, 0.5);
+}
+.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
+  color: rgba(0, 0, 0, 0.7);
+}
+.navbar-light .navbar-nav .nav-link.disabled {
+  color: rgba(0, 0, 0, 0.3);
+}
+.navbar-light .navbar-nav .show > .nav-link,
+.navbar-light .navbar-nav .active > .nav-link,
+.navbar-light .navbar-nav .nav-link.show,
+.navbar-light .navbar-nav .nav-link.active {
+  color: rgba(0, 0, 0, 0.9);
+}
+.navbar-light .navbar-toggler {
+  color: rgba(0, 0, 0, 0.5);
+  border-color: rgba(0, 0, 0, 0.1);
+}
+.navbar-light .navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 0.5)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
+}
+.navbar-light .navbar-text {
+  color: rgba(0, 0, 0, 0.5);
+}
+.navbar-light .navbar-text a {
+  color: rgba(0, 0, 0, 0.9);
+}
+.navbar-light .navbar-text a:hover, .navbar-light .navbar-text a:focus {
+  color: rgba(0, 0, 0, 0.9);
+}
+
+.navbar-dark .navbar-brand {
+  color: #fff;
+}
+.navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {
+  color: #fff;
+}
+.navbar-dark .navbar-nav .nav-link {
+  color: rgba(255, 255, 255, 0.5);
+}
+.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
+  color: rgba(255, 255, 255, 0.75);
+}
+.navbar-dark .navbar-nav .nav-link.disabled {
+  color: rgba(255, 255, 255, 0.25);
+}
+.navbar-dark .navbar-nav .show > .nav-link,
+.navbar-dark .navbar-nav .active > .nav-link,
+.navbar-dark .navbar-nav .nav-link.show,
+.navbar-dark .navbar-nav .nav-link.active {
+  color: #fff;
+}
+.navbar-dark .navbar-toggler {
+  color: rgba(255, 255, 255, 0.5);
+  border-color: rgba(255, 255, 255, 0.1);
+}
+.navbar-dark .navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.5)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
+}
+.navbar-dark .navbar-text {
+  color: rgba(255, 255, 255, 0.5);
+}
+.navbar-dark .navbar-text a {
+  color: #fff;
+}
+.navbar-dark .navbar-text a:hover, .navbar-dark .navbar-text a:focus {
+  color: #fff;
+}
+
+.card {
+  position: relative;
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  min-width: 0;
+  word-wrap: break-word;
+  background-color: #fff;
+  background-clip: border-box;
+  border: 1px solid rgba(0, 0, 0, 0.125);
+}
+.card > hr {
+  margin-right: 0;
+  margin-left: 0;
+}
+.card-body {
+  -webkit-box-flex: 1;
+          flex: 1 1 auto;
+  min-height: 1px;
+  padding: 1.25rem;
+}
+
+.card-title {
+  margin-bottom: 0.75rem;
+}
+
+.card-subtitle {
+  margin-top: -0.375rem;
+  margin-bottom: 0;
+}
+
+.card-text:last-child {
+  margin-bottom: 0;
+}
+
+.card-link:hover {
+  text-decoration: none;
+}
+.card-link + .card-link {
+  margin-left: 1.25rem;
+}
+
+.card-header {
+  padding: 0.75rem 1.25rem;
+  margin-bottom: 0;
+  background-color: rgba(0, 0, 0, 0.03);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
+}
+.card-header + .list-group .list-group-item:first-child {
+  border-top: 0;
+}
+
+.card-footer {
+  padding: 0.75rem 1.25rem;
+  background-color: rgba(0, 0, 0, 0.03);
+  border-top: 1px solid rgba(0, 0, 0, 0.125);
+}
+.card-header-tabs {
+  margin-right: -0.625rem;
+  margin-bottom: -0.75rem;
+  margin-left: -0.625rem;
+  border-bottom: 0;
+}
+
+.card-header-pills {
+  margin-right: -0.625rem;
+  margin-left: -0.625rem;
+}
+
+.card-img-overlay {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  padding: 1.25rem;
+}
+
+.card-img,
+.card-img-top,
+.card-img-bottom {
+  flex-shrink: 0;
+  width: 100%;
+}
+
+.card-deck .card {
+  margin-bottom: 15px;
+}
+@media (min-width: 576px) {
+  .card-deck {
+    display: -webkit-box;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-flow: row wrap;
+    margin-right: -15px;
+    margin-left: -15px;
+  }
+  .card-deck .card {
+    -webkit-box-flex: 1;
+            flex: 1 0 0%;
+    margin-right: 15px;
+    margin-bottom: 0;
+    margin-left: 15px;
+  }
+}
+
+.card-group > .card {
+  margin-bottom: 15px;
+}
+@media (min-width: 576px) {
+  .card-group {
+    display: -webkit-box;
+    display: flex;
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-flow: row wrap;
+  }
+  .card-group > .card {
+    -webkit-box-flex: 1;
+            flex: 1 0 0%;
+    margin-bottom: 0;
+  }
+  .card-group > .card + .card {
+    margin-left: 0;
+    border-left: 0;
+  }
+}
+
+.card-columns .card {
+  margin-bottom: 0.75rem;
+}
+@media (min-width: 576px) {
+  .card-columns {
+    -webkit-column-count: 3;
+       -moz-column-count: 3;
+            column-count: 3;
+    -webkit-column-gap: 1.25rem;
+       -moz-column-gap: 1.25rem;
+            column-gap: 1.25rem;
+    orphans: 1;
+    widows: 1;
+  }
+  .card-columns .card {
+    display: inline-block;
+    width: 100%;
+  }
+}
+
+.accordion > .card {
+  overflow: hidden;
+}
+.accordion > .card:not(:last-of-type) {
+  border-bottom: 0;
+}
+.accordion > .card > .card-header {
+  margin-bottom: -1px;
+}
+
+.breadcrumb {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  padding: 0.75rem 1rem;
+  margin-bottom: 1rem;
+  list-style: none;
+  background-color: #e9ecef;
+}
+
+.breadcrumb-item + .breadcrumb-item {
+  padding-left: 0.5rem;
+}
+.breadcrumb-item + .breadcrumb-item::before {
+  display: inline-block;
+  padding-right: 0.5rem;
+  color: #6c757d;
+  content: "/";
+}
+.breadcrumb-item + .breadcrumb-item:hover::before {
+  text-decoration: underline;
+}
+.breadcrumb-item + .breadcrumb-item:hover::before {
+  text-decoration: none;
+}
+.breadcrumb-item.active {
+  color: #6c757d;
+}
+
+.pagination {
+  display: -webkit-box;
+  display: flex;
+  padding-left: 0;
+  list-style: none;
+}
+
+.page-link {
+  position: relative;
+  display: block;
+  padding: 0.5rem 0.75rem;
+  margin-left: -1px;
+  line-height: 1.25;
+  color: #1b3d6e;
+  background-color: #fff;
+  border: 1px solid #dee2e6;
+}
+.page-link:hover {
+  z-index: 2;
+  color: #0c1b31;
+  text-decoration: none;
+  background-color: #e9ecef;
+  border-color: #dee2e6;
+}
+.page-link:focus {
+  z-index: 3;
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.25);
+}
+
+.page-item:first-child .page-link {
+  margin-left: 0;
+}
+.page-item.active .page-link {
+  z-index: 3;
+  color: #fff;
+  background-color: #1b3d6e;
+  border-color: #1b3d6e;
+}
+.page-item.disabled .page-link {
+  color: #6c757d;
+  pointer-events: none;
+  cursor: auto;
+  background-color: #fff;
+  border-color: #dee2e6;
+}
+
+.pagination-lg .page-link {
+  padding: 0.75rem 1.5rem;
+  font-size: 1.25rem;
+  line-height: 1.5;
+}
+.pagination-sm .page-link {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+}
+.badge {
+  display: inline-block;
+  padding: 0.25em 0.4em;
+  font-size: 75%;
+  font-weight: 700;
+  line-height: 1;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: baseline;
+  -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .badge {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+a.badge:hover, a.badge:focus {
+  text-decoration: none;
+}
+
+.badge:empty {
+  display: none;
+}
+
+.btn .badge {
+  position: relative;
+  top: -1px;
+}
+
+.badge-pill {
+  padding-right: 0.6em;
+  padding-left: 0.6em;
+}
+
+.badge-primary {
+  color: #fff;
+  background-color: #1b3d6e;
+}
+a.badge-primary:hover, a.badge-primary:focus {
+  color: #fff;
+  background-color: #112645;
+}
+a.badge-primary:focus, a.badge-primary.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(27, 61, 110, 0.5);
+}
+
+.badge-secondary {
+  color: #fff;
+  background-color: #f16824;
+}
+a.badge-secondary:hover, a.badge-secondary:focus {
+  color: #fff;
+  background-color: #d4500e;
+}
+a.badge-secondary:focus, a.badge-secondary.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(241, 104, 36, 0.5);
+}
+
+.badge-success {
+  color: #fff;
+  background-color: #28a745;
+}
+a.badge-success:hover, a.badge-success:focus {
+  color: #fff;
+  background-color: #1e7e34;
+}
+a.badge-success:focus, a.badge-success.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
+}
+
+.badge-info {
+  color: #fff;
+  background-color: #17a2b8;
+}
+a.badge-info:hover, a.badge-info:focus {
+  color: #fff;
+  background-color: #117a8b;
+}
+a.badge-info:focus, a.badge-info.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
+}
+
+.badge-warning {
+  color: #212529;
+  background-color: #ffc107;
+}
+a.badge-warning:hover, a.badge-warning:focus {
+  color: #212529;
+  background-color: #d39e00;
+}
+a.badge-warning:focus, a.badge-warning.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
+}
+
+.badge-danger {
+  color: #fff;
+  background-color: #dc3545;
+}
+a.badge-danger:hover, a.badge-danger:focus {
+  color: #fff;
+  background-color: #bd2130;
+}
+a.badge-danger:focus, a.badge-danger.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
+}
+
+.badge-light {
+  color: #212529;
+  background-color: #f8f9fa;
+}
+a.badge-light:hover, a.badge-light:focus {
+  color: #212529;
+  background-color: #dae0e5;
+}
+a.badge-light:focus, a.badge-light.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
+}
+
+.badge-dark {
+  color: #fff;
+  background-color: #343a40;
+}
+a.badge-dark:hover, a.badge-dark:focus {
+  color: #fff;
+  background-color: #1d2124;
+}
+a.badge-dark:focus, a.badge-dark.focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
+}
+
+.jumbotron {
+  padding: 2rem 1rem;
+  margin-bottom: 2rem;
+  background-color: #e9ecef;
+}
+@media (min-width: 576px) {
+  .jumbotron {
+    padding: 4rem 2rem;
+  }
+}
+
+.jumbotron-fluid {
+  padding-right: 0;
+  padding-left: 0;
+}
+
+.alert {
+  position: relative;
+  padding: 0.75rem 1.25rem;
+  margin-bottom: 1rem;
+  border: 1px solid transparent;
+}
+
+.alert-heading {
+  color: inherit;
+}
+
+.alert-link {
+  font-weight: 700;
+}
+
+.alert-dismissible {
+  padding-right: 4rem;
+}
+.alert-dismissible .close {
+  position: absolute;
+  top: 0;
+  right: 0;
+  padding: 0.75rem 1.25rem;
+  color: inherit;
+}
+
+.alert-primary {
+  color: #0e2039;
+  background-color: #d1d8e2;
+  border-color: #bfc9d6;
+}
+.alert-primary hr {
+  border-top-color: #afbccc;
+}
+.alert-primary .alert-link {
+  color: #040910;
+}
+
+.alert-secondary {
+  color: #7d3613;
+  background-color: #fce1d3;
+  border-color: #fbd5c2;
+}
+.alert-secondary hr {
+  border-top-color: #f9c5aa;
+}
+.alert-secondary .alert-link {
+  color: #51230c;
+}
+
+.alert-success {
+  color: #155724;
+  background-color: #d4edda;
+  border-color: #c3e6cb;
+}
+.alert-success hr {
+  border-top-color: #b1dfbb;
+}
+.alert-success .alert-link {
+  color: #0b2e13;
+}
+
+.alert-info {
+  color: #0c5460;
+  background-color: #d1ecf1;
+  border-color: #bee5eb;
+}
+.alert-info hr {
+  border-top-color: #abdde5;
+}
+.alert-info .alert-link {
+  color: #062c33;
+}
+
+.alert-warning {
+  color: #856404;
+  background-color: #fff3cd;
+  border-color: #ffeeba;
+}
+.alert-warning hr {
+  border-top-color: #ffe8a1;
+}
+.alert-warning .alert-link {
+  color: #533f03;
+}
+
+.alert-danger {
+  color: #721c24;
+  background-color: #f8d7da;
+  border-color: #f5c6cb;
+}
+.alert-danger hr {
+  border-top-color: #f1b0b7;
+}
+.alert-danger .alert-link {
+  color: #491217;
+}
+
+.alert-light {
+  color: #818182;
+  background-color: #fefefe;
+  border-color: #fdfdfe;
+}
+.alert-light hr {
+  border-top-color: #ececf6;
+}
+.alert-light .alert-link {
+  color: #686868;
+}
+
+.alert-dark {
+  color: #1b1e21;
+  background-color: #d6d8d9;
+  border-color: #c6c8ca;
+}
+.alert-dark hr {
+  border-top-color: #b9bbbe;
+}
+.alert-dark .alert-link {
+  color: #040505;
+}
+
+@-webkit-keyframes progress-bar-stripes {
+  from {
+    background-position: 1rem 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+
+@keyframes progress-bar-stripes {
+  from {
+    background-position: 1rem 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+.progress {
+  display: -webkit-box;
+  display: flex;
+  height: 1rem;
+  overflow: hidden;
+  font-size: 0.75rem;
+  background-color: #e9ecef;
+}
+
+.progress-bar {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  -webkit-box-pack: center;
+          justify-content: center;
+  overflow: hidden;
+  color: #fff;
+  text-align: center;
+  white-space: nowrap;
+  background-color: #1b3d6e;
+  -webkit-transition: width 0.6s ease;
+  transition: width 0.6s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .progress-bar {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+
+.progress-bar-striped {
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-size: 1rem 1rem;
+}
+
+.progress-bar-animated {
+  -webkit-animation: progress-bar-stripes 1s linear infinite;
+          animation: progress-bar-stripes 1s linear infinite;
+}
+@media (prefers-reduced-motion: reduce) {
+  .progress-bar-animated {
+    -webkit-animation: none;
+            animation: none;
+  }
+}
+
+.media {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-align: start;
+          align-items: flex-start;
+}
+
+.media-body {
+  -webkit-box-flex: 1;
+          flex: 1;
+}
+
+.list-group {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  padding-left: 0;
+  margin-bottom: 0;
+}
+
+.list-group-item-action {
+  width: 100%;
+  color: #495057;
+  text-align: inherit;
+}
+.list-group-item-action:hover, .list-group-item-action:focus {
+  z-index: 1;
+  color: #495057;
+  text-decoration: none;
+  background-color: #f8f9fa;
+}
+.list-group-item-action:active {
+  color: #212529;
+  background-color: #e9ecef;
+}
+
+.list-group-item {
+  position: relative;
+  display: block;
+  padding: 0.75rem 1.25rem;
+  background-color: #fff;
+  border: 1px solid rgba(0, 0, 0, 0.125);
+}
+.list-group-item.disabled, .list-group-item:disabled {
+  color: #6c757d;
+  pointer-events: none;
+  background-color: #fff;
+}
+.list-group-item.active {
+  z-index: 2;
+  color: #fff;
+  background-color: #1b3d6e;
+  border-color: #1b3d6e;
+}
+.list-group-item + .list-group-item {
+  border-top-width: 0;
+}
+.list-group-item + .list-group-item.active {
+  margin-top: -1px;
+  border-top-width: 1px;
+}
+
+.list-group-horizontal {
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+          flex-direction: row;
+}
+.list-group-horizontal .list-group-item.active {
+  margin-top: 0;
+}
+.list-group-horizontal .list-group-item + .list-group-item {
+  border-top-width: 1px;
+  border-left-width: 0;
+}
+.list-group-horizontal .list-group-item + .list-group-item.active {
+  margin-left: -1px;
+  border-left-width: 1px;
+}
+
+@media (min-width: 576px) {
+  .list-group-horizontal-sm {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-direction: row;
+  }
+  .list-group-horizontal-sm .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-sm .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-sm .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+@media (min-width: 768px) {
+  .list-group-horizontal-md {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-direction: row;
+  }
+  .list-group-horizontal-md .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-md .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-md .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+@media (min-width: 992px) {
+  .list-group-horizontal-lg {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-direction: row;
+  }
+  .list-group-horizontal-lg .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-lg .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-lg .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+@media (min-width: 1200px) {
+  .list-group-horizontal-xl {
+    -webkit-box-orient: horizontal;
+    -webkit-box-direction: normal;
+            flex-direction: row;
+  }
+  .list-group-horizontal-xl .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-xl .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-xl .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+.list-group-flush .list-group-item {
+  border-right-width: 0;
+  border-left-width: 0;
+}
+.list-group-flush .list-group-item:first-child {
+  border-top-width: 0;
+}
+.list-group-flush:last-child .list-group-item:last-child {
+  border-bottom-width: 0;
+}
+
+.list-group-item-primary {
+  color: #0e2039;
+  background-color: #bfc9d6;
+}
+.list-group-item-primary.list-group-item-action:hover, .list-group-item-primary.list-group-item-action:focus {
+  color: #0e2039;
+  background-color: #afbccc;
+}
+.list-group-item-primary.list-group-item-action.active {
+  color: #fff;
+  background-color: #0e2039;
+  border-color: #0e2039;
+}
+
+.list-group-item-secondary {
+  color: #7d3613;
+  background-color: #fbd5c2;
+}
+.list-group-item-secondary.list-group-item-action:hover, .list-group-item-secondary.list-group-item-action:focus {
+  color: #7d3613;
+  background-color: #f9c5aa;
+}
+.list-group-item-secondary.list-group-item-action.active {
+  color: #fff;
+  background-color: #7d3613;
+  border-color: #7d3613;
+}
+
+.list-group-item-success {
+  color: #155724;
+  background-color: #c3e6cb;
+}
+.list-group-item-success.list-group-item-action:hover, .list-group-item-success.list-group-item-action:focus {
+  color: #155724;
+  background-color: #b1dfbb;
+}
+.list-group-item-success.list-group-item-action.active {
+  color: #fff;
+  background-color: #155724;
+  border-color: #155724;
+}
+
+.list-group-item-info {
+  color: #0c5460;
+  background-color: #bee5eb;
+}
+.list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus {
+  color: #0c5460;
+  background-color: #abdde5;
+}
+.list-group-item-info.list-group-item-action.active {
+  color: #fff;
+  background-color: #0c5460;
+  border-color: #0c5460;
+}
+
+.list-group-item-warning {
+  color: #856404;
+  background-color: #ffeeba;
+}
+.list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus {
+  color: #856404;
+  background-color: #ffe8a1;
+}
+.list-group-item-warning.list-group-item-action.active {
+  color: #fff;
+  background-color: #856404;
+  border-color: #856404;
+}
+
+.list-group-item-danger {
+  color: #721c24;
+  background-color: #f5c6cb;
+}
+.list-group-item-danger.list-group-item-action:hover, .list-group-item-danger.list-group-item-action:focus {
+  color: #721c24;
+  background-color: #f1b0b7;
+}
+.list-group-item-danger.list-group-item-action.active {
+  color: #fff;
+  background-color: #721c24;
+  border-color: #721c24;
+}
+
+.list-group-item-light {
+  color: #818182;
+  background-color: #fdfdfe;
+}
+.list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus {
+  color: #818182;
+  background-color: #ececf6;
+}
+.list-group-item-light.list-group-item-action.active {
+  color: #fff;
+  background-color: #818182;
+  border-color: #818182;
+}
+
+.list-group-item-dark {
+  color: #1b1e21;
+  background-color: #c6c8ca;
+}
+.list-group-item-dark.list-group-item-action:hover, .list-group-item-dark.list-group-item-action:focus {
+  color: #1b1e21;
+  background-color: #b9bbbe;
+}
+.list-group-item-dark.list-group-item-action.active {
+  color: #fff;
+  background-color: #1b1e21;
+  border-color: #1b1e21;
+}
+
+.close {
+  float: right;
+  font-size: 1.5rem;
+  font-weight: 700;
+  line-height: 1;
+  color: #000;
+  text-shadow: 0 1px 0 #fff;
+  opacity: 0.5;
+}
+.close:hover {
+  color: #000;
+  text-decoration: none;
+}
+.close:not(:disabled):not(.disabled):hover, .close:not(:disabled):not(.disabled):focus {
+  opacity: 0.75;
+}
+
+button.close {
+  padding: 0;
+  background-color: transparent;
+  border: 0;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+}
+
+a.close.disabled {
+  pointer-events: none;
+}
+
+.toast {
+  max-width: 350px;
+  overflow: hidden;
+  font-size: 0.875rem;
+  background-color: rgba(255, 255, 255, 0.85);
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1);
+  -webkit-backdrop-filter: blur(10px);
+          backdrop-filter: blur(10px);
+  opacity: 0;
+}
+.toast:not(:last-child) {
+  margin-bottom: 0.75rem;
+}
+.toast.showing {
+  opacity: 1;
+}
+.toast.show {
+  display: block;
+  opacity: 1;
+}
+.toast.hide {
+  display: none;
+}
+
+.toast-header {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-align: center;
+          align-items: center;
+  padding: 0.25rem 0.75rem;
+  color: #6c757d;
+  background-color: rgba(255, 255, 255, 0.85);
+  background-clip: padding-box;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+}
+
+.toast-body {
+  padding: 0.75rem;
+}
+
+.modal-open {
+  overflow: hidden;
+}
+.modal-open .modal {
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+
+.modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1050;
+  display: none;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  outline: 0;
+}
+
+.modal-dialog {
+  position: relative;
+  width: auto;
+  margin: 0.5rem;
+  pointer-events: none;
+}
+.modal.fade .modal-dialog {
+  -webkit-transition: -webkit-transform 0.3s ease-out;
+  transition: -webkit-transform 0.3s ease-out;
+  transition: transform 0.3s ease-out;
+  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
+  -webkit-transform: translate(0, -50px);
+          transform: translate(0, -50px);
+}
+@media (prefers-reduced-motion: reduce) {
+  .modal.fade .modal-dialog {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.modal.show .modal-dialog {
+  -webkit-transform: none;
+          transform: none;
+}
+.modal.modal-static .modal-dialog {
+  -webkit-transform: scale(1.02);
+          transform: scale(1.02);
+}
+
+.modal-dialog-scrollable {
+  display: -webkit-box;
+  display: flex;
+  max-height: calc(100% - 1rem);
+}
+.modal-dialog-scrollable .modal-content {
+  max-height: calc(100vh - 1rem);
+  overflow: hidden;
+}
+.modal-dialog-scrollable .modal-header,
+.modal-dialog-scrollable .modal-footer {
+  flex-shrink: 0;
+}
+.modal-dialog-scrollable .modal-body {
+  overflow-y: auto;
+}
+
+.modal-dialog-centered {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-align: center;
+          align-items: center;
+  min-height: calc(100% - 1rem);
+}
+.modal-dialog-centered::before {
+  display: block;
+  height: calc(100vh - 1rem);
+  content: "";
+}
+.modal-dialog-centered.modal-dialog-scrollable {
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  -webkit-box-pack: center;
+          justify-content: center;
+  height: 100%;
+}
+.modal-dialog-centered.modal-dialog-scrollable .modal-content {
+  max-height: none;
+}
+.modal-dialog-centered.modal-dialog-scrollable::before {
+  content: none;
+}
+
+.modal-content {
+  position: relative;
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  width: 100%;
+  pointer-events: auto;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  outline: 0;
+}
+
+.modal-backdrop {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1040;
+  width: 100vw;
+  height: 100vh;
+  background-color: #000;
+}
+.modal-backdrop.fade {
+  opacity: 0;
+}
+.modal-backdrop.show {
+  opacity: 0.5;
+}
+
+.modal-header {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-align: start;
+          align-items: flex-start;
+  -webkit-box-pack: justify;
+          justify-content: space-between;
+  padding: 1rem 1rem;
+  border-bottom: 1px solid #dee2e6;
+}
+.modal-header .close {
+  padding: 1rem 1rem;
+  margin: -1rem -1rem -1rem auto;
+}
+
+.modal-title {
+  margin-bottom: 0;
+  line-height: 1.5;
+}
+
+.modal-body {
+  position: relative;
+  -webkit-box-flex: 1;
+          flex: 1 1 auto;
+  padding: 1rem;
+}
+
+.modal-footer {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  -webkit-box-align: center;
+          align-items: center;
+  -webkit-box-pack: end;
+          justify-content: flex-end;
+  padding: 0.75rem;
+  border-top: 1px solid #dee2e6;
+}
+.modal-footer > * {
+  margin: 0.25rem;
+}
+
+.modal-scrollbar-measure {
+  position: absolute;
+  top: -9999px;
+  width: 50px;
+  height: 50px;
+  overflow: scroll;
+}
+
+@media (min-width: 576px) {
+  .modal-dialog {
+    max-width: 500px;
+    margin: 1.75rem auto;
+  }
+
+  .modal-dialog-scrollable {
+    max-height: calc(100% - 3.5rem);
+  }
+  .modal-dialog-scrollable .modal-content {
+    max-height: calc(100vh - 3.5rem);
+  }
+
+  .modal-dialog-centered {
+    min-height: calc(100% - 3.5rem);
+  }
+  .modal-dialog-centered::before {
+    height: calc(100vh - 3.5rem);
+  }
+
+  .modal-sm {
+    max-width: 300px;
+  }
+}
+@media (min-width: 992px) {
+  .modal-lg,
+.modal-xl {
+    max-width: 800px;
+  }
+}
+@media (min-width: 1200px) {
+  .modal-xl {
+    max-width: 1140px;
+  }
+}
+.tooltip {
+  position: absolute;
+  z-index: 1070;
+  display: block;
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-style: normal;
+  font-weight: 400;
+  line-height: 1.5;
+  text-align: left;
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  letter-spacing: normal;
+  word-break: normal;
+  word-spacing: normal;
+  white-space: normal;
+  line-break: auto;
+  font-size: 0.875rem;
+  word-wrap: break-word;
+  opacity: 0;
+}
+.tooltip.show {
+  opacity: 0.9;
+}
+.tooltip .arrow {
+  position: absolute;
+  display: block;
+  width: 0.8rem;
+  height: 0.4rem;
+}
+.tooltip .arrow::before {
+  position: absolute;
+  content: "";
+  border-color: transparent;
+  border-style: solid;
+}
+
+.bs-tooltip-top, .bs-tooltip-auto[x-placement^=top] {
+  padding: 0.4rem 0;
+}
+.bs-tooltip-top .arrow, .bs-tooltip-auto[x-placement^=top] .arrow {
+  bottom: 0;
+}
+.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^=top] .arrow::before {
+  top: 0;
+  border-width: 0.4rem 0.4rem 0;
+  border-top-color: #000;
+}
+
+.bs-tooltip-right, .bs-tooltip-auto[x-placement^=right] {
+  padding: 0 0.4rem;
+}
+.bs-tooltip-right .arrow, .bs-tooltip-auto[x-placement^=right] .arrow {
+  left: 0;
+  width: 0.4rem;
+  height: 0.8rem;
+}
+.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^=right] .arrow::before {
+  right: 0;
+  border-width: 0.4rem 0.4rem 0.4rem 0;
+  border-right-color: #000;
+}
+
+.bs-tooltip-bottom, .bs-tooltip-auto[x-placement^=bottom] {
+  padding: 0.4rem 0;
+}
+.bs-tooltip-bottom .arrow, .bs-tooltip-auto[x-placement^=bottom] .arrow {
+  top: 0;
+}
+.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^=bottom] .arrow::before {
+  bottom: 0;
+  border-width: 0 0.4rem 0.4rem;
+  border-bottom-color: #000;
+}
+
+.bs-tooltip-left, .bs-tooltip-auto[x-placement^=left] {
+  padding: 0 0.4rem;
+}
+.bs-tooltip-left .arrow, .bs-tooltip-auto[x-placement^=left] .arrow {
+  right: 0;
+  width: 0.4rem;
+  height: 0.8rem;
+}
+.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^=left] .arrow::before {
+  left: 0;
+  border-width: 0.4rem 0 0.4rem 0.4rem;
+  border-left-color: #000;
+}
+
+.tooltip-inner {
+  max-width: 200px;
+  padding: 0.25rem 0.5rem;
+  color: #fff;
+  text-align: center;
+  background-color: #000;
+}
+
+.popover {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1060;
+  display: block;
+  max-width: 276px;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-style: normal;
+  font-weight: 400;
+  line-height: 1.5;
+  text-align: left;
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  letter-spacing: normal;
+  word-break: normal;
+  word-spacing: normal;
+  white-space: normal;
+  line-break: auto;
+  font-size: 0.875rem;
+  word-wrap: break-word;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+}
+.popover .arrow {
+  position: absolute;
+  display: block;
+  width: 1rem;
+  height: 0.5rem;
+  margin: 0 0.3rem;
+}
+.popover .arrow::before, .popover .arrow::after {
+  position: absolute;
+  display: block;
+  content: "";
+  border-color: transparent;
+  border-style: solid;
+}
+
+.bs-popover-top, .bs-popover-auto[x-placement^=top] {
+  margin-bottom: 0.5rem;
+}
+.bs-popover-top > .arrow, .bs-popover-auto[x-placement^=top] > .arrow {
+  bottom: calc(-0.5rem - 1px);
+}
+.bs-popover-top > .arrow::before, .bs-popover-auto[x-placement^=top] > .arrow::before {
+  bottom: 0;
+  border-width: 0.5rem 0.5rem 0;
+  border-top-color: rgba(0, 0, 0, 0.25);
+}
+.bs-popover-top > .arrow::after, .bs-popover-auto[x-placement^=top] > .arrow::after {
+  bottom: 1px;
+  border-width: 0.5rem 0.5rem 0;
+  border-top-color: #fff;
+}
+
+.bs-popover-right, .bs-popover-auto[x-placement^=right] {
+  margin-left: 0.5rem;
+}
+.bs-popover-right > .arrow, .bs-popover-auto[x-placement^=right] > .arrow {
+  left: calc(-0.5rem - 1px);
+  width: 0.5rem;
+  height: 1rem;
+  margin: 0.3rem 0;
+}
+.bs-popover-right > .arrow::before, .bs-popover-auto[x-placement^=right] > .arrow::before {
+  left: 0;
+  border-width: 0.5rem 0.5rem 0.5rem 0;
+  border-right-color: rgba(0, 0, 0, 0.25);
+}
+.bs-popover-right > .arrow::after, .bs-popover-auto[x-placement^=right] > .arrow::after {
+  left: 1px;
+  border-width: 0.5rem 0.5rem 0.5rem 0;
+  border-right-color: #fff;
+}
+
+.bs-popover-bottom, .bs-popover-auto[x-placement^=bottom] {
+  margin-top: 0.5rem;
+}
+.bs-popover-bottom > .arrow, .bs-popover-auto[x-placement^=bottom] > .arrow {
+  top: calc(-0.5rem - 1px);
+}
+.bs-popover-bottom > .arrow::before, .bs-popover-auto[x-placement^=bottom] > .arrow::before {
+  top: 0;
+  border-width: 0 0.5rem 0.5rem 0.5rem;
+  border-bottom-color: rgba(0, 0, 0, 0.25);
+}
+.bs-popover-bottom > .arrow::after, .bs-popover-auto[x-placement^=bottom] > .arrow::after {
+  top: 1px;
+  border-width: 0 0.5rem 0.5rem 0.5rem;
+  border-bottom-color: #fff;
+}
+.bs-popover-bottom .popover-header::before, .bs-popover-auto[x-placement^=bottom] .popover-header::before {
+  position: absolute;
+  top: 0;
+  left: 50%;
+  display: block;
+  width: 1rem;
+  margin-left: -0.5rem;
+  content: "";
+  border-bottom: 1px solid #f7f7f7;
+}
+
+.bs-popover-left, .bs-popover-auto[x-placement^=left] {
+  margin-right: 0.5rem;
+}
+.bs-popover-left > .arrow, .bs-popover-auto[x-placement^=left] > .arrow {
+  right: calc(-0.5rem - 1px);
+  width: 0.5rem;
+  height: 1rem;
+  margin: 0.3rem 0;
+}
+.bs-popover-left > .arrow::before, .bs-popover-auto[x-placement^=left] > .arrow::before {
+  right: 0;
+  border-width: 0.5rem 0 0.5rem 0.5rem;
+  border-left-color: rgba(0, 0, 0, 0.25);
+}
+.bs-popover-left > .arrow::after, .bs-popover-auto[x-placement^=left] > .arrow::after {
+  right: 1px;
+  border-width: 0.5rem 0 0.5rem 0.5rem;
+  border-left-color: #fff;
+}
+
+.popover-header {
+  padding: 0.5rem 0.75rem;
+  margin-bottom: 0;
+  font-size: 1rem;
+  background-color: #f7f7f7;
+  border-bottom: 1px solid #ebebeb;
+}
+.popover-header:empty {
+  display: none;
+}
+
+.popover-body {
+  padding: 0.5rem 0.75rem;
+  color: #212529;
+}
+
+.carousel {
+  position: relative;
+}
+
+.carousel.pointer-event {
+  touch-action: pan-y;
+}
+
+.carousel-inner {
+  position: relative;
+  width: 100%;
+  overflow: hidden;
+}
+.carousel-inner::after {
+  display: block;
+  clear: both;
+  content: "";
+}
+
+.carousel-item {
+  position: relative;
+  display: none;
+  float: left;
+  width: 100%;
+  margin-right: -100%;
+  -webkit-backface-visibility: hidden;
+          backface-visibility: hidden;
+  -webkit-transition: -webkit-transform 0.6s ease-in-out;
+  transition: -webkit-transform 0.6s ease-in-out;
+  transition: transform 0.6s ease-in-out;
+  transition: transform 0.6s ease-in-out, -webkit-transform 0.6s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .carousel-item {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+
+.carousel-item.active,
+.carousel-item-next,
+.carousel-item-prev {
+  display: block;
+}
+
+.carousel-item-next:not(.carousel-item-left),
+.active.carousel-item-right {
+  -webkit-transform: translateX(100%);
+          transform: translateX(100%);
+}
+
+.carousel-item-prev:not(.carousel-item-right),
+.active.carousel-item-left {
+  -webkit-transform: translateX(-100%);
+          transform: translateX(-100%);
+}
+
+.carousel-fade .carousel-item {
+  opacity: 0;
+  -webkit-transition-property: opacity;
+  transition-property: opacity;
+  -webkit-transform: none;
+          transform: none;
+}
+.carousel-fade .carousel-item.active,
+.carousel-fade .carousel-item-next.carousel-item-left,
+.carousel-fade .carousel-item-prev.carousel-item-right {
+  z-index: 1;
+  opacity: 1;
+}
+.carousel-fade .active.carousel-item-left,
+.carousel-fade .active.carousel-item-right {
+  z-index: 0;
+  opacity: 0;
+  -webkit-transition: opacity 0s 0.6s;
+  transition: opacity 0s 0.6s;
+}
+@media (prefers-reduced-motion: reduce) {
+  .carousel-fade .active.carousel-item-left,
+.carousel-fade .active.carousel-item-right {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+
+.carousel-control-prev,
+.carousel-control-next {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  z-index: 1;
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+          justify-content: center;
+  width: 15%;
+  color: #fff;
+  text-align: center;
+  opacity: 0.5;
+  -webkit-transition: opacity 0.15s ease;
+  transition: opacity 0.15s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .carousel-control-prev,
+.carousel-control-next {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.carousel-control-prev:hover, .carousel-control-prev:focus,
+.carousel-control-next:hover,
+.carousel-control-next:focus {
+  color: #fff;
+  text-decoration: none;
+  outline: 0;
+  opacity: 0.9;
+}
+
+.carousel-control-prev {
+  left: 0;
+}
+
+.carousel-control-next {
+  right: 0;
+}
+
+.carousel-control-prev-icon,
+.carousel-control-next-icon {
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  background: no-repeat 50%/100% 100%;
+}
+
+.carousel-control-prev-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
+}
+
+.carousel-control-next-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
+}
+
+.carousel-indicators {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 15;
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-pack: center;
+          justify-content: center;
+  padding-left: 0;
+  margin-right: 15%;
+  margin-left: 15%;
+  list-style: none;
+}
+.carousel-indicators li {
+  box-sizing: content-box;
+  -webkit-box-flex: 0;
+          flex: 0 1 auto;
+  width: 30px;
+  height: 3px;
+  margin-right: 3px;
+  margin-left: 3px;
+  text-indent: -999px;
+  cursor: pointer;
+  background-color: #fff;
+  background-clip: padding-box;
+  border-top: 10px solid transparent;
+  border-bottom: 10px solid transparent;
+  opacity: 0.5;
+  -webkit-transition: opacity 0.6s ease;
+  transition: opacity 0.6s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .carousel-indicators li {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.carousel-indicators .active {
+  opacity: 1;
+}
+
+.carousel-caption {
+  position: absolute;
+  right: 15%;
+  bottom: 20px;
+  left: 15%;
+  z-index: 10;
+  padding-top: 20px;
+  padding-bottom: 20px;
+  color: #fff;
+  text-align: center;
+}
+
+@-webkit-keyframes spinner-border {
+  to {
+    -webkit-transform: rotate(360deg);
+            transform: rotate(360deg);
+  }
+}
+
+@keyframes spinner-border {
+  to {
+    -webkit-transform: rotate(360deg);
+            transform: rotate(360deg);
+  }
+}
+.spinner-border {
+  display: inline-block;
+  width: 2rem;
+  height: 2rem;
+  vertical-align: text-bottom;
+  border: 0.25em solid currentColor;
+  border-right-color: transparent;
+  border-radius: 50%;
+  -webkit-animation: spinner-border 0.75s linear infinite;
+          animation: spinner-border 0.75s linear infinite;
+}
+
+.spinner-border-sm {
+  width: 1rem;
+  height: 1rem;
+  border-width: 0.2em;
+}
+
+@-webkit-keyframes spinner-grow {
+  0% {
+    -webkit-transform: scale(0);
+            transform: scale(0);
+  }
+  50% {
+    opacity: 1;
+  }
+}
+
+@keyframes spinner-grow {
+  0% {
+    -webkit-transform: scale(0);
+            transform: scale(0);
+  }
+  50% {
+    opacity: 1;
+  }
+}
+.spinner-grow {
+  display: inline-block;
+  width: 2rem;
+  height: 2rem;
+  vertical-align: text-bottom;
+  background-color: currentColor;
+  border-radius: 50%;
+  opacity: 0;
+  -webkit-animation: spinner-grow 0.75s linear infinite;
+          animation: spinner-grow 0.75s linear infinite;
+}
+
+.spinner-grow-sm {
+  width: 1rem;
+  height: 1rem;
+}
+
+.align-baseline {
+  vertical-align: baseline !important;
+}
+
+.align-top {
+  vertical-align: top !important;
+}
+
+.align-middle {
+  vertical-align: middle !important;
+}
+
+.align-bottom {
+  vertical-align: bottom !important;
+}
+
+.align-text-bottom {
+  vertical-align: text-bottom !important;
+}
+
+.align-text-top {
+  vertical-align: text-top !important;
+}
+
+.bg-primary {
+  background-color: #1b3d6e !important;
+}
+
+a.bg-primary:hover, a.bg-primary:focus,
+button.bg-primary:hover,
+button.bg-primary:focus {
+  background-color: #112645 !important;
+}
+
+.bg-secondary {
+  background-color: #f16824 !important;
+}
+
+a.bg-secondary:hover, a.bg-secondary:focus,
+button.bg-secondary:hover,
+button.bg-secondary:focus {
+  background-color: #d4500e !important;
+}
+
+.bg-success {
+  background-color: #28a745 !important;
+}
+
+a.bg-success:hover, a.bg-success:focus,
+button.bg-success:hover,
+button.bg-success:focus {
+  background-color: #1e7e34 !important;
+}
+
+.bg-info {
+  background-color: #17a2b8 !important;
+}
+
+a.bg-info:hover, a.bg-info:focus,
+button.bg-info:hover,
+button.bg-info:focus {
+  background-color: #117a8b !important;
+}
+
+.bg-warning {
+  background-color: #ffc107 !important;
+}
+
+a.bg-warning:hover, a.bg-warning:focus,
+button.bg-warning:hover,
+button.bg-warning:focus {
+  background-color: #d39e00 !important;
+}
+
+.bg-danger {
+  background-color: #dc3545 !important;
+}
+
+a.bg-danger:hover, a.bg-danger:focus,
+button.bg-danger:hover,
+button.bg-danger:focus {
+  background-color: #bd2130 !important;
+}
+
+.bg-light {
+  background-color: #f8f9fa !important;
+}
+
+a.bg-light:hover, a.bg-light:focus,
+button.bg-light:hover,
+button.bg-light:focus {
+  background-color: #dae0e5 !important;
+}
+
+.bg-dark {
+  background-color: #343a40 !important;
+}
+
+a.bg-dark:hover, a.bg-dark:focus,
+button.bg-dark:hover,
+button.bg-dark:focus {
+  background-color: #1d2124 !important;
+}
+
+.bg-white {
+  background-color: #fff !important;
+}
+
+.bg-transparent {
+  background-color: transparent !important;
+}
+
+.border {
+  border: 1px solid #dee2e6 !important;
+}
+
+.border-top {
+  border-top: 1px solid #dee2e6 !important;
+}
+
+.border-right {
+  border-right: 1px solid #dee2e6 !important;
+}
+
+.border-bottom {
+  border-bottom: 1px solid #dee2e6 !important;
+}
+
+.border-left {
+  border-left: 1px solid #dee2e6 !important;
+}
+
+.border-0 {
+  border: 0 !important;
+}
+
+.border-top-0 {
+  border-top: 0 !important;
+}
+
+.border-right-0 {
+  border-right: 0 !important;
+}
+
+.border-bottom-0 {
+  border-bottom: 0 !important;
+}
+
+.border-left-0 {
+  border-left: 0 !important;
+}
+
+.border-primary {
+  border-color: #1b3d6e !important;
+}
+
+.border-secondary {
+  border-color: #f16824 !important;
+}
+
+.border-success {
+  border-color: #28a745 !important;
+}
+
+.border-info {
+  border-color: #17a2b8 !important;
+}
+
+.border-warning {
+  border-color: #ffc107 !important;
+}
+
+.border-danger {
+  border-color: #dc3545 !important;
+}
+
+.border-light {
+  border-color: #f8f9fa !important;
+}
+
+.border-dark {
+  border-color: #343a40 !important;
+}
+
+.border-white {
+  border-color: #fff !important;
+}
+
+.rounded-sm {
+  border-radius: 0.2rem !important;
+}
+
+.rounded {
+  border-radius: 0.25rem !important;
+}
+
+.rounded-top {
+  border-top-left-radius: 0.25rem !important;
+  border-top-right-radius: 0.25rem !important;
+}
+
+.rounded-right {
+  border-top-right-radius: 0.25rem !important;
+  border-bottom-right-radius: 0.25rem !important;
+}
+
+.rounded-bottom {
+  border-bottom-right-radius: 0.25rem !important;
+  border-bottom-left-radius: 0.25rem !important;
+}
+
+.rounded-left {
+  border-top-left-radius: 0.25rem !important;
+  border-bottom-left-radius: 0.25rem !important;
+}
+
+.rounded-lg {
+  border-radius: 0.3rem !important;
+}
+
+.rounded-circle {
+  border-radius: 50% !important;
+}
+
+.rounded-pill {
+  border-radius: 50rem !important;
+}
+
+.rounded-0 {
+  border-radius: 0 !important;
+}
+
+.clearfix::after {
+  display: block;
+  clear: both;
+  content: "";
+}
+
+.d-none {
+  display: none !important;
+}
+
+.d-inline {
+  display: inline !important;
+}
+
+.d-inline-block {
+  display: inline-block !important;
+}
+
+.d-block {
+  display: block !important;
+}
+
+.d-table {
+  display: table !important;
+}
+
+.d-table-row {
+  display: table-row !important;
+}
+
+.d-table-cell {
+  display: table-cell !important;
+}
+
+.d-flex {
+  display: -webkit-box !important;
+  display: flex !important;
+}
+
+.d-inline-flex {
+  display: -webkit-inline-box !important;
+  display: inline-flex !important;
+}
+
+@media (min-width: 576px) {
+  .d-sm-none {
+    display: none !important;
+  }
+
+  .d-sm-inline {
+    display: inline !important;
+  }
+
+  .d-sm-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-sm-block {
+    display: block !important;
+  }
+
+  .d-sm-table {
+    display: table !important;
+  }
+
+  .d-sm-table-row {
+    display: table-row !important;
+  }
+
+  .d-sm-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-sm-flex {
+    display: -webkit-box !important;
+    display: flex !important;
+  }
+
+  .d-sm-inline-flex {
+    display: -webkit-inline-box !important;
+    display: inline-flex !important;
+  }
+}
+@media (min-width: 768px) {
+  .d-md-none {
+    display: none !important;
+  }
+
+  .d-md-inline {
+    display: inline !important;
+  }
+
+  .d-md-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-md-block {
+    display: block !important;
+  }
+
+  .d-md-table {
+    display: table !important;
+  }
+
+  .d-md-table-row {
+    display: table-row !important;
+  }
+
+  .d-md-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-md-flex {
+    display: -webkit-box !important;
+    display: flex !important;
+  }
+
+  .d-md-inline-flex {
+    display: -webkit-inline-box !important;
+    display: inline-flex !important;
+  }
+}
+@media (min-width: 992px) {
+  .d-lg-none {
+    display: none !important;
+  }
+
+  .d-lg-inline {
+    display: inline !important;
+  }
+
+  .d-lg-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-lg-block {
+    display: block !important;
+  }
+
+  .d-lg-table {
+    display: table !important;
+  }
+
+  .d-lg-table-row {
+    display: table-row !important;
+  }
+
+  .d-lg-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-lg-flex {
+    display: -webkit-box !important;
+    display: flex !important;
+  }
+
+  .d-lg-inline-flex {
+    display: -webkit-inline-box !important;
+    display: inline-flex !important;
+  }
+}
+@media (min-width: 1200px) {
+  .d-xl-none {
+    display: none !important;
+  }
+
+  .d-xl-inline {
+    display: inline !important;
+  }
+
+  .d-xl-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-xl-block {
+    display: block !important;
+  }
+
+  .d-xl-table {
+    display: table !important;
+  }
+
+  .d-xl-table-row {
+    display: table-row !important;
+  }
+
+  .d-xl-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-xl-flex {
+    display: -webkit-box !important;
+    display: flex !important;
+  }
+
+  .d-xl-inline-flex {
+    display: -webkit-inline-box !important;
+    display: inline-flex !important;
+  }
+}
+@media print {
+  .d-print-none {
+    display: none !important;
+  }
+
+  .d-print-inline {
+    display: inline !important;
+  }
+
+  .d-print-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-print-block {
+    display: block !important;
+  }
+
+  .d-print-table {
+    display: table !important;
+  }
+
+  .d-print-table-row {
+    display: table-row !important;
+  }
+
+  .d-print-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-print-flex {
+    display: -webkit-box !important;
+    display: flex !important;
+  }
+
+  .d-print-inline-flex {
+    display: -webkit-inline-box !important;
+    display: inline-flex !important;
+  }
+}
+.embed-responsive {
+  position: relative;
+  display: block;
+  width: 100%;
+  padding: 0;
+  overflow: hidden;
+}
+.embed-responsive::before {
+  display: block;
+  content: "";
+}
+.embed-responsive .embed-responsive-item,
+.embed-responsive iframe,
+.embed-responsive embed,
+.embed-responsive object,
+.embed-responsive video {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  border: 0;
+}
+
+.embed-responsive-21by9::before {
+  padding-top: 42.8571428571%;
+}
+
+.embed-responsive-16by9::before {
+  padding-top: 56.25%;
+}
+
+.embed-responsive-4by3::before {
+  padding-top: 75%;
+}
+
+.embed-responsive-1by1::before {
+  padding-top: 100%;
+}
+
+.flex-row {
+  -webkit-box-orient: horizontal !important;
+  -webkit-box-direction: normal !important;
+          flex-direction: row !important;
+}
+
+.flex-column {
+  -webkit-box-orient: vertical !important;
+  -webkit-box-direction: normal !important;
+          flex-direction: column !important;
+}
+
+.flex-row-reverse {
+  -webkit-box-orient: horizontal !important;
+  -webkit-box-direction: reverse !important;
+          flex-direction: row-reverse !important;
+}
+
+.flex-column-reverse {
+  -webkit-box-orient: vertical !important;
+  -webkit-box-direction: reverse !important;
+          flex-direction: column-reverse !important;
+}
+
+.flex-wrap {
+  flex-wrap: wrap !important;
+}
+
+.flex-nowrap {
+  flex-wrap: nowrap !important;
+}
+
+.flex-wrap-reverse {
+  flex-wrap: wrap-reverse !important;
+}
+
+.flex-fill {
+  -webkit-box-flex: 1 !important;
+          flex: 1 1 auto !important;
+}
+
+.flex-grow-0 {
+  -webkit-box-flex: 0 !important;
+          flex-grow: 0 !important;
+}
+
+.flex-grow-1 {
+  -webkit-box-flex: 1 !important;
+          flex-grow: 1 !important;
+}
+
+.flex-shrink-0 {
+  flex-shrink: 0 !important;
+}
+
+.flex-shrink-1 {
+  flex-shrink: 1 !important;
+}
+
+.justify-content-start {
+  -webkit-box-pack: start !important;
+          justify-content: flex-start !important;
+}
+
+.justify-content-end {
+  -webkit-box-pack: end !important;
+          justify-content: flex-end !important;
+}
+
+.justify-content-center {
+  -webkit-box-pack: center !important;
+          justify-content: center !important;
+}
+
+.justify-content-between {
+  -webkit-box-pack: justify !important;
+          justify-content: space-between !important;
+}
+
+.justify-content-around {
+  justify-content: space-around !important;
+}
+
+.align-items-start {
+  -webkit-box-align: start !important;
+          align-items: flex-start !important;
+}
+
+.align-items-end {
+  -webkit-box-align: end !important;
+          align-items: flex-end !important;
+}
+
+.align-items-center {
+  -webkit-box-align: center !important;
+          align-items: center !important;
+}
+
+.align-items-baseline {
+  -webkit-box-align: baseline !important;
+          align-items: baseline !important;
+}
+
+.align-items-stretch {
+  -webkit-box-align: stretch !important;
+          align-items: stretch !important;
+}
+
+.align-content-start {
+  align-content: flex-start !important;
+}
+
+.align-content-end {
+  align-content: flex-end !important;
+}
+
+.align-content-center {
+  align-content: center !important;
+}
+
+.align-content-between {
+  align-content: space-between !important;
+}
+
+.align-content-around {
+  align-content: space-around !important;
+}
+
+.align-content-stretch {
+  align-content: stretch !important;
+}
+
+.align-self-auto {
+  align-self: auto !important;
+}
+
+.align-self-start {
+  align-self: flex-start !important;
+}
+
+.align-self-end {
+  align-self: flex-end !important;
+}
+
+.align-self-center {
+  align-self: center !important;
+}
+
+.align-self-baseline {
+  align-self: baseline !important;
+}
+
+.align-self-stretch {
+  align-self: stretch !important;
+}
+
+@media (min-width: 576px) {
+  .flex-sm-row {
+    -webkit-box-orient: horizontal !important;
+    -webkit-box-direction: normal !important;
+            flex-direction: row !important;
+  }
+
+  .flex-sm-column {
+    -webkit-box-orient: vertical !important;
+    -webkit-box-direction: normal !important;
+            flex-direction: column !important;
+  }
+
+  .flex-sm-row-reverse {
+    -webkit-box-orient: horizontal !important;
+    -webkit-box-direction: reverse !important;
+            flex-direction: row-reverse !important;
+  }
+
+  .flex-sm-column-reverse {
+    -webkit-box-orient: vertical !important;
+    -webkit-box-direction: reverse !important;
+            flex-direction: column-reverse !important;
+  }
+
+  .flex-sm-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-sm-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-sm-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .flex-sm-fill {
+    -webkit-box-flex: 1 !important;
+            flex: 1 1 auto !important;
+  }
+
+  .flex-sm-grow-0 {
+    -webkit-box-flex: 0 !important;
+            flex-grow: 0 !important;
+  }
+
+  .flex-sm-grow-1 {
+    -webkit-box-flex: 1 !important;
+            flex-grow: 1 !important;
+  }
+
+  .flex-sm-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-sm-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .justify-content-sm-start {
+    -webkit-box-pack: start !important;
+            justify-content: flex-start !important;
+  }
+
+  .justify-content-sm-end {
+    -webkit-box-pack: end !important;
+            justify-content: flex-end !important;
+  }
+
+  .justify-content-sm-center {
+    -webkit-box-pack: center !important;
+            justify-content: center !important;
+  }
+
+  .justify-content-sm-between {
+    -webkit-box-pack: justify !important;
+            justify-content: space-between !important;
+  }
+
+  .justify-content-sm-around {
+    justify-content: space-around !important;
+  }
+
+  .align-items-sm-start {
+    -webkit-box-align: start !important;
+            align-items: flex-start !important;
+  }
+
+  .align-items-sm-end {
+    -webkit-box-align: end !important;
+            align-items: flex-end !important;
+  }
+
+  .align-items-sm-center {
+    -webkit-box-align: center !important;
+            align-items: center !important;
+  }
+
+  .align-items-sm-baseline {
+    -webkit-box-align: baseline !important;
+            align-items: baseline !important;
+  }
+
+  .align-items-sm-stretch {
+    -webkit-box-align: stretch !important;
+            align-items: stretch !important;
+  }
+
+  .align-content-sm-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-sm-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-sm-center {
+    align-content: center !important;
+  }
+
+  .align-content-sm-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-sm-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-sm-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-sm-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-sm-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-sm-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-sm-center {
+    align-self: center !important;
+  }
+
+  .align-self-sm-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-sm-stretch {
+    align-self: stretch !important;
+  }
+}
+@media (min-width: 768px) {
+  .flex-md-row {
+    -webkit-box-orient: horizontal !important;
+    -webkit-box-direction: normal !important;
+            flex-direction: row !important;
+  }
+
+  .flex-md-column {
+    -webkit-box-orient: vertical !important;
+    -webkit-box-direction: normal !important;
+            flex-direction: column !important;
+  }
+
+  .flex-md-row-reverse {
+    -webkit-box-orient: horizontal !important;
+    -webkit-box-direction: reverse !important;
+            flex-direction: row-reverse !important;
+  }
+
+  .flex-md-column-reverse {
+    -webkit-box-orient: vertical !important;
+    -webkit-box-direction: reverse !important;
+            flex-direction: column-reverse !important;
+  }
+
+  .flex-md-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-md-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-md-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .flex-md-fill {
+    -webkit-box-flex: 1 !important;
+            flex: 1 1 auto !important;
+  }
+
+  .flex-md-grow-0 {
+    -webkit-box-flex: 0 !important;
+            flex-grow: 0 !important;
+  }
+
+  .flex-md-grow-1 {
+    -webkit-box-flex: 1 !important;
+            flex-grow: 1 !important;
+  }
+
+  .flex-md-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-md-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .justify-content-md-start {
+    -webkit-box-pack: start !important;
+            justify-content: flex-start !important;
+  }
+
+  .justify-content-md-end {
+    -webkit-box-pack: end !important;
+            justify-content: flex-end !important;
+  }
+
+  .justify-content-md-center {
+    -webkit-box-pack: center !important;
+            justify-content: center !important;
+  }
+
+  .justify-content-md-between {
+    -webkit-box-pack: justify !important;
+            justify-content: space-between !important;
+  }
+
+  .justify-content-md-around {
+    justify-content: space-around !important;
+  }
+
+  .align-items-md-start {
+    -webkit-box-align: start !important;
+            align-items: flex-start !important;
+  }
+
+  .align-items-md-end {
+    -webkit-box-align: end !important;
+            align-items: flex-end !important;
+  }
+
+  .align-items-md-center {
+    -webkit-box-align: center !important;
+            align-items: center !important;
+  }
+
+  .align-items-md-baseline {
+    -webkit-box-align: baseline !important;
+            align-items: baseline !important;
+  }
+
+  .align-items-md-stretch {
+    -webkit-box-align: stretch !important;
+            align-items: stretch !important;
+  }
+
+  .align-content-md-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-md-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-md-center {
+    align-content: center !important;
+  }
+
+  .align-content-md-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-md-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-md-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-md-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-md-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-md-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-md-center {
+    align-self: center !important;
+  }
+
+  .align-self-md-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-md-stretch {
+    align-self: stretch !important;
+  }
+}
+@media (min-width: 992px) {
+  .flex-lg-row {
+    -webkit-box-orient: horizontal !important;
+    -webkit-box-direction: normal !important;
+            flex-direction: row !important;
+  }
+
+  .flex-lg-column {
+    -webkit-box-orient: vertical !important;
+    -webkit-box-direction: normal !important;
+            flex-direction: column !important;
+  }
+
+  .flex-lg-row-reverse {
+    -webkit-box-orient: horizontal !important;
+    -webkit-box-direction: reverse !important;
+            flex-direction: row-reverse !important;
+  }
+
+  .flex-lg-column-reverse {
+    -webkit-box-orient: vertical !important;
+    -webkit-box-direction: reverse !important;
+            flex-direction: column-reverse !important;
+  }
+
+  .flex-lg-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-lg-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-lg-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .flex-lg-fill {
+    -webkit-box-flex: 1 !important;
+            flex: 1 1 auto !important;
+  }
+
+  .flex-lg-grow-0 {
+    -webkit-box-flex: 0 !important;
+            flex-grow: 0 !important;
+  }
+
+  .flex-lg-grow-1 {
+    -webkit-box-flex: 1 !important;
+            flex-grow: 1 !important;
+  }
+
+  .flex-lg-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-lg-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .justify-content-lg-start {
+    -webkit-box-pack: start !important;
+            justify-content: flex-start !important;
+  }
+
+  .justify-content-lg-end {
+    -webkit-box-pack: end !important;
+            justify-content: flex-end !important;
+  }
+
+  .justify-content-lg-center {
+    -webkit-box-pack: center !important;
+            justify-content: center !important;
+  }
+
+  .justify-content-lg-between {
+    -webkit-box-pack: justify !important;
+            justify-content: space-between !important;
+  }
+
+  .justify-content-lg-around {
+    justify-content: space-around !important;
+  }
+
+  .align-items-lg-start {
+    -webkit-box-align: start !important;
+            align-items: flex-start !important;
+  }
+
+  .align-items-lg-end {
+    -webkit-box-align: end !important;
+            align-items: flex-end !important;
+  }
+
+  .align-items-lg-center {
+    -webkit-box-align: center !important;
+            align-items: center !important;
+  }
+
+  .align-items-lg-baseline {
+    -webkit-box-align: baseline !important;
+            align-items: baseline !important;
+  }
+
+  .align-items-lg-stretch {
+    -webkit-box-align: stretch !important;
+            align-items: stretch !important;
+  }
+
+  .align-content-lg-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-lg-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-lg-center {
+    align-content: center !important;
+  }
+
+  .align-content-lg-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-lg-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-lg-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-lg-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-lg-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-lg-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-lg-center {
+    align-self: center !important;
+  }
+
+  .align-self-lg-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-lg-stretch {
+    align-self: stretch !important;
+  }
+}
+@media (min-width: 1200px) {
+  .flex-xl-row {
+    -webkit-box-orient: horizontal !important;
+    -webkit-box-direction: normal !important;
+            flex-direction: row !important;
+  }
+
+  .flex-xl-column {
+    -webkit-box-orient: vertical !important;
+    -webkit-box-direction: normal !important;
+            flex-direction: column !important;
+  }
+
+  .flex-xl-row-reverse {
+    -webkit-box-orient: horizontal !important;
+    -webkit-box-direction: reverse !important;
+            flex-direction: row-reverse !important;
+  }
+
+  .flex-xl-column-reverse {
+    -webkit-box-orient: vertical !important;
+    -webkit-box-direction: reverse !important;
+            flex-direction: column-reverse !important;
+  }
+
+  .flex-xl-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-xl-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-xl-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .flex-xl-fill {
+    -webkit-box-flex: 1 !important;
+            flex: 1 1 auto !important;
+  }
+
+  .flex-xl-grow-0 {
+    -webkit-box-flex: 0 !important;
+            flex-grow: 0 !important;
+  }
+
+  .flex-xl-grow-1 {
+    -webkit-box-flex: 1 !important;
+            flex-grow: 1 !important;
+  }
+
+  .flex-xl-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-xl-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .justify-content-xl-start {
+    -webkit-box-pack: start !important;
+            justify-content: flex-start !important;
+  }
+
+  .justify-content-xl-end {
+    -webkit-box-pack: end !important;
+            justify-content: flex-end !important;
+  }
+
+  .justify-content-xl-center {
+    -webkit-box-pack: center !important;
+            justify-content: center !important;
+  }
+
+  .justify-content-xl-between {
+    -webkit-box-pack: justify !important;
+            justify-content: space-between !important;
+  }
+
+  .justify-content-xl-around {
+    justify-content: space-around !important;
+  }
+
+  .align-items-xl-start {
+    -webkit-box-align: start !important;
+            align-items: flex-start !important;
+  }
+
+  .align-items-xl-end {
+    -webkit-box-align: end !important;
+            align-items: flex-end !important;
+  }
+
+  .align-items-xl-center {
+    -webkit-box-align: center !important;
+            align-items: center !important;
+  }
+
+  .align-items-xl-baseline {
+    -webkit-box-align: baseline !important;
+            align-items: baseline !important;
+  }
+
+  .align-items-xl-stretch {
+    -webkit-box-align: stretch !important;
+            align-items: stretch !important;
+  }
+
+  .align-content-xl-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-xl-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-xl-center {
+    align-content: center !important;
+  }
+
+  .align-content-xl-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-xl-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-xl-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-xl-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-xl-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-xl-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-xl-center {
+    align-self: center !important;
+  }
+
+  .align-self-xl-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-xl-stretch {
+    align-self: stretch !important;
+  }
+}
+.float-left {
+  float: left !important;
+}
+
+.float-right {
+  float: right !important;
+}
+
+.float-none {
+  float: none !important;
+}
+
+@media (min-width: 576px) {
+  .float-sm-left {
+    float: left !important;
+  }
+
+  .float-sm-right {
+    float: right !important;
+  }
+
+  .float-sm-none {
+    float: none !important;
+  }
+}
+@media (min-width: 768px) {
+  .float-md-left {
+    float: left !important;
+  }
+
+  .float-md-right {
+    float: right !important;
+  }
+
+  .float-md-none {
+    float: none !important;
+  }
+}
+@media (min-width: 992px) {
+  .float-lg-left {
+    float: left !important;
+  }
+
+  .float-lg-right {
+    float: right !important;
+  }
+
+  .float-lg-none {
+    float: none !important;
+  }
+}
+@media (min-width: 1200px) {
+  .float-xl-left {
+    float: left !important;
+  }
+
+  .float-xl-right {
+    float: right !important;
+  }
+
+  .float-xl-none {
+    float: none !important;
+  }
+}
+.overflow-auto {
+  overflow: auto !important;
+}
+
+.overflow-hidden {
+  overflow: hidden !important;
+}
+
+.position-static {
+  position: static !important;
+}
+
+.position-relative {
+  position: relative !important;
+}
+
+.position-absolute {
+  position: absolute !important;
+}
+
+.position-fixed {
+  position: fixed !important;
+}
+
+.position-sticky {
+  position: -webkit-sticky !important;
+  position: sticky !important;
+}
+
+.fixed-top {
+  position: fixed;
+  top: 0;
+  right: 0;
+  left: 0;
+  z-index: 1030;
+}
+
+.fixed-bottom {
+  position: fixed;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1030;
+}
+
+@supports ((position: -webkit-sticky) or (position: sticky)) {
+  .sticky-top {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+}
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+.sr-only-focusable:active, .sr-only-focusable:focus {
+  position: static;
+  width: auto;
+  height: auto;
+  overflow: visible;
+  clip: auto;
+  white-space: normal;
+}
+
+.shadow-sm {
+  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
+}
+
+.shadow {
+  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
+}
+
+.shadow-lg {
+  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
+}
+
+.shadow-none {
+  box-shadow: none !important;
+}
+
+.w-25 {
+  width: 25% !important;
+}
+
+.w-50 {
+  width: 50% !important;
+}
+
+.w-75 {
+  width: 75% !important;
+}
+
+.w-100 {
+  width: 100% !important;
+}
+
+.w-auto {
+  width: auto !important;
+}
+
+.h-25 {
+  height: 25% !important;
+}
+
+.h-50 {
+  height: 50% !important;
+}
+
+.h-75 {
+  height: 75% !important;
+}
+
+.h-100 {
+  height: 100% !important;
+}
+
+.h-auto {
+  height: auto !important;
+}
+
+.mw-100 {
+  max-width: 100% !important;
+}
+
+.mh-100 {
+  max-height: 100% !important;
+}
+
+.min-vw-100 {
+  min-width: 100vw !important;
+}
+
+.min-vh-100 {
+  min-height: 100vh !important;
+}
+
+.vw-100 {
+  width: 100vw !important;
+}
+
+.vh-100 {
+  height: 100vh !important;
+}
+
+.stretched-link::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1;
+  pointer-events: auto;
+  content: "";
+  background-color: rgba(0, 0, 0, 0);
+}
+
+.m-0 {
+  margin: 0 !important;
+}
+
+.mt-0,
+.my-0 {
+  margin-top: 0 !important;
+}
+
+.mr-0,
+.mx-0 {
+  margin-right: 0 !important;
+}
+
+.mb-0,
+.my-0 {
+  margin-bottom: 0 !important;
+}
+
+.ml-0,
+.mx-0 {
+  margin-left: 0 !important;
+}
+
+.m-1 {
+  margin: 0.25rem !important;
+}
+
+.mt-1,
+.my-1 {
+  margin-top: 0.25rem !important;
+}
+
+.mr-1,
+.mx-1 {
+  margin-right: 0.25rem !important;
+}
+
+.mb-1,
+.my-1 {
+  margin-bottom: 0.25rem !important;
+}
+
+.ml-1,
+.mx-1 {
+  margin-left: 0.25rem !important;
+}
+
+.m-2 {
+  margin: 0.5rem !important;
+}
+
+.mt-2,
+.my-2 {
+  margin-top: 0.5rem !important;
+}
+
+.mr-2,
+.mx-2 {
+  margin-right: 0.5rem !important;
+}
+
+.mb-2,
+.my-2 {
+  margin-bottom: 0.5rem !important;
+}
+
+.ml-2,
+.mx-2 {
+  margin-left: 0.5rem !important;
+}
+
+.m-3 {
+  margin: 1rem !important;
+}
+
+.mt-3,
+.my-3 {
+  margin-top: 1rem !important;
+}
+
+.mr-3,
+.mx-3 {
+  margin-right: 1rem !important;
+}
+
+.mb-3,
+.my-3 {
+  margin-bottom: 1rem !important;
+}
+
+.ml-3,
+.mx-3 {
+  margin-left: 1rem !important;
+}
+
+.m-4 {
+  margin: 1.5rem !important;
+}
+
+.mt-4,
+.my-4 {
+  margin-top: 1.5rem !important;
+}
+
+.mr-4,
+.mx-4 {
+  margin-right: 1.5rem !important;
+}
+
+.mb-4,
+.my-4 {
+  margin-bottom: 1.5rem !important;
+}
+
+.ml-4,
+.mx-4 {
+  margin-left: 1.5rem !important;
+}
+
+.m-5 {
+  margin: 3rem !important;
+}
+
+.mt-5,
+.my-5 {
+  margin-top: 3rem !important;
+}
+
+.mr-5,
+.mx-5 {
+  margin-right: 3rem !important;
+}
+
+.mb-5,
+.my-5 {
+  margin-bottom: 3rem !important;
+}
+
+.ml-5,
+.mx-5 {
+  margin-left: 3rem !important;
+}
+
+.p-0 {
+  padding: 0 !important;
+}
+
+.pt-0,
+.py-0 {
+  padding-top: 0 !important;
+}
+
+.pr-0,
+.px-0 {
+  padding-right: 0 !important;
+}
+
+.pb-0,
+.py-0 {
+  padding-bottom: 0 !important;
+}
+
+.pl-0,
+.px-0 {
+  padding-left: 0 !important;
+}
+
+.p-1 {
+  padding: 0.25rem !important;
+}
+
+.pt-1,
+.py-1 {
+  padding-top: 0.25rem !important;
+}
+
+.pr-1,
+.px-1 {
+  padding-right: 0.25rem !important;
+}
+
+.pb-1,
+.py-1 {
+  padding-bottom: 0.25rem !important;
+}
+
+.pl-1,
+.px-1 {
+  padding-left: 0.25rem !important;
+}
+
+.p-2 {
+  padding: 0.5rem !important;
+}
+
+.pt-2,
+.py-2,
+.cmp-companies-page .cmp-companies-company {
+  padding-top: 0.5rem !important;
+}
+
+.pr-2,
+.px-2 {
+  padding-right: 0.5rem !important;
+}
+
+.pb-2,
+.py-2,
+.cmp-companies-page .cmp-companies-company {
+  padding-bottom: 0.5rem !important;
+}
+
+.pl-2,
+.px-2 {
+  padding-left: 0.5rem !important;
+}
+
+.p-3 {
+  padding: 1rem !important;
+}
+
+.pt-3,
+.py-3 {
+  padding-top: 1rem !important;
+}
+
+.pr-3,
+.px-3 {
+  padding-right: 1rem !important;
+}
+
+.pb-3,
+.py-3 {
+  padding-bottom: 1rem !important;
+}
+
+.pl-3,
+.px-3 {
+  padding-left: 1rem !important;
+}
+
+.p-4 {
+  padding: 1.5rem !important;
+}
+
+.pt-4,
+.py-4 {
+  padding-top: 1.5rem !important;
+}
+
+.pr-4,
+.px-4 {
+  padding-right: 1.5rem !important;
+}
+
+.pb-4,
+.py-4 {
+  padding-bottom: 1.5rem !important;
+}
+
+.pl-4,
+.px-4 {
+  padding-left: 1.5rem !important;
+}
+
+.p-5 {
+  padding: 3rem !important;
+}
+
+.pt-5,
+.py-5 {
+  padding-top: 3rem !important;
+}
+
+.pr-5,
+.px-5 {
+  padding-right: 3rem !important;
+}
+
+.pb-5,
+.py-5 {
+  padding-bottom: 3rem !important;
+}
+
+.pl-5,
+.px-5 {
+  padding-left: 3rem !important;
+}
+
+.m-n1 {
+  margin: -0.25rem !important;
+}
+
+.mt-n1,
+.my-n1 {
+  margin-top: -0.25rem !important;
+}
+
+.mr-n1,
+.mx-n1 {
+  margin-right: -0.25rem !important;
+}
+
+.mb-n1,
+.my-n1 {
+  margin-bottom: -0.25rem !important;
+}
+
+.ml-n1,
+.mx-n1 {
+  margin-left: -0.25rem !important;
+}
+
+.m-n2 {
+  margin: -0.5rem !important;
+}
+
+.mt-n2,
+.my-n2 {
+  margin-top: -0.5rem !important;
+}
+
+.mr-n2,
+.mx-n2 {
+  margin-right: -0.5rem !important;
+}
+
+.mb-n2,
+.my-n2 {
+  margin-bottom: -0.5rem !important;
+}
+
+.ml-n2,
+.mx-n2 {
+  margin-left: -0.5rem !important;
+}
+
+.m-n3 {
+  margin: -1rem !important;
+}
+
+.mt-n3,
+.my-n3 {
+  margin-top: -1rem !important;
+}
+
+.mr-n3,
+.mx-n3 {
+  margin-right: -1rem !important;
+}
+
+.mb-n3,
+.my-n3 {
+  margin-bottom: -1rem !important;
+}
+
+.ml-n3,
+.mx-n3 {
+  margin-left: -1rem !important;
+}
+
+.m-n4 {
+  margin: -1.5rem !important;
+}
+
+.mt-n4,
+.my-n4 {
+  margin-top: -1.5rem !important;
+}
+
+.mr-n4,
+.mx-n4 {
+  margin-right: -1.5rem !important;
+}
+
+.mb-n4,
+.my-n4 {
+  margin-bottom: -1.5rem !important;
+}
+
+.ml-n4,
+.mx-n4 {
+  margin-left: -1.5rem !important;
+}
+
+.m-n5 {
+  margin: -3rem !important;
+}
+
+.mt-n5,
+.my-n5 {
+  margin-top: -3rem !important;
+}
+
+.mr-n5,
+.mx-n5 {
+  margin-right: -3rem !important;
+}
+
+.mb-n5,
+.my-n5 {
+  margin-bottom: -3rem !important;
+}
+
+.ml-n5,
+.mx-n5 {
+  margin-left: -3rem !important;
+}
+
+.m-auto {
+  margin: auto !important;
+}
+
+.mt-auto,
+.my-auto {
+  margin-top: auto !important;
+}
+
+.mr-auto,
+.mx-auto,
+#page .cmp-brandingcard .field--name-image {
+  margin-right: auto !important;
+}
+
+.mb-auto,
+.my-auto {
+  margin-bottom: auto !important;
+}
+
+.ml-auto,
+.mx-auto,
+#page .cmp-brandingcard .field--name-image {
+  margin-left: auto !important;
+}
+
+@media (min-width: 576px) {
+  .m-sm-0 {
+    margin: 0 !important;
+  }
+
+  .mt-sm-0,
+.my-sm-0 {
+    margin-top: 0 !important;
+  }
+
+  .mr-sm-0,
+.mx-sm-0 {
+    margin-right: 0 !important;
+  }
+
+  .mb-sm-0,
+.my-sm-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .ml-sm-0,
+.mx-sm-0 {
+    margin-left: 0 !important;
+  }
+
+  .m-sm-1 {
+    margin: 0.25rem !important;
+  }
+
+  .mt-sm-1,
+.my-sm-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mr-sm-1,
+.mx-sm-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .mb-sm-1,
+.my-sm-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .ml-sm-1,
+.mx-sm-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .m-sm-2 {
+    margin: 0.5rem !important;
+  }
+
+  .mt-sm-2,
+.my-sm-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mr-sm-2,
+.mx-sm-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .mb-sm-2,
+.my-sm-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .ml-sm-2,
+.mx-sm-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .m-sm-3 {
+    margin: 1rem !important;
+  }
+
+  .mt-sm-3,
+.my-sm-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mr-sm-3,
+.mx-sm-3 {
+    margin-right: 1rem !important;
+  }
+
+  .mb-sm-3,
+.my-sm-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .ml-sm-3,
+.mx-sm-3 {
+    margin-left: 1rem !important;
+  }
+
+  .m-sm-4 {
+    margin: 1.5rem !important;
+  }
+
+  .mt-sm-4,
+.my-sm-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mr-sm-4,
+.mx-sm-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .mb-sm-4,
+.my-sm-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .ml-sm-4,
+.mx-sm-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .m-sm-5 {
+    margin: 3rem !important;
+  }
+
+  .mt-sm-5,
+.my-sm-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mr-sm-5,
+.mx-sm-5 {
+    margin-right: 3rem !important;
+  }
+
+  .mb-sm-5,
+.my-sm-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .ml-sm-5,
+.mx-sm-5 {
+    margin-left: 3rem !important;
+  }
+
+  .p-sm-0 {
+    padding: 0 !important;
+  }
+
+  .pt-sm-0,
+.py-sm-0 {
+    padding-top: 0 !important;
+  }
+
+  .pr-sm-0,
+.px-sm-0 {
+    padding-right: 0 !important;
+  }
+
+  .pb-sm-0,
+.py-sm-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pl-sm-0,
+.px-sm-0 {
+    padding-left: 0 !important;
+  }
+
+  .p-sm-1 {
+    padding: 0.25rem !important;
+  }
+
+  .pt-sm-1,
+.py-sm-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pr-sm-1,
+.px-sm-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pb-sm-1,
+.py-sm-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pl-sm-1,
+.px-sm-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .p-sm-2 {
+    padding: 0.5rem !important;
+  }
+
+  .pt-sm-2,
+.py-sm-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pr-sm-2,
+.px-sm-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pb-sm-2,
+.py-sm-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pl-sm-2,
+.px-sm-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .p-sm-3 {
+    padding: 1rem !important;
+  }
+
+  .pt-sm-3,
+.py-sm-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pr-sm-3,
+.px-sm-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pb-sm-3,
+.py-sm-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pl-sm-3,
+.px-sm-3 {
+    padding-left: 1rem !important;
+  }
+
+  .p-sm-4 {
+    padding: 1.5rem !important;
+  }
+
+  .pt-sm-4,
+.py-sm-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pr-sm-4,
+.px-sm-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pb-sm-4,
+.py-sm-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pl-sm-4,
+.px-sm-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .p-sm-5 {
+    padding: 3rem !important;
+  }
+
+  .pt-sm-5,
+.py-sm-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pr-sm-5,
+.px-sm-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-sm-5,
+.py-sm-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .pl-sm-5,
+.px-sm-5 {
+    padding-left: 3rem !important;
+  }
+
+  .m-sm-n1 {
+    margin: -0.25rem !important;
+  }
+
+  .mt-sm-n1,
+.my-sm-n1 {
+    margin-top: -0.25rem !important;
+  }
+
+  .mr-sm-n1,
+.mx-sm-n1 {
+    margin-right: -0.25rem !important;
+  }
+
+  .mb-sm-n1,
+.my-sm-n1 {
+    margin-bottom: -0.25rem !important;
+  }
+
+  .ml-sm-n1,
+.mx-sm-n1 {
+    margin-left: -0.25rem !important;
+  }
+
+  .m-sm-n2 {
+    margin: -0.5rem !important;
+  }
+
+  .mt-sm-n2,
+.my-sm-n2 {
+    margin-top: -0.5rem !important;
+  }
+
+  .mr-sm-n2,
+.mx-sm-n2 {
+    margin-right: -0.5rem !important;
+  }
+
+  .mb-sm-n2,
+.my-sm-n2 {
+    margin-bottom: -0.5rem !important;
+  }
+
+  .ml-sm-n2,
+.mx-sm-n2 {
+    margin-left: -0.5rem !important;
+  }
+
+  .m-sm-n3 {
+    margin: -1rem !important;
+  }
+
+  .mt-sm-n3,
+.my-sm-n3 {
+    margin-top: -1rem !important;
+  }
+
+  .mr-sm-n3,
+.mx-sm-n3 {
+    margin-right: -1rem !important;
+  }
+
+  .mb-sm-n3,
+.my-sm-n3 {
+    margin-bottom: -1rem !important;
+  }
+
+  .ml-sm-n3,
+.mx-sm-n3 {
+    margin-left: -1rem !important;
+  }
+
+  .m-sm-n4 {
+    margin: -1.5rem !important;
+  }
+
+  .mt-sm-n4,
+.my-sm-n4 {
+    margin-top: -1.5rem !important;
+  }
+
+  .mr-sm-n4,
+.mx-sm-n4 {
+    margin-right: -1.5rem !important;
+  }
+
+  .mb-sm-n4,
+.my-sm-n4 {
+    margin-bottom: -1.5rem !important;
+  }
+
+  .ml-sm-n4,
+.mx-sm-n4 {
+    margin-left: -1.5rem !important;
+  }
+
+  .m-sm-n5 {
+    margin: -3rem !important;
+  }
+
+  .mt-sm-n5,
+.my-sm-n5 {
+    margin-top: -3rem !important;
+  }
+
+  .mr-sm-n5,
+.mx-sm-n5 {
+    margin-right: -3rem !important;
+  }
+
+  .mb-sm-n5,
+.my-sm-n5 {
+    margin-bottom: -3rem !important;
+  }
+
+  .ml-sm-n5,
+.mx-sm-n5 {
+    margin-left: -3rem !important;
+  }
+
+  .m-sm-auto {
+    margin: auto !important;
+  }
+
+  .mt-sm-auto,
+.my-sm-auto {
+    margin-top: auto !important;
+  }
+
+  .mr-sm-auto,
+.mx-sm-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-sm-auto,
+.my-sm-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ml-sm-auto,
+.mx-sm-auto {
+    margin-left: auto !important;
+  }
+}
+@media (min-width: 768px) {
+  .m-md-0 {
+    margin: 0 !important;
+  }
+
+  .mt-md-0,
+.my-md-0 {
+    margin-top: 0 !important;
+  }
+
+  .mr-md-0,
+.mx-md-0 {
+    margin-right: 0 !important;
+  }
+
+  .mb-md-0,
+.my-md-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .ml-md-0,
+.mx-md-0 {
+    margin-left: 0 !important;
+  }
+
+  .m-md-1 {
+    margin: 0.25rem !important;
+  }
+
+  .mt-md-1,
+.my-md-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mr-md-1,
+.mx-md-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .mb-md-1,
+.my-md-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .ml-md-1,
+.mx-md-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .m-md-2 {
+    margin: 0.5rem !important;
+  }
+
+  .mt-md-2,
+.my-md-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mr-md-2,
+.mx-md-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .mb-md-2,
+.my-md-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .ml-md-2,
+.mx-md-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .m-md-3 {
+    margin: 1rem !important;
+  }
+
+  .mt-md-3,
+.my-md-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mr-md-3,
+.mx-md-3 {
+    margin-right: 1rem !important;
+  }
+
+  .mb-md-3,
+.my-md-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .ml-md-3,
+.mx-md-3 {
+    margin-left: 1rem !important;
+  }
+
+  .m-md-4 {
+    margin: 1.5rem !important;
+  }
+
+  .mt-md-4,
+.my-md-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mr-md-4,
+.mx-md-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .mb-md-4,
+.my-md-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .ml-md-4,
+.mx-md-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .m-md-5 {
+    margin: 3rem !important;
+  }
+
+  .mt-md-5,
+.my-md-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mr-md-5,
+.mx-md-5 {
+    margin-right: 3rem !important;
+  }
+
+  .mb-md-5,
+.my-md-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .ml-md-5,
+.mx-md-5 {
+    margin-left: 3rem !important;
+  }
+
+  .p-md-0 {
+    padding: 0 !important;
+  }
+
+  .pt-md-0,
+.py-md-0 {
+    padding-top: 0 !important;
+  }
+
+  .pr-md-0,
+.px-md-0 {
+    padding-right: 0 !important;
+  }
+
+  .pb-md-0,
+.py-md-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pl-md-0,
+.px-md-0 {
+    padding-left: 0 !important;
+  }
+
+  .p-md-1 {
+    padding: 0.25rem !important;
+  }
+
+  .pt-md-1,
+.py-md-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pr-md-1,
+.px-md-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pb-md-1,
+.py-md-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pl-md-1,
+.px-md-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .p-md-2 {
+    padding: 0.5rem !important;
+  }
+
+  .pt-md-2,
+.py-md-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pr-md-2,
+.px-md-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pb-md-2,
+.py-md-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pl-md-2,
+.px-md-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .p-md-3 {
+    padding: 1rem !important;
+  }
+
+  .pt-md-3,
+.py-md-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pr-md-3,
+.px-md-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pb-md-3,
+.py-md-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pl-md-3,
+.px-md-3 {
+    padding-left: 1rem !important;
+  }
+
+  .p-md-4 {
+    padding: 1.5rem !important;
+  }
+
+  .pt-md-4,
+.py-md-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pr-md-4,
+.px-md-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pb-md-4,
+.py-md-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pl-md-4,
+.px-md-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .p-md-5 {
+    padding: 3rem !important;
+  }
+
+  .pt-md-5,
+.py-md-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pr-md-5,
+.px-md-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-md-5,
+.py-md-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .pl-md-5,
+.px-md-5 {
+    padding-left: 3rem !important;
+  }
+
+  .m-md-n1 {
+    margin: -0.25rem !important;
+  }
+
+  .mt-md-n1,
+.my-md-n1 {
+    margin-top: -0.25rem !important;
+  }
+
+  .mr-md-n1,
+.mx-md-n1 {
+    margin-right: -0.25rem !important;
+  }
+
+  .mb-md-n1,
+.my-md-n1 {
+    margin-bottom: -0.25rem !important;
+  }
+
+  .ml-md-n1,
+.mx-md-n1 {
+    margin-left: -0.25rem !important;
+  }
+
+  .m-md-n2 {
+    margin: -0.5rem !important;
+  }
+
+  .mt-md-n2,
+.my-md-n2 {
+    margin-top: -0.5rem !important;
+  }
+
+  .mr-md-n2,
+.mx-md-n2 {
+    margin-right: -0.5rem !important;
+  }
+
+  .mb-md-n2,
+.my-md-n2 {
+    margin-bottom: -0.5rem !important;
+  }
+
+  .ml-md-n2,
+.mx-md-n2 {
+    margin-left: -0.5rem !important;
+  }
+
+  .m-md-n3 {
+    margin: -1rem !important;
+  }
+
+  .mt-md-n3,
+.my-md-n3 {
+    margin-top: -1rem !important;
+  }
+
+  .mr-md-n3,
+.mx-md-n3 {
+    margin-right: -1rem !important;
+  }
+
+  .mb-md-n3,
+.my-md-n3 {
+    margin-bottom: -1rem !important;
+  }
+
+  .ml-md-n3,
+.mx-md-n3 {
+    margin-left: -1rem !important;
+  }
+
+  .m-md-n4 {
+    margin: -1.5rem !important;
+  }
+
+  .mt-md-n4,
+.my-md-n4 {
+    margin-top: -1.5rem !important;
+  }
+
+  .mr-md-n4,
+.mx-md-n4 {
+    margin-right: -1.5rem !important;
+  }
+
+  .mb-md-n4,
+.my-md-n4 {
+    margin-bottom: -1.5rem !important;
+  }
+
+  .ml-md-n4,
+.mx-md-n4 {
+    margin-left: -1.5rem !important;
+  }
+
+  .m-md-n5 {
+    margin: -3rem !important;
+  }
+
+  .mt-md-n5,
+.my-md-n5 {
+    margin-top: -3rem !important;
+  }
+
+  .mr-md-n5,
+.mx-md-n5 {
+    margin-right: -3rem !important;
+  }
+
+  .mb-md-n5,
+.my-md-n5 {
+    margin-bottom: -3rem !important;
+  }
+
+  .ml-md-n5,
+.mx-md-n5 {
+    margin-left: -3rem !important;
+  }
+
+  .m-md-auto {
+    margin: auto !important;
+  }
+
+  .mt-md-auto,
+.my-md-auto {
+    margin-top: auto !important;
+  }
+
+  .mr-md-auto,
+.mx-md-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-md-auto,
+.my-md-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ml-md-auto,
+.mx-md-auto {
+    margin-left: auto !important;
+  }
+}
+@media (min-width: 992px) {
+  .m-lg-0 {
+    margin: 0 !important;
+  }
+
+  .mt-lg-0,
+.my-lg-0 {
+    margin-top: 0 !important;
+  }
+
+  .mr-lg-0,
+.mx-lg-0 {
+    margin-right: 0 !important;
+  }
+
+  .mb-lg-0,
+.my-lg-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .ml-lg-0,
+.mx-lg-0 {
+    margin-left: 0 !important;
+  }
+
+  .m-lg-1 {
+    margin: 0.25rem !important;
+  }
+
+  .mt-lg-1,
+.my-lg-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mr-lg-1,
+.mx-lg-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .mb-lg-1,
+.my-lg-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .ml-lg-1,
+.mx-lg-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .m-lg-2 {
+    margin: 0.5rem !important;
+  }
+
+  .mt-lg-2,
+.my-lg-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mr-lg-2,
+.mx-lg-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .mb-lg-2,
+.my-lg-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .ml-lg-2,
+.mx-lg-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .m-lg-3 {
+    margin: 1rem !important;
+  }
+
+  .mt-lg-3,
+.my-lg-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mr-lg-3,
+.mx-lg-3 {
+    margin-right: 1rem !important;
+  }
+
+  .mb-lg-3,
+.my-lg-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .ml-lg-3,
+.mx-lg-3 {
+    margin-left: 1rem !important;
+  }
+
+  .m-lg-4 {
+    margin: 1.5rem !important;
+  }
+
+  .mt-lg-4,
+.my-lg-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mr-lg-4,
+.mx-lg-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .mb-lg-4,
+.my-lg-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .ml-lg-4,
+.mx-lg-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .m-lg-5 {
+    margin: 3rem !important;
+  }
+
+  .mt-lg-5,
+.my-lg-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mr-lg-5,
+.mx-lg-5 {
+    margin-right: 3rem !important;
+  }
+
+  .mb-lg-5,
+.my-lg-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .ml-lg-5,
+.mx-lg-5 {
+    margin-left: 3rem !important;
+  }
+
+  .p-lg-0 {
+    padding: 0 !important;
+  }
+
+  .pt-lg-0,
+.py-lg-0 {
+    padding-top: 0 !important;
+  }
+
+  .pr-lg-0,
+.px-lg-0 {
+    padding-right: 0 !important;
+  }
+
+  .pb-lg-0,
+.py-lg-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pl-lg-0,
+.px-lg-0 {
+    padding-left: 0 !important;
+  }
+
+  .p-lg-1 {
+    padding: 0.25rem !important;
+  }
+
+  .pt-lg-1,
+.py-lg-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pr-lg-1,
+.px-lg-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pb-lg-1,
+.py-lg-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pl-lg-1,
+.px-lg-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .p-lg-2 {
+    padding: 0.5rem !important;
+  }
+
+  .pt-lg-2,
+.py-lg-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pr-lg-2,
+.px-lg-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pb-lg-2,
+.py-lg-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pl-lg-2,
+.px-lg-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .p-lg-3 {
+    padding: 1rem !important;
+  }
+
+  .pt-lg-3,
+.py-lg-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pr-lg-3,
+.px-lg-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pb-lg-3,
+.py-lg-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pl-lg-3,
+.px-lg-3 {
+    padding-left: 1rem !important;
+  }
+
+  .p-lg-4 {
+    padding: 1.5rem !important;
+  }
+
+  .pt-lg-4,
+.py-lg-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pr-lg-4,
+.px-lg-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pb-lg-4,
+.py-lg-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pl-lg-4,
+.px-lg-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .p-lg-5 {
+    padding: 3rem !important;
+  }
+
+  .pt-lg-5,
+.py-lg-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pr-lg-5,
+.px-lg-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-lg-5,
+.py-lg-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .pl-lg-5,
+.px-lg-5 {
+    padding-left: 3rem !important;
+  }
+
+  .m-lg-n1 {
+    margin: -0.25rem !important;
+  }
+
+  .mt-lg-n1,
+.my-lg-n1 {
+    margin-top: -0.25rem !important;
+  }
+
+  .mr-lg-n1,
+.mx-lg-n1 {
+    margin-right: -0.25rem !important;
+  }
+
+  .mb-lg-n1,
+.my-lg-n1 {
+    margin-bottom: -0.25rem !important;
+  }
+
+  .ml-lg-n1,
+.mx-lg-n1 {
+    margin-left: -0.25rem !important;
+  }
+
+  .m-lg-n2 {
+    margin: -0.5rem !important;
+  }
+
+  .mt-lg-n2,
+.my-lg-n2 {
+    margin-top: -0.5rem !important;
+  }
+
+  .mr-lg-n2,
+.mx-lg-n2 {
+    margin-right: -0.5rem !important;
+  }
+
+  .mb-lg-n2,
+.my-lg-n2 {
+    margin-bottom: -0.5rem !important;
+  }
+
+  .ml-lg-n2,
+.mx-lg-n2 {
+    margin-left: -0.5rem !important;
+  }
+
+  .m-lg-n3 {
+    margin: -1rem !important;
+  }
+
+  .mt-lg-n3,
+.my-lg-n3 {
+    margin-top: -1rem !important;
+  }
+
+  .mr-lg-n3,
+.mx-lg-n3 {
+    margin-right: -1rem !important;
+  }
+
+  .mb-lg-n3,
+.my-lg-n3 {
+    margin-bottom: -1rem !important;
+  }
+
+  .ml-lg-n3,
+.mx-lg-n3 {
+    margin-left: -1rem !important;
+  }
+
+  .m-lg-n4 {
+    margin: -1.5rem !important;
+  }
+
+  .mt-lg-n4,
+.my-lg-n4 {
+    margin-top: -1.5rem !important;
+  }
+
+  .mr-lg-n4,
+.mx-lg-n4 {
+    margin-right: -1.5rem !important;
+  }
+
+  .mb-lg-n4,
+.my-lg-n4 {
+    margin-bottom: -1.5rem !important;
+  }
+
+  .ml-lg-n4,
+.mx-lg-n4 {
+    margin-left: -1.5rem !important;
+  }
+
+  .m-lg-n5 {
+    margin: -3rem !important;
+  }
+
+  .mt-lg-n5,
+.my-lg-n5 {
+    margin-top: -3rem !important;
+  }
+
+  .mr-lg-n5,
+.mx-lg-n5 {
+    margin-right: -3rem !important;
+  }
+
+  .mb-lg-n5,
+.my-lg-n5 {
+    margin-bottom: -3rem !important;
+  }
+
+  .ml-lg-n5,
+.mx-lg-n5 {
+    margin-left: -3rem !important;
+  }
+
+  .m-lg-auto {
+    margin: auto !important;
+  }
+
+  .mt-lg-auto,
+.my-lg-auto {
+    margin-top: auto !important;
+  }
+
+  .mr-lg-auto,
+.mx-lg-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-lg-auto,
+.my-lg-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ml-lg-auto,
+.mx-lg-auto {
+    margin-left: auto !important;
+  }
+}
+@media (min-width: 1200px) {
+  .m-xl-0 {
+    margin: 0 !important;
+  }
+
+  .mt-xl-0,
+.my-xl-0 {
+    margin-top: 0 !important;
+  }
+
+  .mr-xl-0,
+.mx-xl-0 {
+    margin-right: 0 !important;
+  }
+
+  .mb-xl-0,
+.my-xl-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .ml-xl-0,
+.mx-xl-0 {
+    margin-left: 0 !important;
+  }
+
+  .m-xl-1 {
+    margin: 0.25rem !important;
+  }
+
+  .mt-xl-1,
+.my-xl-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mr-xl-1,
+.mx-xl-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .mb-xl-1,
+.my-xl-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .ml-xl-1,
+.mx-xl-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .m-xl-2 {
+    margin: 0.5rem !important;
+  }
+
+  .mt-xl-2,
+.my-xl-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mr-xl-2,
+.mx-xl-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .mb-xl-2,
+.my-xl-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .ml-xl-2,
+.mx-xl-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .m-xl-3 {
+    margin: 1rem !important;
+  }
+
+  .mt-xl-3,
+.my-xl-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mr-xl-3,
+.mx-xl-3 {
+    margin-right: 1rem !important;
+  }
+
+  .mb-xl-3,
+.my-xl-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .ml-xl-3,
+.mx-xl-3 {
+    margin-left: 1rem !important;
+  }
+
+  .m-xl-4 {
+    margin: 1.5rem !important;
+  }
+
+  .mt-xl-4,
+.my-xl-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mr-xl-4,
+.mx-xl-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .mb-xl-4,
+.my-xl-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .ml-xl-4,
+.mx-xl-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .m-xl-5 {
+    margin: 3rem !important;
+  }
+
+  .mt-xl-5,
+.my-xl-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mr-xl-5,
+.mx-xl-5 {
+    margin-right: 3rem !important;
+  }
+
+  .mb-xl-5,
+.my-xl-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .ml-xl-5,
+.mx-xl-5 {
+    margin-left: 3rem !important;
+  }
+
+  .p-xl-0 {
+    padding: 0 !important;
+  }
+
+  .pt-xl-0,
+.py-xl-0 {
+    padding-top: 0 !important;
+  }
+
+  .pr-xl-0,
+.px-xl-0 {
+    padding-right: 0 !important;
+  }
+
+  .pb-xl-0,
+.py-xl-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pl-xl-0,
+.px-xl-0 {
+    padding-left: 0 !important;
+  }
+
+  .p-xl-1 {
+    padding: 0.25rem !important;
+  }
+
+  .pt-xl-1,
+.py-xl-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pr-xl-1,
+.px-xl-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pb-xl-1,
+.py-xl-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pl-xl-1,
+.px-xl-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .p-xl-2 {
+    padding: 0.5rem !important;
+  }
+
+  .pt-xl-2,
+.py-xl-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pr-xl-2,
+.px-xl-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pb-xl-2,
+.py-xl-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pl-xl-2,
+.px-xl-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .p-xl-3 {
+    padding: 1rem !important;
+  }
+
+  .pt-xl-3,
+.py-xl-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pr-xl-3,
+.px-xl-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pb-xl-3,
+.py-xl-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pl-xl-3,
+.px-xl-3 {
+    padding-left: 1rem !important;
+  }
+
+  .p-xl-4 {
+    padding: 1.5rem !important;
+  }
+
+  .pt-xl-4,
+.py-xl-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pr-xl-4,
+.px-xl-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pb-xl-4,
+.py-xl-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pl-xl-4,
+.px-xl-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .p-xl-5 {
+    padding: 3rem !important;
+  }
+
+  .pt-xl-5,
+.py-xl-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pr-xl-5,
+.px-xl-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-xl-5,
+.py-xl-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .pl-xl-5,
+.px-xl-5 {
+    padding-left: 3rem !important;
+  }
+
+  .m-xl-n1 {
+    margin: -0.25rem !important;
+  }
+
+  .mt-xl-n1,
+.my-xl-n1 {
+    margin-top: -0.25rem !important;
+  }
+
+  .mr-xl-n1,
+.mx-xl-n1 {
+    margin-right: -0.25rem !important;
+  }
+
+  .mb-xl-n1,
+.my-xl-n1 {
+    margin-bottom: -0.25rem !important;
+  }
+
+  .ml-xl-n1,
+.mx-xl-n1 {
+    margin-left: -0.25rem !important;
+  }
+
+  .m-xl-n2 {
+    margin: -0.5rem !important;
+  }
+
+  .mt-xl-n2,
+.my-xl-n2 {
+    margin-top: -0.5rem !important;
+  }
+
+  .mr-xl-n2,
+.mx-xl-n2 {
+    margin-right: -0.5rem !important;
+  }
+
+  .mb-xl-n2,
+.my-xl-n2 {
+    margin-bottom: -0.5rem !important;
+  }
+
+  .ml-xl-n2,
+.mx-xl-n2 {
+    margin-left: -0.5rem !important;
+  }
+
+  .m-xl-n3 {
+    margin: -1rem !important;
+  }
+
+  .mt-xl-n3,
+.my-xl-n3 {
+    margin-top: -1rem !important;
+  }
+
+  .mr-xl-n3,
+.mx-xl-n3 {
+    margin-right: -1rem !important;
+  }
+
+  .mb-xl-n3,
+.my-xl-n3 {
+    margin-bottom: -1rem !important;
+  }
+
+  .ml-xl-n3,
+.mx-xl-n3 {
+    margin-left: -1rem !important;
+  }
+
+  .m-xl-n4 {
+    margin: -1.5rem !important;
+  }
+
+  .mt-xl-n4,
+.my-xl-n4 {
+    margin-top: -1.5rem !important;
+  }
+
+  .mr-xl-n4,
+.mx-xl-n4 {
+    margin-right: -1.5rem !important;
+  }
+
+  .mb-xl-n4,
+.my-xl-n4 {
+    margin-bottom: -1.5rem !important;
+  }
+
+  .ml-xl-n4,
+.mx-xl-n4 {
+    margin-left: -1.5rem !important;
+  }
+
+  .m-xl-n5 {
+    margin: -3rem !important;
+  }
+
+  .mt-xl-n5,
+.my-xl-n5 {
+    margin-top: -3rem !important;
+  }
+
+  .mr-xl-n5,
+.mx-xl-n5 {
+    margin-right: -3rem !important;
+  }
+
+  .mb-xl-n5,
+.my-xl-n5 {
+    margin-bottom: -3rem !important;
+  }
+
+  .ml-xl-n5,
+.mx-xl-n5 {
+    margin-left: -3rem !important;
+  }
+
+  .m-xl-auto {
+    margin: auto !important;
+  }
+
+  .mt-xl-auto,
+.my-xl-auto {
+    margin-top: auto !important;
+  }
+
+  .mr-xl-auto,
+.mx-xl-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-xl-auto,
+.my-xl-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ml-xl-auto,
+.mx-xl-auto {
+    margin-left: auto !important;
+  }
+}
+.text-monospace {
+  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
+}
+
+.text-justify {
+  text-align: justify !important;
+}
+
+.text-wrap {
+  white-space: normal !important;
+}
+
+.text-nowrap {
+  white-space: nowrap !important;
+}
+
+.text-truncate {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.text-left {
+  text-align: left !important;
+}
+
+.text-right {
+  text-align: right !important;
+}
+
+.text-center {
+  text-align: center !important;
+}
+
+@media (min-width: 576px) {
+  .text-sm-left {
+    text-align: left !important;
+  }
+
+  .text-sm-right {
+    text-align: right !important;
+  }
+
+  .text-sm-center {
+    text-align: center !important;
+  }
+}
+@media (min-width: 768px) {
+  .text-md-left {
+    text-align: left !important;
+  }
+
+  .text-md-right {
+    text-align: right !important;
+  }
+
+  .text-md-center {
+    text-align: center !important;
+  }
+}
+@media (min-width: 992px) {
+  .text-lg-left {
+    text-align: left !important;
+  }
+
+  .text-lg-right {
+    text-align: right !important;
+  }
+
+  .text-lg-center {
+    text-align: center !important;
+  }
+}
+@media (min-width: 1200px) {
+  .text-xl-left {
+    text-align: left !important;
+  }
+
+  .text-xl-right {
+    text-align: right !important;
+  }
+
+  .text-xl-center {
+    text-align: center !important;
+  }
+}
+.text-lowercase {
+  text-transform: lowercase !important;
+}
+
+.text-uppercase {
+  text-transform: uppercase !important;
+}
+
+.text-capitalize {
+  text-transform: capitalize !important;
+}
+
+.font-weight-light {
+  font-weight: 300 !important;
+}
+
+.font-weight-lighter {
+  font-weight: lighter !important;
+}
+
+.font-weight-normal {
+  font-weight: 400 !important;
+}
+
+.font-weight-bold {
+  font-weight: 700 !important;
+}
+
+.font-weight-bolder {
+  font-weight: bolder !important;
+}
+
+.font-italic {
+  font-style: italic !important;
+}
+
+.text-white {
+  color: #fff !important;
+}
+
+.text-primary {
+  color: #1b3d6e !important;
+}
+
+a.text-primary:hover, a.text-primary:focus {
+  color: #0c1b31 !important;
+}
+
+.text-secondary {
+  color: #f16824 !important;
+}
+
+a.text-secondary:hover, a.text-secondary:focus {
+  color: #bc470c !important;
+}
+
+.text-success {
+  color: #28a745 !important;
+}
+
+a.text-success:hover, a.text-success:focus {
+  color: #19692c !important;
+}
+
+.text-info {
+  color: #17a2b8 !important;
+}
+
+a.text-info:hover, a.text-info:focus {
+  color: #0f6674 !important;
+}
+
+.text-warning {
+  color: #ffc107 !important;
+}
+
+a.text-warning:hover, a.text-warning:focus {
+  color: #ba8b00 !important;
+}
+
+.text-danger {
+  color: #dc3545 !important;
+}
+
+a.text-danger:hover, a.text-danger:focus {
+  color: #a71d2a !important;
+}
+
+.text-light {
+  color: #f8f9fa !important;
+}
+
+a.text-light:hover, a.text-light:focus {
+  color: #cbd3da !important;
+}
+
+.text-dark {
+  color: #343a40 !important;
+}
+
+a.text-dark:hover, a.text-dark:focus {
+  color: #121416 !important;
+}
+
+.text-body {
+  color: #212529 !important;
+}
+
+.text-muted {
+  color: #6c757d !important;
+}
+
+.text-black-50 {
+  color: rgba(0, 0, 0, 0.5) !important;
+}
+
+.text-white-50 {
+  color: rgba(255, 255, 255, 0.5) !important;
+}
+
+.text-hide {
+  font: 0/0 a;
+  color: transparent;
+  text-shadow: none;
+  background-color: transparent;
+  border: 0;
+}
+
+.text-decoration-none {
+  text-decoration: none !important;
+}
+
+.text-break {
+  word-break: break-word !important;
+  overflow-wrap: break-word !important;
+}
+
+.text-reset {
+  color: inherit !important;
+}
+
+.visible {
+  visibility: visible !important;
+}
+
+.invisible {
+  visibility: hidden !important;
+}
+
+@media print {
+  *,
+*::before,
+*::after {
+    text-shadow: none !important;
+    box-shadow: none !important;
+  }
+
+  a:not(.btn) {
+    text-decoration: underline;
+  }
+
+  abbr[title]::after {
+    content: " (" attr(title) ")";
+  }
+
+  pre {
+    white-space: pre-wrap !important;
+  }
+
+  pre,
+blockquote {
+    border: 1px solid #adb5bd;
+    page-break-inside: avoid;
+  }
+
+  thead {
+    display: table-header-group;
+  }
+
+  tr,
+img {
+    page-break-inside: avoid;
+  }
+
+  p,
+h2,
+h3 {
+    orphans: 3;
+    widows: 3;
+  }
+
+  h2,
+h3 {
+    page-break-after: avoid;
+  }
+
+  @page {
+    size: a3;
+  }
+  body {
+    min-width: 992px !important;
+  }
+
+  .container {
+    min-width: 992px !important;
+  }
+
+  .navbar {
+    display: none;
+  }
+
+  .badge {
+    border: 1px solid #000;
+  }
+
+  .table {
+    border-collapse: collapse !important;
+  }
+  .table td,
+.table th {
+    background-color: #fff !important;
+  }
+
+  .table-bordered th,
+.table-bordered td {
+    border: 1px solid #dee2e6 !important;
+  }
+
+  .table-dark {
+    color: inherit;
+  }
+  .table-dark th,
+.table-dark td,
+.table-dark thead th,
+.table-dark tbody + tbody {
+    border-color: #dee2e6;
+  }
+
+  .table .thead-dark th {
+    color: inherit;
+    border-color: #dee2e6;
+  }
+}
+.shadow-box, .cmp-shadow-box .cmp-shadow-box-img, .cmp-shadow-box .cmp-shadow-box-quote .cmp-quote {
+  box-shadow: 0 42px 44px 0 rgba(0, 0, 0, 0.05);
+}
+
+.fill-relative-parent, .cmp-shadow-box .cmp-shadow-box-img .cmp-shadow-box-play-container {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.m-4vw {
+  margin: 4.16vw;
+}
+
+.mt-4vw,
+.my-4vw {
+  margin-top: 4.16vw;
+}
+
+.mr-4vw,
+.mx-4vw {
+  margin-right: 4.16vw;
+}
+
+.mb-4vw,
+.my-4vw {
+  margin-bottom: 4.16vw;
+}
+
+.ml-4vw,
+.mx-4vw {
+  margin-left: 4.16vw;
+}
+
+.m-8vw {
+  margin: 8.32vw;
+}
+
+.mt-8vw,
+.my-8vw {
+  margin-top: 8.32vw;
+}
+
+.mr-8vw,
+.mx-8vw {
+  margin-right: 8.32vw;
+}
+
+.mb-8vw,
+.my-8vw {
+  margin-bottom: 8.32vw;
+}
+
+.ml-8vw,
+.mx-8vw {
+  margin-left: 8.32vw;
+}
+
+.m-16vw {
+  margin: 16.64vw;
+}
+
+.mt-16vw,
+.my-16vw {
+  margin-top: 16.64vw;
+}
+
+.mr-16vw,
+.mx-16vw {
+  margin-right: 16.64vw;
+}
+
+.mb-16vw,
+.my-16vw {
+  margin-bottom: 16.64vw;
+}
+
+.ml-16vw,
+.mx-16vw {
+  margin-left: 16.64vw;
+}
+
+.p-4vw {
+  padding: 4.16vw;
+}
+
+.pt-4vw,
+.py-4vw {
+  padding-top: 4.16vw;
+}
+
+.pr-4vw,
+.px-4vw,
+.cmp-shadow-box .cmp-shadow-box-quote .cmp-quote {
+  padding-right: 4.16vw;
+}
+
+.pb-4vw,
+.py-4vw {
+  padding-bottom: 4.16vw;
+}
+
+.pl-4vw,
+.px-4vw,
+.cmp-shadow-box .cmp-shadow-box-quote .cmp-quote {
+  padding-left: 4.16vw;
+}
+
+.p-8vw {
+  padding: 8.32vw;
+}
+
+.pt-8vw,
+.py-8vw,
+.cmp-shadow-box .cmp-shadow-box-quote .cmp-quote {
+  padding-top: 8.32vw;
+}
+
+.pr-8vw,
+.px-8vw {
+  padding-right: 8.32vw;
+}
+
+.pb-8vw,
+.py-8vw,
+.cmp-shadow-box .cmp-shadow-box-quote .cmp-quote {
+  padding-bottom: 8.32vw;
+}
+
+.pl-8vw,
+.px-8vw {
+  padding-left: 8.32vw;
+}
+
+.p-16vw {
+  padding: 16.64vw;
+}
+
+.pt-16vw,
+.py-16vw {
+  padding-top: 16.64vw;
+}
+
+.pr-16vw,
+.px-16vw {
+  padding-right: 16.64vw;
+}
+
+.pb-16vw,
+.py-16vw {
+  padding-bottom: 16.64vw;
+}
+
+.pl-16vw,
+.px-16vw {
+  padding-left: 16.64vw;
+}
+
+.m-n1 {
+  margin: -0.25rem;
+}
+
+.mt-n1,
+.my-n1 {
+  margin-top: -0.25rem;
+}
+
+.mr-n1,
+.mx-n1 {
+  margin-right: -0.25rem;
+}
+
+.mb-n1,
+.my-n1 {
+  margin-bottom: -0.25rem;
+}
+
+.ml-n1,
+.mx-n1 {
+  margin-left: -0.25rem;
+}
+
+.m-n2 {
+  margin: -0.5rem;
+}
+
+.mt-n2,
+.my-n2 {
+  margin-top: -0.5rem;
+}
+
+.mr-n2,
+.mx-n2 {
+  margin-right: -0.5rem;
+}
+
+.mb-n2,
+.my-n2 {
+  margin-bottom: -0.5rem;
+}
+
+.ml-n2,
+.mx-n2 {
+  margin-left: -0.5rem;
+}
+
+.m-n3 {
+  margin: -1rem;
+}
+
+.mt-n3,
+.my-n3 {
+  margin-top: -1rem;
+}
+
+.mr-n3,
+.mx-n3 {
+  margin-right: -1rem;
+}
+
+.mb-n3,
+.my-n3 {
+  margin-bottom: -1rem;
+}
+
+.ml-n3,
+.mx-n3 {
+  margin-left: -1rem;
+}
+
+.m-n4 {
+  margin: -1.5rem;
+}
+
+.mt-n4,
+.my-n4 {
+  margin-top: -1.5rem;
+}
+
+.mr-n4,
+.mx-n4 {
+  margin-right: -1.5rem;
+}
+
+.mb-n4,
+.my-n4 {
+  margin-bottom: -1.5rem;
+}
+
+.ml-n4,
+.mx-n4 {
+  margin-left: -1.5rem;
+}
+
+.m-n5 {
+  margin: -3rem;
+}
+
+.mt-n5,
+.my-n5 {
+  margin-top: -3rem;
+}
+
+.mr-n5,
+.mx-n5 {
+  margin-right: -3rem;
+}
+
+.mb-n5,
+.my-n5 {
+  margin-bottom: -3rem;
+}
+
+.ml-n5,
+.mx-n5 {
+  margin-left: -3rem;
+}
+
+@media (min-width: 576px) {
+  .m-sm-4vw {
+    margin: 4.16vw;
+  }
+
+  .mt-sm-4vw,
+.my-sm-4vw {
+    margin-top: 4.16vw;
+  }
+
+  .mr-sm-4vw,
+.mx-sm-4vw {
+    margin-right: 4.16vw;
+  }
+
+  .mb-sm-4vw,
+.my-sm-4vw {
+    margin-bottom: 4.16vw;
+  }
+
+  .ml-sm-4vw,
+.mx-sm-4vw {
+    margin-left: 4.16vw;
+  }
+
+  .m-sm-8vw {
+    margin: 8.32vw;
+  }
+
+  .mt-sm-8vw,
+.my-sm-8vw {
+    margin-top: 8.32vw;
+  }
+
+  .mr-sm-8vw,
+.mx-sm-8vw {
+    margin-right: 8.32vw;
+  }
+
+  .mb-sm-8vw,
+.my-sm-8vw {
+    margin-bottom: 8.32vw;
+  }
+
+  .ml-sm-8vw,
+.mx-sm-8vw {
+    margin-left: 8.32vw;
+  }
+
+  .m-sm-16vw {
+    margin: 16.64vw;
+  }
+
+  .mt-sm-16vw,
+.my-sm-16vw {
+    margin-top: 16.64vw;
+  }
+
+  .mr-sm-16vw,
+.mx-sm-16vw {
+    margin-right: 16.64vw;
+  }
+
+  .mb-sm-16vw,
+.my-sm-16vw {
+    margin-bottom: 16.64vw;
+  }
+
+  .ml-sm-16vw,
+.mx-sm-16vw {
+    margin-left: 16.64vw;
+  }
+
+  .p-sm-4vw {
+    padding: 4.16vw;
+  }
+
+  .pt-sm-4vw,
+.py-sm-4vw {
+    padding-top: 4.16vw;
+  }
+
+  .pr-sm-4vw,
+.px-sm-4vw {
+    padding-right: 4.16vw;
+  }
+
+  .pb-sm-4vw,
+.py-sm-4vw {
+    padding-bottom: 4.16vw;
+  }
+
+  .pl-sm-4vw,
+.px-sm-4vw {
+    padding-left: 4.16vw;
+  }
+
+  .p-sm-8vw {
+    padding: 8.32vw;
+  }
+
+  .pt-sm-8vw,
+.py-sm-8vw {
+    padding-top: 8.32vw;
+  }
+
+  .pr-sm-8vw,
+.px-sm-8vw {
+    padding-right: 8.32vw;
+  }
+
+  .pb-sm-8vw,
+.py-sm-8vw {
+    padding-bottom: 8.32vw;
+  }
+
+  .pl-sm-8vw,
+.px-sm-8vw {
+    padding-left: 8.32vw;
+  }
+
+  .p-sm-16vw {
+    padding: 16.64vw;
+  }
+
+  .pt-sm-16vw,
+.py-sm-16vw {
+    padding-top: 16.64vw;
+  }
+
+  .pr-sm-16vw,
+.px-sm-16vw {
+    padding-right: 16.64vw;
+  }
+
+  .pb-sm-16vw,
+.py-sm-16vw {
+    padding-bottom: 16.64vw;
+  }
+
+  .pl-sm-16vw,
+.px-sm-16vw {
+    padding-left: 16.64vw;
+  }
+
+  .m-sm-n1 {
+    margin: -0.25rem;
+  }
+
+  .mt-sm-n1,
+.my-sm-n1 {
+    margin-top: -0.25rem;
+  }
+
+  .mr-sm-n1,
+.mx-sm-n1 {
+    margin-right: -0.25rem;
+  }
+
+  .mb-sm-n1,
+.my-sm-n1 {
+    margin-bottom: -0.25rem;
+  }
+
+  .ml-sm-n1,
+.mx-sm-n1 {
+    margin-left: -0.25rem;
+  }
+
+  .m-sm-n2 {
+    margin: -0.5rem;
+  }
+
+  .mt-sm-n2,
+.my-sm-n2 {
+    margin-top: -0.5rem;
+  }
+
+  .mr-sm-n2,
+.mx-sm-n2 {
+    margin-right: -0.5rem;
+  }
+
+  .mb-sm-n2,
+.my-sm-n2 {
+    margin-bottom: -0.5rem;
+  }
+
+  .ml-sm-n2,
+.mx-sm-n2 {
+    margin-left: -0.5rem;
+  }
+
+  .m-sm-n3 {
+    margin: -1rem;
+  }
+
+  .mt-sm-n3,
+.my-sm-n3 {
+    margin-top: -1rem;
+  }
+
+  .mr-sm-n3,
+.mx-sm-n3 {
+    margin-right: -1rem;
+  }
+
+  .mb-sm-n3,
+.my-sm-n3 {
+    margin-bottom: -1rem;
+  }
+
+  .ml-sm-n3,
+.mx-sm-n3 {
+    margin-left: -1rem;
+  }
+
+  .m-sm-n4 {
+    margin: -1.5rem;
+  }
+
+  .mt-sm-n4,
+.my-sm-n4 {
+    margin-top: -1.5rem;
+  }
+
+  .mr-sm-n4,
+.mx-sm-n4 {
+    margin-right: -1.5rem;
+  }
+
+  .mb-sm-n4,
+.my-sm-n4 {
+    margin-bottom: -1.5rem;
+  }
+
+  .ml-sm-n4,
+.mx-sm-n4 {
+    margin-left: -1.5rem;
+  }
+
+  .m-sm-n5 {
+    margin: -3rem;
+  }
+
+  .mt-sm-n5,
+.my-sm-n5 {
+    margin-top: -3rem;
+  }
+
+  .mr-sm-n5,
+.mx-sm-n5 {
+    margin-right: -3rem;
+  }
+
+  .mb-sm-n5,
+.my-sm-n5 {
+    margin-bottom: -3rem;
+  }
+
+  .ml-sm-n5,
+.mx-sm-n5 {
+    margin-left: -3rem;
+  }
+}
+@media (min-width: 768px) {
+  .m-md-4vw {
+    margin: 4.16vw;
+  }
+
+  .mt-md-4vw,
+.my-md-4vw,
+.cmp-shadow-box .cmp-shadow-box-quote .cmp-quote {
+    margin-top: 4.16vw;
+  }
+
+  .mr-md-4vw,
+.mx-md-4vw {
+    margin-right: 4.16vw;
+  }
+
+  .mb-md-4vw,
+.my-md-4vw,
+.cmp-shadow-box .cmp-shadow-box-quote .cmp-quote {
+    margin-bottom: 4.16vw;
+  }
+
+  .ml-md-4vw,
+.mx-md-4vw {
+    margin-left: 4.16vw;
+  }
+
+  .m-md-8vw {
+    margin: 8.32vw;
+  }
+
+  .mt-md-8vw,
+.my-md-8vw {
+    margin-top: 8.32vw;
+  }
+
+  .mr-md-8vw,
+.mx-md-8vw {
+    margin-right: 8.32vw;
+  }
+
+  .mb-md-8vw,
+.my-md-8vw {
+    margin-bottom: 8.32vw;
+  }
+
+  .ml-md-8vw,
+.mx-md-8vw {
+    margin-left: 8.32vw;
+  }
+
+  .m-md-16vw {
+    margin: 16.64vw;
+  }
+
+  .mt-md-16vw,
+.my-md-16vw {
+    margin-top: 16.64vw;
+  }
+
+  .mr-md-16vw,
+.mx-md-16vw {
+    margin-right: 16.64vw;
+  }
+
+  .mb-md-16vw,
+.my-md-16vw {
+    margin-bottom: 16.64vw;
+  }
+
+  .ml-md-16vw,
+.mx-md-16vw {
+    margin-left: 16.64vw;
+  }
+
+  .p-md-4vw {
+    padding: 4.16vw;
+  }
+
+  .pt-md-4vw,
+.py-md-4vw {
+    padding-top: 4.16vw;
+  }
+
+  .pr-md-4vw,
+.px-md-4vw {
+    padding-right: 4.16vw;
+  }
+
+  .pb-md-4vw,
+.py-md-4vw {
+    padding-bottom: 4.16vw;
+  }
+
+  .pl-md-4vw,
+.px-md-4vw {
+    padding-left: 4.16vw;
+  }
+
+  .p-md-8vw {
+    padding: 8.32vw;
+  }
+
+  .pt-md-8vw,
+.py-md-8vw {
+    padding-top: 8.32vw;
+  }
+
+  .pr-md-8vw,
+.px-md-8vw {
+    padding-right: 8.32vw;
+  }
+
+  .pb-md-8vw,
+.py-md-8vw {
+    padding-bottom: 8.32vw;
+  }
+
+  .pl-md-8vw,
+.px-md-8vw {
+    padding-left: 8.32vw;
+  }
+
+  .p-md-16vw {
+    padding: 16.64vw;
+  }
+
+  .pt-md-16vw,
+.py-md-16vw {
+    padding-top: 16.64vw;
+  }
+
+  .pr-md-16vw,
+.px-md-16vw {
+    padding-right: 16.64vw;
+  }
+
+  .pb-md-16vw,
+.py-md-16vw {
+    padding-bottom: 16.64vw;
+  }
+
+  .pl-md-16vw,
+.px-md-16vw {
+    padding-left: 16.64vw;
+  }
+
+  .m-md-n1 {
+    margin: -0.25rem;
+  }
+
+  .mt-md-n1,
+.my-md-n1 {
+    margin-top: -0.25rem;
+  }
+
+  .mr-md-n1,
+.mx-md-n1 {
+    margin-right: -0.25rem;
+  }
+
+  .mb-md-n1,
+.my-md-n1 {
+    margin-bottom: -0.25rem;
+  }
+
+  .ml-md-n1,
+.mx-md-n1 {
+    margin-left: -0.25rem;
+  }
+
+  .m-md-n2 {
+    margin: -0.5rem;
+  }
+
+  .mt-md-n2,
+.my-md-n2 {
+    margin-top: -0.5rem;
+  }
+
+  .mr-md-n2,
+.mx-md-n2 {
+    margin-right: -0.5rem;
+  }
+
+  .mb-md-n2,
+.my-md-n2 {
+    margin-bottom: -0.5rem;
+  }
+
+  .ml-md-n2,
+.mx-md-n2 {
+    margin-left: -0.5rem;
+  }
+
+  .m-md-n3 {
+    margin: -1rem;
+  }
+
+  .mt-md-n3,
+.my-md-n3 {
+    margin-top: -1rem;
+  }
+
+  .mr-md-n3,
+.mx-md-n3 {
+    margin-right: -1rem;
+  }
+
+  .mb-md-n3,
+.my-md-n3 {
+    margin-bottom: -1rem;
+  }
+
+  .ml-md-n3,
+.mx-md-n3 {
+    margin-left: -1rem;
+  }
+
+  .m-md-n4 {
+    margin: -1.5rem;
+  }
+
+  .mt-md-n4,
+.my-md-n4 {
+    margin-top: -1.5rem;
+  }
+
+  .mr-md-n4,
+.mx-md-n4 {
+    margin-right: -1.5rem;
+  }
+
+  .mb-md-n4,
+.my-md-n4 {
+    margin-bottom: -1.5rem;
+  }
+
+  .ml-md-n4,
+.mx-md-n4 {
+    margin-left: -1.5rem;
+  }
+
+  .m-md-n5 {
+    margin: -3rem;
+  }
+
+  .mt-md-n5,
+.my-md-n5 {
+    margin-top: -3rem;
+  }
+
+  .mr-md-n5,
+.mx-md-n5 {
+    margin-right: -3rem;
+  }
+
+  .mb-md-n5,
+.my-md-n5 {
+    margin-bottom: -3rem;
+  }
+
+  .ml-md-n5,
+.mx-md-n5 {
+    margin-left: -3rem;
+  }
+}
+@media (min-width: 992px) {
+  .m-lg-4vw {
+    margin: 4.16vw;
+  }
+
+  .mt-lg-4vw,
+.my-lg-4vw {
+    margin-top: 4.16vw;
+  }
+
+  .mr-lg-4vw,
+.mx-lg-4vw {
+    margin-right: 4.16vw;
+  }
+
+  .mb-lg-4vw,
+.my-lg-4vw {
+    margin-bottom: 4.16vw;
+  }
+
+  .ml-lg-4vw,
+.mx-lg-4vw {
+    margin-left: 4.16vw;
+  }
+
+  .m-lg-8vw {
+    margin: 8.32vw;
+  }
+
+  .mt-lg-8vw,
+.my-lg-8vw {
+    margin-top: 8.32vw;
+  }
+
+  .mr-lg-8vw,
+.mx-lg-8vw {
+    margin-right: 8.32vw;
+  }
+
+  .mb-lg-8vw,
+.my-lg-8vw {
+    margin-bottom: 8.32vw;
+  }
+
+  .ml-lg-8vw,
+.mx-lg-8vw {
+    margin-left: 8.32vw;
+  }
+
+  .m-lg-16vw {
+    margin: 16.64vw;
+  }
+
+  .mt-lg-16vw,
+.my-lg-16vw {
+    margin-top: 16.64vw;
+  }
+
+  .mr-lg-16vw,
+.mx-lg-16vw {
+    margin-right: 16.64vw;
+  }
+
+  .mb-lg-16vw,
+.my-lg-16vw {
+    margin-bottom: 16.64vw;
+  }
+
+  .ml-lg-16vw,
+.mx-lg-16vw {
+    margin-left: 16.64vw;
+  }
+
+  .p-lg-4vw {
+    padding: 4.16vw;
+  }
+
+  .pt-lg-4vw,
+.py-lg-4vw {
+    padding-top: 4.16vw;
+  }
+
+  .pr-lg-4vw,
+.px-lg-4vw {
+    padding-right: 4.16vw;
+  }
+
+  .pb-lg-4vw,
+.py-lg-4vw {
+    padding-bottom: 4.16vw;
+  }
+
+  .pl-lg-4vw,
+.px-lg-4vw {
+    padding-left: 4.16vw;
+  }
+
+  .p-lg-8vw {
+    padding: 8.32vw;
+  }
+
+  .pt-lg-8vw,
+.py-lg-8vw {
+    padding-top: 8.32vw;
+  }
+
+  .pr-lg-8vw,
+.px-lg-8vw {
+    padding-right: 8.32vw;
+  }
+
+  .pb-lg-8vw,
+.py-lg-8vw {
+    padding-bottom: 8.32vw;
+  }
+
+  .pl-lg-8vw,
+.px-lg-8vw {
+    padding-left: 8.32vw;
+  }
+
+  .p-lg-16vw {
+    padding: 16.64vw;
+  }
+
+  .pt-lg-16vw,
+.py-lg-16vw {
+    padding-top: 16.64vw;
+  }
+
+  .pr-lg-16vw,
+.px-lg-16vw {
+    padding-right: 16.64vw;
+  }
+
+  .pb-lg-16vw,
+.py-lg-16vw {
+    padding-bottom: 16.64vw;
+  }
+
+  .pl-lg-16vw,
+.px-lg-16vw {
+    padding-left: 16.64vw;
+  }
+
+  .m-lg-n1 {
+    margin: -0.25rem;
+  }
+
+  .mt-lg-n1,
+.my-lg-n1 {
+    margin-top: -0.25rem;
+  }
+
+  .mr-lg-n1,
+.mx-lg-n1 {
+    margin-right: -0.25rem;
+  }
+
+  .mb-lg-n1,
+.my-lg-n1 {
+    margin-bottom: -0.25rem;
+  }
+
+  .ml-lg-n1,
+.mx-lg-n1 {
+    margin-left: -0.25rem;
+  }
+
+  .m-lg-n2 {
+    margin: -0.5rem;
+  }
+
+  .mt-lg-n2,
+.my-lg-n2 {
+    margin-top: -0.5rem;
+  }
+
+  .mr-lg-n2,
+.mx-lg-n2 {
+    margin-right: -0.5rem;
+  }
+
+  .mb-lg-n2,
+.my-lg-n2 {
+    margin-bottom: -0.5rem;
+  }
+
+  .ml-lg-n2,
+.mx-lg-n2 {
+    margin-left: -0.5rem;
+  }
+
+  .m-lg-n3 {
+    margin: -1rem;
+  }
+
+  .mt-lg-n3,
+.my-lg-n3 {
+    margin-top: -1rem;
+  }
+
+  .mr-lg-n3,
+.mx-lg-n3 {
+    margin-right: -1rem;
+  }
+
+  .mb-lg-n3,
+.my-lg-n3 {
+    margin-bottom: -1rem;
+  }
+
+  .ml-lg-n3,
+.mx-lg-n3 {
+    margin-left: -1rem;
+  }
+
+  .m-lg-n4 {
+    margin: -1.5rem;
+  }
+
+  .mt-lg-n4,
+.my-lg-n4 {
+    margin-top: -1.5rem;
+  }
+
+  .mr-lg-n4,
+.mx-lg-n4 {
+    margin-right: -1.5rem;
+  }
+
+  .mb-lg-n4,
+.my-lg-n4 {
+    margin-bottom: -1.5rem;
+  }
+
+  .ml-lg-n4,
+.mx-lg-n4 {
+    margin-left: -1.5rem;
+  }
+
+  .m-lg-n5 {
+    margin: -3rem;
+  }
+
+  .mt-lg-n5,
+.my-lg-n5 {
+    margin-top: -3rem;
+  }
+
+  .mr-lg-n5,
+.mx-lg-n5 {
+    margin-right: -3rem;
+  }
+
+  .mb-lg-n5,
+.my-lg-n5 {
+    margin-bottom: -3rem;
+  }
+
+  .ml-lg-n5,
+.mx-lg-n5 {
+    margin-left: -3rem;
+  }
+}
+@media (min-width: 1200px) {
+  .m-xl-4vw {
+    margin: 4.16vw;
+  }
+
+  .mt-xl-4vw,
+.my-xl-4vw {
+    margin-top: 4.16vw;
+  }
+
+  .mr-xl-4vw,
+.mx-xl-4vw {
+    margin-right: 4.16vw;
+  }
+
+  .mb-xl-4vw,
+.my-xl-4vw {
+    margin-bottom: 4.16vw;
+  }
+
+  .ml-xl-4vw,
+.mx-xl-4vw {
+    margin-left: 4.16vw;
+  }
+
+  .m-xl-8vw {
+    margin: 8.32vw;
+  }
+
+  .mt-xl-8vw,
+.my-xl-8vw {
+    margin-top: 8.32vw;
+  }
+
+  .mr-xl-8vw,
+.mx-xl-8vw {
+    margin-right: 8.32vw;
+  }
+
+  .mb-xl-8vw,
+.my-xl-8vw {
+    margin-bottom: 8.32vw;
+  }
+
+  .ml-xl-8vw,
+.mx-xl-8vw {
+    margin-left: 8.32vw;
+  }
+
+  .m-xl-16vw {
+    margin: 16.64vw;
+  }
+
+  .mt-xl-16vw,
+.my-xl-16vw {
+    margin-top: 16.64vw;
+  }
+
+  .mr-xl-16vw,
+.mx-xl-16vw {
+    margin-right: 16.64vw;
+  }
+
+  .mb-xl-16vw,
+.my-xl-16vw {
+    margin-bottom: 16.64vw;
+  }
+
+  .ml-xl-16vw,
+.mx-xl-16vw {
+    margin-left: 16.64vw;
+  }
+
+  .p-xl-4vw {
+    padding: 4.16vw;
+  }
+
+  .pt-xl-4vw,
+.py-xl-4vw {
+    padding-top: 4.16vw;
+  }
+
+  .pr-xl-4vw,
+.px-xl-4vw {
+    padding-right: 4.16vw;
+  }
+
+  .pb-xl-4vw,
+.py-xl-4vw {
+    padding-bottom: 4.16vw;
+  }
+
+  .pl-xl-4vw,
+.px-xl-4vw {
+    padding-left: 4.16vw;
+  }
+
+  .p-xl-8vw {
+    padding: 8.32vw;
+  }
+
+  .pt-xl-8vw,
+.py-xl-8vw {
+    padding-top: 8.32vw;
+  }
+
+  .pr-xl-8vw,
+.px-xl-8vw {
+    padding-right: 8.32vw;
+  }
+
+  .pb-xl-8vw,
+.py-xl-8vw {
+    padding-bottom: 8.32vw;
+  }
+
+  .pl-xl-8vw,
+.px-xl-8vw {
+    padding-left: 8.32vw;
+  }
+
+  .p-xl-16vw {
+    padding: 16.64vw;
+  }
+
+  .pt-xl-16vw,
+.py-xl-16vw {
+    padding-top: 16.64vw;
+  }
+
+  .pr-xl-16vw,
+.px-xl-16vw {
+    padding-right: 16.64vw;
+  }
+
+  .pb-xl-16vw,
+.py-xl-16vw {
+    padding-bottom: 16.64vw;
+  }
+
+  .pl-xl-16vw,
+.px-xl-16vw {
+    padding-left: 16.64vw;
+  }
+
+  .m-xl-n1 {
+    margin: -0.25rem;
+  }
+
+  .mt-xl-n1,
+.my-xl-n1 {
+    margin-top: -0.25rem;
+  }
+
+  .mr-xl-n1,
+.mx-xl-n1 {
+    margin-right: -0.25rem;
+  }
+
+  .mb-xl-n1,
+.my-xl-n1 {
+    margin-bottom: -0.25rem;
+  }
+
+  .ml-xl-n1,
+.mx-xl-n1 {
+    margin-left: -0.25rem;
+  }
+
+  .m-xl-n2 {
+    margin: -0.5rem;
+  }
+
+  .mt-xl-n2,
+.my-xl-n2 {
+    margin-top: -0.5rem;
+  }
+
+  .mr-xl-n2,
+.mx-xl-n2 {
+    margin-right: -0.5rem;
+  }
+
+  .mb-xl-n2,
+.my-xl-n2 {
+    margin-bottom: -0.5rem;
+  }
+
+  .ml-xl-n2,
+.mx-xl-n2 {
+    margin-left: -0.5rem;
+  }
+
+  .m-xl-n3 {
+    margin: -1rem;
+  }
+
+  .mt-xl-n3,
+.my-xl-n3 {
+    margin-top: -1rem;
+  }
+
+  .mr-xl-n3,
+.mx-xl-n3 {
+    margin-right: -1rem;
+  }
+
+  .mb-xl-n3,
+.my-xl-n3 {
+    margin-bottom: -1rem;
+  }
+
+  .ml-xl-n3,
+.mx-xl-n3 {
+    margin-left: -1rem;
+  }
+
+  .m-xl-n4 {
+    margin: -1.5rem;
+  }
+
+  .mt-xl-n4,
+.my-xl-n4 {
+    margin-top: -1.5rem;
+  }
+
+  .mr-xl-n4,
+.mx-xl-n4 {
+    margin-right: -1.5rem;
+  }
+
+  .mb-xl-n4,
+.my-xl-n4 {
+    margin-bottom: -1.5rem;
+  }
+
+  .ml-xl-n4,
+.mx-xl-n4 {
+    margin-left: -1.5rem;
+  }
+
+  .m-xl-n5 {
+    margin: -3rem;
+  }
+
+  .mt-xl-n5,
+.my-xl-n5 {
+    margin-top: -3rem;
+  }
+
+  .mr-xl-n5,
+.mx-xl-n5 {
+    margin-right: -3rem;
+  }
+
+  .mb-xl-n5,
+.my-xl-n5 {
+    margin-bottom: -3rem;
+  }
+
+  .ml-xl-n5,
+.mx-xl-n5 {
+    margin-left: -3rem;
+  }
+}
+/* ======================= */
+@font-face {
+  font-family: "Gotham";
+  src: local("Gotham Medium"), local("Gotham-Medium"), url(/css/Gotham-Medium.b074dd9f.woff);
+  font-weight: 500;
+  font-style: normal;
+}
+@font-face {
+  font-family: "Gotham Ultra";
+  src: local("Gotham Ultra"), local("Gotham-Ultra"), url(/css/Gotham-Ultra.2d842462.woff);
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: "Gotham Book";
+  src: local("Gotham Book"), local("Gotham-Book"), url(/css/Gotham-Book.9316bc27.woff);
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: "Gotham";
+  src: local("Gotham Light"), local("Gotham-Light"), url(/css/Gotham-Light.23be3122.woff);
+  font-weight: 300;
+  font-style: normal;
+}
+@font-face {
+  font-family: "Gotham";
+  src: local("Gotham Thin"), local("Gotham-Thin"), url(/css/Gotham-Thin.cb57ce42.woff);
+  font-weight: 100;
+  font-style: normal;
+}
+@font-face {
+  font-family: "Gotham";
+  src: local("Gotham Bold"), local("Gotham-Bold"), url(/css/Gotham-Bold.7f7e1605.woff);
+  font-weight: bold;
+  font-style: normal;
+}
+html, body {
+  font-family: "Gotham";
+}
+
+/**
+ *  Main css for Header
+ */
+.cmp-header {
+  color: #1b3d6e;
+}
+.cmp-header + .cmp-skew {
+  z-index: -1;
+}
+.cmp-header .navbar-link:not(.is-arrowless)::after {
+  right: 2.025em;
+  font-size: 0.7rem;
+  margin-top: -0.475em;
+}
+.cmp-header .cmp-header__nav-setup nav {
+  z-index: 32;
+}
+.cmp-header .cmp-header__nav-setup ul {
+  -webkit-box-pack: end;
+          justify-content: flex-end;
+}
+.cmp-header .cmp-header__nav-setup {
+  font-size: 12px;
+}
+.cmp-header .cmp-header__nav-setup .dropdown-menu.show {
+  padding: 0;
+  color: #1b3d6e;
+  font-size: 12px;
+  border: none;
+  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.2);
+}
+.cmp-header .cmp-header__nav-setup .dropdown-menu.show .dropdown-item:hover,
+.cmp-header .cmp-header__nav-setup .dropdown-menu.show .dropdown-item:focus {
+  color: white;
+  text-decoration: none;
+  background-color: #f16824;
+}
+.cmp-header .cmp-header__nav-menu .navbar {
+  padding: 0px;
+  -webkit-box-align: start;
+          align-items: flex-start;
+  box-shadow: 0px 23px 37px -30px black;
+}
+.cmp-header .cmp-header__nav-menu .navbar-brand {
+  width: 280px;
+  text-align: center;
+}
+.cmp-header .cmp-header__nav-menu .navbar-brand img {
+  width: 196px;
+}
+.cmp-header .cmp-header__nav-menu .logo {
+  height: 90px;
+}
+.cmp-header .cmp-header__nav-menu .logo hr.sublogo {
+  border: 4px solid #1b3e6f;
+  position: absolute;
+  top: 100%;
+  left: 0;
+  z-index: 32;
+  margin-top: 0;
+  width: 275px;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-link.dropdown-toggle::after {
+  content: none;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-link {
+  padding: 11px 0px;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-link:hover {
+  padding-bottom: 9px;
+  border-bottom: 2px solid #f16824;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-link.no-submenu {
+  padding: 10px 35px;
+  border: 2px solid #f16824;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-submenu {
+  background-color: white;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-submenu .submenu-empty-filler {
+  -webkit-box-flex: 0;
+  flex: 0 0 10%;
+  max-width: 10%;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-submenu .card-columns.col-lg-9.mt-lg-5 {
+  -webkit-column-count: 4 !important;
+     -moz-column-count: 4 !important;
+          column-count: 4 !important;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-submenu .nav-group {
+  display: inline-block;
+  width: 100%;
+  font-size: 14px;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-submenu .nav-group .submenu-title {
+  line-height: 2.43;
+  letter-spacing: 0.78px;
+  text-transform: uppercase;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-submenu .nav-group ul {
+  list-style: none;
+  padding: 0;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item .nav-submenu .nav-group li a {
+  line-height: 2.14;
+  font-weight: 300;
+}
+.cmp-header .cmp-header__nav-menu .navbar-end {
+  padding-top: 11px;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item.nav-item {
+  padding-bottom: 42px;
+}
+.cmp-header .cmp-header__nav-menu .nav-submenu {
+  display: none;
+  position: absolute;
+  left: 0;
+  right: 0;
+  margin-top: 44px;
+  padding: 0 15px 40px;
+  min-height: 340px;
+}
+.cmp-header .cmp-header__nav-menu .nav-menu-item.nav-item:hover .nav-submenu {
+  display: -webkit-box;
+  display: flex;
+  z-index: 1;
+}
+.cmp-header .blue-filler {
+  background-color: #1b3e6f;
+  opacity: 0.7;
+  width: 100%;
+  height: 1000px;
+}
+.cmp-header .cmp-header__mobile a:hover {
+  text-decoration: none;
+  color: #1b3d6e;
+}
+.cmp-header .cmp-header__mobile .mobile-header {
+  height: 70px;
+  position: relative;
+  padding: 20px 15px;
+}
+.cmp-header .cmp-header__mobile .mobile-header hr.sublogo {
+  border: 4px solid #1b3d6e;
+  position: absolute;
+  top: 100%;
+  left: 0;
+  margin-top: 0;
+  width: 60%;
+}
+.cmp-header .cmp-header__mobile .mobile-header .navbar-item {
+  display: inline-block;
+}
+.cmp-header .cmp-header__mobile .mobile-header .logo {
+  padding-right: 0;
+  text-align: center;
+}
+.cmp-header .cmp-header__mobile .mobile-header .logo .cmp-image {
+  width: 100%;
+  max-width: 140px;
+}
+.cmp-header .cmp-header__mobile .mobile-header .search-icon,
+.cmp-header .cmp-header__mobile .mobile-header .cart-icon {
+  max-width: 24px;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup {
+  background: white;
+  display: none;
+  overflow: hidden;
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  width: 0;
+  -webkit-transition: 0.5s;
+  transition: 0.5s;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup ul {
+  padding: 0;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .navbar {
+  padding: 0;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .navbar-dropdown {
+  height: 0;
+  overflow: hidden;
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .navbar-menu {
+  width: 100%;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .menu-head {
+  height: 0;
+  padding: 24px;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .menu-head .close-menu,
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .menu-head .menu-back {
+  font-size: 40px;
+  margin-top: -30px;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .menu-head .close-menu {
+  float: right;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .menu-head .menu-back {
+  float: left;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .main-navbar-item,
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .secondary-navbar-item,
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .submenu-navbar-item,
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .lastLevel-navbar-item,
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .secondary-dropdown-item {
+  list-style: none;
+  font-size: 14px;
+  padding: 24px;
+  text-transform: uppercase;
+  width: 100%;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .selected-item {
+  background-color: #1b3d6e;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .selected-item a {
+  color: white;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .lastLevel-navbar-item,
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .secondary-dropdown-item {
+  font-weight: 300;
+  padding-left: 64px;
+  color: #54565a;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .submenu-navbar {
+  background: white;
+  display: none;
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+}
+.cmp-header .cmp-header__mobile .cmp-header-mobile__nav-setup .submenu-navbar .lastLevel-navbar {
+  height: 0;
+  overflow: hidden;
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+}
+
+/**
+ *  Main css for Button
+ */
+.cmp-button {
+  color: #1b3d6e;
+  border-width: 2px;
+  text-transform: uppercase;
+  font-size: 0.75rem;
+  font-weight: bold;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: normal;
+  letter-spacing: normal;
+}
+
+/**
+ *  Main css for Jumbo
+ */
+.cmp-jumbo .cmp-jumbo__headingh1 {
+  margin-bottom: 2rem;
+  font-size: 2rem;
+  font-weight: bold;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: 1;
+  letter-spacing: 0.53px;
+}
+.cmp-jumbo .cmp-threelines {
+  margin-bottom: 2rem;
+}
+.cmp-jumbo .cmp-text {
+  margin-bottom: 2rem;
+  font-size: 0.875rem;
+  font-weight: normal;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: 1.75;
+  letter-spacing: normal;
+}
+.cmp-jumbo.cmp-jumbo__simple {
+  text-align: center;
+}
+.cmp-jumbo.cmp-jumbo__simple .cmp-jumbo__heading {
+  margin-bottom: 2rem;
+}
+@media (min-width: 992px) {
+  .cmp-jumbo .cmp-jumbo__headingh1 {
+    margin-bottom: 1.5rem;
+    font-size: 3.75rem;
+    letter-spacing: 1px;
+  }
+  .cmp-jumbo .cmp-text {
+    font-size: 1.25rem;
+    line-height: 1.5;
+  }
+}
+
+/**
+ *  Main css for Skew
+ */
+.cmp-skew {
+  min-height: 300px;
+  background-color: lightblue;
+  overflow-x: hidden;
+}
+.cmp-skew.bg-transparent {
+  background-color: transparent;
+}
+.cmp-skew > .cmp-image {
+  position: absolute;
+  z-index: -1;
+  height: 100%;
+  width: 100%;
+  -o-object-fit: cover;
+     object-fit: cover;
+}
+
+.overflow-unset {
+  overflow: unset;
+}
+
+/**
+ *  Main css for Section
+ */
+.cmp-section {
+  min-height: 300px;
+  max-width: 100vw;
+}
+.cmp-section .inner-section {
+  border: red solid 1px;
+}
+
+.bg-blue {
+  background-color: lightblue;
+}
+
+.skew-30 {
+  -webkit-transform: skewY(30deg);
+          transform: skewY(30deg);
+}
+
+.skew-0 {
+  -webkit-transform: skewY(0deg) translateY(0vw);
+          transform: skewY(0deg) translateY(0vw);
+  padding-top: 0vw;
+  padding-bottom: 0vw;
+}
+.skew-0 .inner-section {
+  -webkit-transform: skewY(0deg);
+          transform: skewY(0deg);
+}
+.skew-0.overlap-prev-section {
+  -webkit-transform: skewY(0deg) translateY(0vw);
+          transform: skewY(0deg) translateY(0vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-0 {
+    -webkit-transform: skewY(0deg) translateY(0vw);
+            transform: skewY(0deg) translateY(0vw);
+    padding-top: 0vw;
+    padding-bottom: 0vw;
+  }
+  .skew-md-0 .inner-section {
+    -webkit-transform: skewY(0deg);
+            transform: skewY(0deg);
+  }
+  .skew-md-0.overlap-prev-section {
+    -webkit-transform: skewY(0deg) translateY(0vw);
+            transform: skewY(0deg) translateY(0vw);
+  }
+}
+.overlap-next-0 + .cmp-skew {
+  -webkit-transform: skewY(0deg) translateY(0vw);
+          transform: skewY(0deg) translateY(0vw);
+  padding-top: 0vw;
+  padding-bottom: 0vw;
+}
+.overlap-next-0 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(0deg);
+          transform: skewY(0deg);
+}
+
+.skew-padding-bottom-0 {
+  padding-bottom: 0vw;
+}
+
+.skew-1 {
+  -webkit-transform: skewY(1deg) translateY(0.8727532464vw);
+          transform: skewY(1deg) translateY(0.8727532464vw);
+  padding-top: 0.8727532464vw;
+  padding-bottom: 0.8727532464vw;
+}
+.skew-1 .inner-section {
+  -webkit-transform: skewY(-1deg);
+          transform: skewY(-1deg);
+}
+.skew-1.overlap-prev-section {
+  -webkit-transform: skewY(1deg) translateY(-0.8727532464vw);
+          transform: skewY(1deg) translateY(-0.8727532464vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-1 {
+    -webkit-transform: skewY(1deg) translateY(0.8727532464vw);
+            transform: skewY(1deg) translateY(0.8727532464vw);
+    padding-top: 0.8727532464vw;
+    padding-bottom: 0.8727532464vw;
+  }
+  .skew-md-1 .inner-section {
+    -webkit-transform: skewY(-1deg);
+            transform: skewY(-1deg);
+  }
+  .skew-md-1.overlap-prev-section {
+    -webkit-transform: skewY(1deg) translateY(-0.8727532464vw);
+            transform: skewY(1deg) translateY(-0.8727532464vw);
+  }
+}
+.overlap-next-1 + .cmp-skew {
+  -webkit-transform: skewY(1deg) translateY(-0.8727532464vw);
+          transform: skewY(1deg) translateY(-0.8727532464vw);
+  padding-top: 0.8727532464vw;
+  padding-bottom: 0.8727532464vw;
+}
+.overlap-next-1 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-1deg);
+          transform: skewY(-1deg);
+}
+
+.skew-padding-bottom-1 {
+  padding-bottom: 1.7455064928vw;
+}
+
+.skew-2 {
+  -webkit-transform: skewY(2deg) translateY(1.7460384746vw);
+          transform: skewY(2deg) translateY(1.7460384746vw);
+  padding-top: 1.7460384746vw;
+  padding-bottom: 1.7460384746vw;
+}
+.skew-2 .inner-section {
+  -webkit-transform: skewY(-2deg);
+          transform: skewY(-2deg);
+}
+.skew-2.overlap-prev-section {
+  -webkit-transform: skewY(2deg) translateY(-1.7460384746vw);
+          transform: skewY(2deg) translateY(-1.7460384746vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-2 {
+    -webkit-transform: skewY(2deg) translateY(1.7460384746vw);
+            transform: skewY(2deg) translateY(1.7460384746vw);
+    padding-top: 1.7460384746vw;
+    padding-bottom: 1.7460384746vw;
+  }
+  .skew-md-2 .inner-section {
+    -webkit-transform: skewY(-2deg);
+            transform: skewY(-2deg);
+  }
+  .skew-md-2.overlap-prev-section {
+    -webkit-transform: skewY(2deg) translateY(-1.7460384746vw);
+            transform: skewY(2deg) translateY(-1.7460384746vw);
+  }
+}
+.overlap-next-2 + .cmp-skew {
+  -webkit-transform: skewY(2deg) translateY(-1.7460384746vw);
+          transform: skewY(2deg) translateY(-1.7460384746vw);
+  padding-top: 1.7460384746vw;
+  padding-bottom: 1.7460384746vw;
+}
+.overlap-next-2 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-2deg);
+          transform: skewY(-2deg);
+}
+
+.skew-padding-bottom-2 {
+  padding-bottom: 3.4920769492vw;
+}
+
+.skew-3 {
+  -webkit-transform: skewY(3deg) translateY(2.6203889642vw);
+          transform: skewY(3deg) translateY(2.6203889642vw);
+  padding-top: 2.6203889642vw;
+  padding-bottom: 2.6203889642vw;
+}
+.skew-3 .inner-section {
+  -webkit-transform: skewY(-3deg);
+          transform: skewY(-3deg);
+}
+.skew-3.overlap-prev-section {
+  -webkit-transform: skewY(3deg) translateY(-2.6203889642vw);
+          transform: skewY(3deg) translateY(-2.6203889642vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-3 {
+    -webkit-transform: skewY(3deg) translateY(2.6203889642vw);
+            transform: skewY(3deg) translateY(2.6203889642vw);
+    padding-top: 2.6203889642vw;
+    padding-bottom: 2.6203889642vw;
+  }
+  .skew-md-3 .inner-section {
+    -webkit-transform: skewY(-3deg);
+            transform: skewY(-3deg);
+  }
+  .skew-md-3.overlap-prev-section {
+    -webkit-transform: skewY(3deg) translateY(-2.6203889642vw);
+            transform: skewY(3deg) translateY(-2.6203889642vw);
+  }
+}
+.overlap-next-3 + .cmp-skew {
+  -webkit-transform: skewY(3deg) translateY(-2.6203889642vw);
+          transform: skewY(3deg) translateY(-2.6203889642vw);
+  padding-top: 2.6203889642vw;
+  padding-bottom: 2.6203889642vw;
+}
+.overlap-next-3 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-3deg);
+          transform: skewY(-3deg);
+}
+
+.skew-padding-bottom-3 {
+  padding-bottom: 5.2407779283vw;
+}
+
+.skew-4 {
+  -webkit-transform: skewY(4deg) translateY(3.4963405972vw);
+          transform: skewY(4deg) translateY(3.4963405972vw);
+  padding-top: 3.4963405972vw;
+  padding-bottom: 3.4963405972vw;
+}
+.skew-4 .inner-section {
+  -webkit-transform: skewY(-4deg);
+          transform: skewY(-4deg);
+}
+.skew-4.overlap-prev-section {
+  -webkit-transform: skewY(4deg) translateY(-3.4963405972vw);
+          transform: skewY(4deg) translateY(-3.4963405972vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-4 {
+    -webkit-transform: skewY(4deg) translateY(3.4963405972vw);
+            transform: skewY(4deg) translateY(3.4963405972vw);
+    padding-top: 3.4963405972vw;
+    padding-bottom: 3.4963405972vw;
+  }
+  .skew-md-4 .inner-section {
+    -webkit-transform: skewY(-4deg);
+            transform: skewY(-4deg);
+  }
+  .skew-md-4.overlap-prev-section {
+    -webkit-transform: skewY(4deg) translateY(-3.4963405972vw);
+            transform: skewY(4deg) translateY(-3.4963405972vw);
+  }
+}
+.overlap-next-4 + .cmp-skew {
+  -webkit-transform: skewY(4deg) translateY(-3.4963405972vw);
+          transform: skewY(4deg) translateY(-3.4963405972vw);
+  padding-top: 3.4963405972vw;
+  padding-bottom: 3.4963405972vw;
+}
+.overlap-next-4 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-4deg);
+          transform: skewY(-4deg);
+}
+
+.skew-padding-bottom-4 {
+  padding-bottom: 6.9926811944vw;
+}
+
+.skew-5 {
+  -webkit-transform: skewY(5deg) translateY(4.3744331763vw);
+          transform: skewY(5deg) translateY(4.3744331763vw);
+  padding-top: 4.3744331763vw;
+  padding-bottom: 4.3744331763vw;
+}
+.skew-5 .inner-section {
+  -webkit-transform: skewY(-5deg);
+          transform: skewY(-5deg);
+}
+.skew-5.overlap-prev-section {
+  -webkit-transform: skewY(5deg) translateY(-4.3744331763vw);
+          transform: skewY(5deg) translateY(-4.3744331763vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-5 {
+    -webkit-transform: skewY(5deg) translateY(4.3744331763vw);
+            transform: skewY(5deg) translateY(4.3744331763vw);
+    padding-top: 4.3744331763vw;
+    padding-bottom: 4.3744331763vw;
+  }
+  .skew-md-5 .inner-section {
+    -webkit-transform: skewY(-5deg);
+            transform: skewY(-5deg);
+  }
+  .skew-md-5.overlap-prev-section {
+    -webkit-transform: skewY(5deg) translateY(-4.3744331763vw);
+            transform: skewY(5deg) translateY(-4.3744331763vw);
+  }
+}
+.overlap-next-5 + .cmp-skew {
+  -webkit-transform: skewY(5deg) translateY(-4.3744331763vw);
+          transform: skewY(5deg) translateY(-4.3744331763vw);
+  padding-top: 4.3744331763vw;
+  padding-bottom: 4.3744331763vw;
+}
+.overlap-next-5 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-5deg);
+          transform: skewY(-5deg);
+}
+
+.skew-padding-bottom-5 {
+  padding-bottom: 8.7488663526vw;
+}
+
+.skew-6 {
+  -webkit-transform: skewY(6deg) translateY(5.2552117633vw);
+          transform: skewY(6deg) translateY(5.2552117633vw);
+  padding-top: 5.2552117633vw;
+  padding-bottom: 5.2552117633vw;
+}
+.skew-6 .inner-section {
+  -webkit-transform: skewY(-6deg);
+          transform: skewY(-6deg);
+}
+.skew-6.overlap-prev-section {
+  -webkit-transform: skewY(6deg) translateY(-5.2552117633vw);
+          transform: skewY(6deg) translateY(-5.2552117633vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-6 {
+    -webkit-transform: skewY(6deg) translateY(5.2552117633vw);
+            transform: skewY(6deg) translateY(5.2552117633vw);
+    padding-top: 5.2552117633vw;
+    padding-bottom: 5.2552117633vw;
+  }
+  .skew-md-6 .inner-section {
+    -webkit-transform: skewY(-6deg);
+            transform: skewY(-6deg);
+  }
+  .skew-md-6.overlap-prev-section {
+    -webkit-transform: skewY(6deg) translateY(-5.2552117633vw);
+            transform: skewY(6deg) translateY(-5.2552117633vw);
+  }
+}
+.overlap-next-6 + .cmp-skew {
+  -webkit-transform: skewY(6deg) translateY(-5.2552117633vw);
+          transform: skewY(6deg) translateY(-5.2552117633vw);
+  padding-top: 5.2552117633vw;
+  padding-bottom: 5.2552117633vw;
+}
+.overlap-next-6 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-6deg);
+          transform: skewY(-6deg);
+}
+
+.skew-padding-bottom-6, .cmp-hero {
+  padding-bottom: 10.5104235266vw;
+}
+
+.skew-7 {
+  -webkit-transform: skewY(7deg) translateY(6.1392280451vw);
+          transform: skewY(7deg) translateY(6.1392280451vw);
+  padding-top: 6.1392280451vw;
+  padding-bottom: 6.1392280451vw;
+}
+.skew-7 .inner-section {
+  -webkit-transform: skewY(-7deg);
+          transform: skewY(-7deg);
+}
+.skew-7.overlap-prev-section {
+  -webkit-transform: skewY(7deg) translateY(-6.1392280451vw);
+          transform: skewY(7deg) translateY(-6.1392280451vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-7 {
+    -webkit-transform: skewY(7deg) translateY(6.1392280451vw);
+            transform: skewY(7deg) translateY(6.1392280451vw);
+    padding-top: 6.1392280451vw;
+    padding-bottom: 6.1392280451vw;
+  }
+  .skew-md-7 .inner-section {
+    -webkit-transform: skewY(-7deg);
+            transform: skewY(-7deg);
+  }
+  .skew-md-7.overlap-prev-section {
+    -webkit-transform: skewY(7deg) translateY(-6.1392280451vw);
+            transform: skewY(7deg) translateY(-6.1392280451vw);
+  }
+}
+.overlap-next-7 + .cmp-skew {
+  -webkit-transform: skewY(7deg) translateY(-6.1392280451vw);
+          transform: skewY(7deg) translateY(-6.1392280451vw);
+  padding-top: 6.1392280451vw;
+  padding-bottom: 6.1392280451vw;
+}
+.overlap-next-7 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-7deg);
+          transform: skewY(-7deg);
+}
+
+.skew-padding-bottom-7 {
+  padding-bottom: 12.2784560903vw;
+}
+
+.skew-8 {
+  -webkit-transform: skewY(8deg) translateY(7.0270417351vw);
+          transform: skewY(8deg) translateY(7.0270417351vw);
+  padding-top: 7.0270417351vw;
+  padding-bottom: 7.0270417351vw;
+}
+.skew-8 .inner-section {
+  -webkit-transform: skewY(-8deg);
+          transform: skewY(-8deg);
+}
+.skew-8.overlap-prev-section {
+  -webkit-transform: skewY(8deg) translateY(-7.0270417351vw);
+          transform: skewY(8deg) translateY(-7.0270417351vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-8 {
+    -webkit-transform: skewY(8deg) translateY(7.0270417351vw);
+            transform: skewY(8deg) translateY(7.0270417351vw);
+    padding-top: 7.0270417351vw;
+    padding-bottom: 7.0270417351vw;
+  }
+  .skew-md-8 .inner-section {
+    -webkit-transform: skewY(-8deg);
+            transform: skewY(-8deg);
+  }
+  .skew-md-8.overlap-prev-section {
+    -webkit-transform: skewY(8deg) translateY(-7.0270417351vw);
+            transform: skewY(8deg) translateY(-7.0270417351vw);
+  }
+}
+.overlap-next-8 + .cmp-skew {
+  -webkit-transform: skewY(8deg) translateY(-7.0270417351vw);
+          transform: skewY(8deg) translateY(-7.0270417351vw);
+  padding-top: 7.0270417351vw;
+  padding-bottom: 7.0270417351vw;
+}
+.overlap-next-8 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-8deg);
+          transform: skewY(-8deg);
+}
+
+.skew-padding-bottom-8 {
+  padding-bottom: 14.0540834702vw;
+}
+
+.skew-9 {
+  -webkit-transform: skewY(9deg) translateY(7.9192220162vw);
+          transform: skewY(9deg) translateY(7.9192220162vw);
+  padding-top: 7.9192220162vw;
+  padding-bottom: 7.9192220162vw;
+}
+.skew-9 .inner-section {
+  -webkit-transform: skewY(-9deg);
+          transform: skewY(-9deg);
+}
+.skew-9.overlap-prev-section {
+  -webkit-transform: skewY(9deg) translateY(-7.9192220162vw);
+          transform: skewY(9deg) translateY(-7.9192220162vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-9 {
+    -webkit-transform: skewY(9deg) translateY(7.9192220162vw);
+            transform: skewY(9deg) translateY(7.9192220162vw);
+    padding-top: 7.9192220162vw;
+    padding-bottom: 7.9192220162vw;
+  }
+  .skew-md-9 .inner-section {
+    -webkit-transform: skewY(-9deg);
+            transform: skewY(-9deg);
+  }
+  .skew-md-9.overlap-prev-section {
+    -webkit-transform: skewY(9deg) translateY(-7.9192220162vw);
+            transform: skewY(9deg) translateY(-7.9192220162vw);
+  }
+}
+.overlap-next-9 + .cmp-skew {
+  -webkit-transform: skewY(9deg) translateY(-7.9192220162vw);
+          transform: skewY(9deg) translateY(-7.9192220162vw);
+  padding-top: 7.9192220162vw;
+  padding-bottom: 7.9192220162vw;
+}
+.overlap-next-9 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-9deg);
+          transform: skewY(-9deg);
+}
+
+.skew-padding-bottom-9 {
+  padding-bottom: 15.8384440325vw;
+}
+
+.skew-10 {
+  -webkit-transform: skewY(10deg) translateY(8.8163490354vw);
+          transform: skewY(10deg) translateY(8.8163490354vw);
+  padding-top: 8.8163490354vw;
+  padding-bottom: 8.8163490354vw;
+}
+.skew-10 .inner-section {
+  -webkit-transform: skewY(-10deg);
+          transform: skewY(-10deg);
+}
+.skew-10.overlap-prev-section {
+  -webkit-transform: skewY(10deg) translateY(-8.8163490354vw);
+          transform: skewY(10deg) translateY(-8.8163490354vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-10 {
+    -webkit-transform: skewY(10deg) translateY(8.8163490354vw);
+            transform: skewY(10deg) translateY(8.8163490354vw);
+    padding-top: 8.8163490354vw;
+    padding-bottom: 8.8163490354vw;
+  }
+  .skew-md-10 .inner-section {
+    -webkit-transform: skewY(-10deg);
+            transform: skewY(-10deg);
+  }
+  .skew-md-10.overlap-prev-section {
+    -webkit-transform: skewY(10deg) translateY(-8.8163490354vw);
+            transform: skewY(10deg) translateY(-8.8163490354vw);
+  }
+}
+.overlap-next-10 + .cmp-skew {
+  -webkit-transform: skewY(10deg) translateY(-8.8163490354vw);
+          transform: skewY(10deg) translateY(-8.8163490354vw);
+  padding-top: 8.8163490354vw;
+  padding-bottom: 8.8163490354vw;
+}
+.overlap-next-10 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-10deg);
+          transform: skewY(-10deg);
+}
+
+.skew-padding-bottom-10 {
+  padding-bottom: 17.6326980708vw;
+}
+
+.skew-11 {
+  -webkit-transform: skewY(11deg) translateY(9.7190154569vw);
+          transform: skewY(11deg) translateY(9.7190154569vw);
+  padding-top: 9.7190154569vw;
+  padding-bottom: 9.7190154569vw;
+}
+.skew-11 .inner-section {
+  -webkit-transform: skewY(-11deg);
+          transform: skewY(-11deg);
+}
+.skew-11.overlap-prev-section {
+  -webkit-transform: skewY(11deg) translateY(-9.7190154569vw);
+          transform: skewY(11deg) translateY(-9.7190154569vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-11 {
+    -webkit-transform: skewY(11deg) translateY(9.7190154569vw);
+            transform: skewY(11deg) translateY(9.7190154569vw);
+    padding-top: 9.7190154569vw;
+    padding-bottom: 9.7190154569vw;
+  }
+  .skew-md-11 .inner-section {
+    -webkit-transform: skewY(-11deg);
+            transform: skewY(-11deg);
+  }
+  .skew-md-11.overlap-prev-section {
+    -webkit-transform: skewY(11deg) translateY(-9.7190154569vw);
+            transform: skewY(11deg) translateY(-9.7190154569vw);
+  }
+}
+.overlap-next-11 + .cmp-skew {
+  -webkit-transform: skewY(11deg) translateY(-9.7190154569vw);
+          transform: skewY(11deg) translateY(-9.7190154569vw);
+  padding-top: 9.7190154569vw;
+  padding-bottom: 9.7190154569vw;
+}
+.overlap-next-11 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-11deg);
+          transform: skewY(-11deg);
+}
+
+.skew-padding-bottom-11 {
+  padding-bottom: 19.4380309138vw;
+}
+
+.skew-12 {
+  -webkit-transform: skewY(12deg) translateY(10.6278280835vw);
+          transform: skewY(12deg) translateY(10.6278280835vw);
+  padding-top: 10.6278280835vw;
+  padding-bottom: 10.6278280835vw;
+}
+.skew-12 .inner-section {
+  -webkit-transform: skewY(-12deg);
+          transform: skewY(-12deg);
+}
+.skew-12.overlap-prev-section {
+  -webkit-transform: skewY(12deg) translateY(-10.6278280835vw);
+          transform: skewY(12deg) translateY(-10.6278280835vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-12 {
+    -webkit-transform: skewY(12deg) translateY(10.6278280835vw);
+            transform: skewY(12deg) translateY(10.6278280835vw);
+    padding-top: 10.6278280835vw;
+    padding-bottom: 10.6278280835vw;
+  }
+  .skew-md-12 .inner-section {
+    -webkit-transform: skewY(-12deg);
+            transform: skewY(-12deg);
+  }
+  .skew-md-12.overlap-prev-section {
+    -webkit-transform: skewY(12deg) translateY(-10.6278280835vw);
+            transform: skewY(12deg) translateY(-10.6278280835vw);
+  }
+}
+.overlap-next-12 + .cmp-skew {
+  -webkit-transform: skewY(12deg) translateY(-10.6278280835vw);
+          transform: skewY(12deg) translateY(-10.6278280835vw);
+  padding-top: 10.6278280835vw;
+  padding-bottom: 10.6278280835vw;
+}
+.overlap-next-12 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-12deg);
+          transform: skewY(-12deg);
+}
+
+.skew-padding-bottom-12 {
+  padding-bottom: 21.255656167vw;
+}
+
+.skew-13 {
+  -webkit-transform: skewY(13deg) translateY(11.5434095563vw);
+          transform: skewY(13deg) translateY(11.5434095563vw);
+  padding-top: 11.5434095563vw;
+  padding-bottom: 11.5434095563vw;
+}
+.skew-13 .inner-section {
+  -webkit-transform: skewY(-13deg);
+          transform: skewY(-13deg);
+}
+.skew-13.overlap-prev-section {
+  -webkit-transform: skewY(13deg) translateY(-11.5434095563vw);
+          transform: skewY(13deg) translateY(-11.5434095563vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-13 {
+    -webkit-transform: skewY(13deg) translateY(11.5434095563vw);
+            transform: skewY(13deg) translateY(11.5434095563vw);
+    padding-top: 11.5434095563vw;
+    padding-bottom: 11.5434095563vw;
+  }
+  .skew-md-13 .inner-section {
+    -webkit-transform: skewY(-13deg);
+            transform: skewY(-13deg);
+  }
+  .skew-md-13.overlap-prev-section {
+    -webkit-transform: skewY(13deg) translateY(-11.5434095563vw);
+            transform: skewY(13deg) translateY(-11.5434095563vw);
+  }
+}
+.overlap-next-13 + .cmp-skew {
+  -webkit-transform: skewY(13deg) translateY(-11.5434095563vw);
+          transform: skewY(13deg) translateY(-11.5434095563vw);
+  padding-top: 11.5434095563vw;
+  padding-bottom: 11.5434095563vw;
+}
+.overlap-next-13 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-13deg);
+          transform: skewY(-13deg);
+}
+
+.skew-padding-bottom-13 {
+  padding-bottom: 23.0868191126vw;
+}
+
+.skew-14 {
+  -webkit-transform: skewY(14deg) translateY(12.4664001422vw);
+          transform: skewY(14deg) translateY(12.4664001422vw);
+  padding-top: 12.4664001422vw;
+  padding-bottom: 12.4664001422vw;
+}
+.skew-14 .inner-section {
+  -webkit-transform: skewY(-14deg);
+          transform: skewY(-14deg);
+}
+.skew-14.overlap-prev-section {
+  -webkit-transform: skewY(14deg) translateY(-12.4664001422vw);
+          transform: skewY(14deg) translateY(-12.4664001422vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-14 {
+    -webkit-transform: skewY(14deg) translateY(12.4664001422vw);
+            transform: skewY(14deg) translateY(12.4664001422vw);
+    padding-top: 12.4664001422vw;
+    padding-bottom: 12.4664001422vw;
+  }
+  .skew-md-14 .inner-section {
+    -webkit-transform: skewY(-14deg);
+            transform: skewY(-14deg);
+  }
+  .skew-md-14.overlap-prev-section {
+    -webkit-transform: skewY(14deg) translateY(-12.4664001422vw);
+            transform: skewY(14deg) translateY(-12.4664001422vw);
+  }
+}
+.overlap-next-14 + .cmp-skew {
+  -webkit-transform: skewY(14deg) translateY(-12.4664001422vw);
+          transform: skewY(14deg) translateY(-12.4664001422vw);
+  padding-top: 12.4664001422vw;
+  padding-bottom: 12.4664001422vw;
+}
+.overlap-next-14 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-14deg);
+          transform: skewY(-14deg);
+}
+
+.skew-padding-bottom-14 {
+  padding-bottom: 24.9328002843vw;
+}
+
+.skew-15 {
+  -webkit-transform: skewY(15deg) translateY(13.3974596216vw);
+          transform: skewY(15deg) translateY(13.3974596216vw);
+  padding-top: 13.3974596216vw;
+  padding-bottom: 13.3974596216vw;
+}
+.skew-15 .inner-section {
+  -webkit-transform: skewY(-15deg);
+          transform: skewY(-15deg);
+}
+.skew-15.overlap-prev-section {
+  -webkit-transform: skewY(15deg) translateY(-13.3974596216vw);
+          transform: skewY(15deg) translateY(-13.3974596216vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-15 {
+    -webkit-transform: skewY(15deg) translateY(13.3974596216vw);
+            transform: skewY(15deg) translateY(13.3974596216vw);
+    padding-top: 13.3974596216vw;
+    padding-bottom: 13.3974596216vw;
+  }
+  .skew-md-15 .inner-section {
+    -webkit-transform: skewY(-15deg);
+            transform: skewY(-15deg);
+  }
+  .skew-md-15.overlap-prev-section {
+    -webkit-transform: skewY(15deg) translateY(-13.3974596216vw);
+            transform: skewY(15deg) translateY(-13.3974596216vw);
+  }
+}
+.overlap-next-15 + .cmp-skew {
+  -webkit-transform: skewY(15deg) translateY(-13.3974596216vw);
+          transform: skewY(15deg) translateY(-13.3974596216vw);
+  padding-top: 13.3974596216vw;
+  padding-bottom: 13.3974596216vw;
+}
+.overlap-next-15 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-15deg);
+          transform: skewY(-15deg);
+}
+
+.skew-padding-bottom-15 {
+  padding-bottom: 26.7949192431vw;
+}
+
+.skew-16 {
+  -webkit-transform: skewY(16deg) translateY(14.3372692879vw);
+          transform: skewY(16deg) translateY(14.3372692879vw);
+  padding-top: 14.3372692879vw;
+  padding-bottom: 14.3372692879vw;
+}
+.skew-16 .inner-section {
+  -webkit-transform: skewY(-16deg);
+          transform: skewY(-16deg);
+}
+.skew-16.overlap-prev-section {
+  -webkit-transform: skewY(16deg) translateY(-14.3372692879vw);
+          transform: skewY(16deg) translateY(-14.3372692879vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-16 {
+    -webkit-transform: skewY(16deg) translateY(14.3372692879vw);
+            transform: skewY(16deg) translateY(14.3372692879vw);
+    padding-top: 14.3372692879vw;
+    padding-bottom: 14.3372692879vw;
+  }
+  .skew-md-16 .inner-section {
+    -webkit-transform: skewY(-16deg);
+            transform: skewY(-16deg);
+  }
+  .skew-md-16.overlap-prev-section {
+    -webkit-transform: skewY(16deg) translateY(-14.3372692879vw);
+            transform: skewY(16deg) translateY(-14.3372692879vw);
+  }
+}
+.overlap-next-16 + .cmp-skew {
+  -webkit-transform: skewY(16deg) translateY(-14.3372692879vw);
+          transform: skewY(16deg) translateY(-14.3372692879vw);
+  padding-top: 14.3372692879vw;
+  padding-bottom: 14.3372692879vw;
+}
+.overlap-next-16 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-16deg);
+          transform: skewY(-16deg);
+}
+
+.skew-padding-bottom-16 {
+  padding-bottom: 28.6745385759vw;
+}
+
+.skew-17 {
+  -webkit-transform: skewY(17deg) translateY(15.2865340729vw);
+          transform: skewY(17deg) translateY(15.2865340729vw);
+  padding-top: 15.2865340729vw;
+  padding-bottom: 15.2865340729vw;
+}
+.skew-17 .inner-section {
+  -webkit-transform: skewY(-17deg);
+          transform: skewY(-17deg);
+}
+.skew-17.overlap-prev-section {
+  -webkit-transform: skewY(17deg) translateY(-15.2865340729vw);
+          transform: skewY(17deg) translateY(-15.2865340729vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-17 {
+    -webkit-transform: skewY(17deg) translateY(15.2865340729vw);
+            transform: skewY(17deg) translateY(15.2865340729vw);
+    padding-top: 15.2865340729vw;
+    padding-bottom: 15.2865340729vw;
+  }
+  .skew-md-17 .inner-section {
+    -webkit-transform: skewY(-17deg);
+            transform: skewY(-17deg);
+  }
+  .skew-md-17.overlap-prev-section {
+    -webkit-transform: skewY(17deg) translateY(-15.2865340729vw);
+            transform: skewY(17deg) translateY(-15.2865340729vw);
+  }
+}
+.overlap-next-17 + .cmp-skew {
+  -webkit-transform: skewY(17deg) translateY(-15.2865340729vw);
+          transform: skewY(17deg) translateY(-15.2865340729vw);
+  padding-top: 15.2865340729vw;
+  padding-bottom: 15.2865340729vw;
+}
+.overlap-next-17 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-17deg);
+          transform: skewY(-17deg);
+}
+
+.skew-padding-bottom-17 {
+  padding-bottom: 30.5730681459vw;
+}
+
+.skew-18 {
+  -webkit-transform: skewY(18deg) translateY(16.2459848116vw);
+          transform: skewY(18deg) translateY(16.2459848116vw);
+  padding-top: 16.2459848116vw;
+  padding-bottom: 16.2459848116vw;
+}
+.skew-18 .inner-section {
+  -webkit-transform: skewY(-18deg);
+          transform: skewY(-18deg);
+}
+.skew-18.overlap-prev-section {
+  -webkit-transform: skewY(18deg) translateY(-16.2459848116vw);
+          transform: skewY(18deg) translateY(-16.2459848116vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-18 {
+    -webkit-transform: skewY(18deg) translateY(16.2459848116vw);
+            transform: skewY(18deg) translateY(16.2459848116vw);
+    padding-top: 16.2459848116vw;
+    padding-bottom: 16.2459848116vw;
+  }
+  .skew-md-18 .inner-section {
+    -webkit-transform: skewY(-18deg);
+            transform: skewY(-18deg);
+  }
+  .skew-md-18.overlap-prev-section {
+    -webkit-transform: skewY(18deg) translateY(-16.2459848116vw);
+            transform: skewY(18deg) translateY(-16.2459848116vw);
+  }
+}
+.overlap-next-18 + .cmp-skew {
+  -webkit-transform: skewY(18deg) translateY(-16.2459848116vw);
+          transform: skewY(18deg) translateY(-16.2459848116vw);
+  padding-top: 16.2459848116vw;
+  padding-bottom: 16.2459848116vw;
+}
+.overlap-next-18 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-18deg);
+          transform: skewY(-18deg);
+}
+
+.skew-padding-bottom-18 {
+  padding-bottom: 32.4919696233vw;
+}
+
+.skew-19 {
+  -webkit-transform: skewY(19deg) translateY(17.2163806645vw);
+          transform: skewY(19deg) translateY(17.2163806645vw);
+  padding-top: 17.2163806645vw;
+  padding-bottom: 17.2163806645vw;
+}
+.skew-19 .inner-section {
+  -webkit-transform: skewY(-19deg);
+          transform: skewY(-19deg);
+}
+.skew-19.overlap-prev-section {
+  -webkit-transform: skewY(19deg) translateY(-17.2163806645vw);
+          transform: skewY(19deg) translateY(-17.2163806645vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-19 {
+    -webkit-transform: skewY(19deg) translateY(17.2163806645vw);
+            transform: skewY(19deg) translateY(17.2163806645vw);
+    padding-top: 17.2163806645vw;
+    padding-bottom: 17.2163806645vw;
+  }
+  .skew-md-19 .inner-section {
+    -webkit-transform: skewY(-19deg);
+            transform: skewY(-19deg);
+  }
+  .skew-md-19.overlap-prev-section {
+    -webkit-transform: skewY(19deg) translateY(-17.2163806645vw);
+            transform: skewY(19deg) translateY(-17.2163806645vw);
+  }
+}
+.overlap-next-19 + .cmp-skew {
+  -webkit-transform: skewY(19deg) translateY(-17.2163806645vw);
+          transform: skewY(19deg) translateY(-17.2163806645vw);
+  padding-top: 17.2163806645vw;
+  padding-bottom: 17.2163806645vw;
+}
+.overlap-next-19 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-19deg);
+          transform: skewY(-19deg);
+}
+
+.skew-padding-bottom-19 {
+  padding-bottom: 34.432761329vw;
+}
+
+.skew-20 {
+  -webkit-transform: skewY(20deg) translateY(18.1985117133vw);
+          transform: skewY(20deg) translateY(18.1985117133vw);
+  padding-top: 18.1985117133vw;
+  padding-bottom: 18.1985117133vw;
+}
+.skew-20 .inner-section {
+  -webkit-transform: skewY(-20deg);
+          transform: skewY(-20deg);
+}
+.skew-20.overlap-prev-section {
+  -webkit-transform: skewY(20deg) translateY(-18.1985117133vw);
+          transform: skewY(20deg) translateY(-18.1985117133vw);
+}
+
+@media (min-width: 768px) {
+  .skew-md-20 {
+    -webkit-transform: skewY(20deg) translateY(18.1985117133vw);
+            transform: skewY(20deg) translateY(18.1985117133vw);
+    padding-top: 18.1985117133vw;
+    padding-bottom: 18.1985117133vw;
+  }
+  .skew-md-20 .inner-section {
+    -webkit-transform: skewY(-20deg);
+            transform: skewY(-20deg);
+  }
+  .skew-md-20.overlap-prev-section {
+    -webkit-transform: skewY(20deg) translateY(-18.1985117133vw);
+            transform: skewY(20deg) translateY(-18.1985117133vw);
+  }
+}
+.overlap-next-20 + .cmp-skew {
+  -webkit-transform: skewY(20deg) translateY(-18.1985117133vw);
+          transform: skewY(20deg) translateY(-18.1985117133vw);
+  padding-top: 18.1985117133vw;
+  padding-bottom: 18.1985117133vw;
+}
+.overlap-next-20 + .cmp-skew .inner-section {
+  -webkit-transform: skewY(-20deg);
+          transform: skewY(-20deg);
+}
+
+.skew-padding-bottom-20 {
+  padding-bottom: 36.3970234266vw;
+}
+
+.overlap-prev-section-y {
+  -webkit-transform: translateY(-10.5104235266vw);
+          transform: translateY(-10.5104235266vw);
+}
+
+/**
+ *  Main css for Threelines
+ */
+/**
+ *  Main css for Heading
+ */
+.cmp-heading {
+  text-transform: uppercase;
+  margin-bottom: 2rem;
+}
+.cmp-heading.h1.has-line {
+  margin-bottom: 2rem;
+}
+.cmp-heading.h2.has-line {
+  margin-bottom: 1.75rem;
+}
+.cmp-heading.h3.has-line {
+  margin-bottom: 1.5rem;
+}
+.cmp-heading.h4.has-line {
+  margin-bottom: 1.25rem;
+}
+.cmp-heading.h5.has-line {
+  margin-bottom: 1rem;
+}
+.cmp-heading.h6.has-line {
+  margin-bottom: 0.75rem;
+}
+@media (min-width: 992px) {
+  .cmp-heading {
+    margin-bottom: 1.5rem;
+  }
+}
+
+/**
+ *  Main css for Simpletext
+ */
+/**
+ *  Main css for Cols
+ */
+.cmp-cols.no-gutter > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+  padding-right: 0;
+  padding-left: 0;
+}
+.cmp-cols.no-gutter .field__items > *:not([class*=" col"]):not([class^=col]) {
+  padding-right: 0;
+  padding-left: 0;
+}
+/**
+ *  Main css for Brandingcard
+ */
+.cmp-brandingcard .cmp-image {
+  max-width: 25vw;
+  margin-bottom: 1.5rem;
+}
+.cmp-brandingcard .cmp-heading {
+  text-transform: uppercase;
+  font-size: 1.125rem;
+  line-height: 1.56;
+  letter-spacing: 1px;
+  margin-bottom: 1rem;
+  font-weight: normal;
+}
+.cmp-brandingcard .cmp-text {
+  font-size: 0.875rem;
+  line-height: 1.71;
+  opacity: 0.6;
+  margin-bottom: 3rem;
+}
+.cmp-brandingcard .cmp-brandingcard__line {
+  border-color: rgba(255, 255, 255, 0.2);
+  border-width: 1.4px;
+  margin-top: 0;
+  margin-bottom: 0;
+  width: 30vw;
+}
+@media (min-width: 992px) {
+  .cmp-brandingcard .cmp-image {
+    width: 8vw;
+    height: 8vw;
+  }
+}
+
+/**
+ *  Main css for Image
+ */
+/**
+ *  Main css for Unitmacros
+ */
+/**
+ *  Main css for Branding
+ */
+.cmp-skew.branding {
+  position: relative;
+  z-index: 1;
+}
+
+.cmp-branding > *:last-child {
+  margin-bottom: 0;
+}
+.cmp-branding .cmp-cols > div:last-child .cmp-brandingcard__line {
+  display: none;
+}
+@media (min-width: 992px) {
+  .cmp-branding .cmp-brandingcard__line {
+    display: none;
+  }
+}
+
+/**
+ *  Main css for Hero
+ */
+.cmp-hero {
+  padding-top: 5.8125rem;
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+}
+.cmp-hero .cmp-slider {
+  padding-bottom: 6.875rem;
+}
+.cmp-hero .cmp-slider .cmp-slider-controls {
+  -webkit-box-pack: start;
+          justify-content: start;
+  margin-left: 15px;
+}
+
+/**
+ *  Main css for Tricolor
+ */
+.cmp-tricolor {
+  display: -webkit-box;
+  display: flex;
+  overflow: hidden;
+  margin-left: -16%;
+  margin-right: -16%;
+  min-height: 400px;
+}
+.cmp-tricolor .tricolor-layer {
+  -webkit-transform: skew(-25deg);
+          transform: skew(-25deg);
+  width: 70%;
+  opacity: 0.3;
+}
+.cmp-tricolor .cmp-tricolor_start {
+  background-color: lightcoral;
+}
+.cmp-tricolor .cmp-tricolor_middle {
+  background-color: gray;
+  width: 70%;
+}
+.cmp-tricolor .cmp-tricolor_end {
+  background-color: blue;
+}
+
+.cmp-tricolor__position {
+  position: absolute;
+  overflow-x: hidden;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.cmp-tricolor__position .tricolor-layer {
+  -webkit-transform: skew(-25deg);
+          transform: skew(-25deg);
+  width: 70%;
+  height: 100%;
+  position: absolute;
+}
+.cmp-tricolor__position .cmp-tricolor_start {
+  background-color: white;
+  left: -40%;
+  opacity: 1;
+}
+.cmp-tricolor__position .cmp-tricolor_middle {
+  background-color: #f8f9fa;
+  width: 40%;
+  left: 30%;
+  opacity: 0.7;
+}
+.cmp-tricolor__position .cmp-tricolor_end {
+  background-color: #05056696;
+  right: -40%;
+  opacity: 0.7;
+}
+
+.cmp-tricolor__position-inverted {
+  position: absolute;
+  overflow-x: hidden;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.cmp-tricolor__position-inverted .tricolor-layer {
+  -webkit-transform: skew(25deg);
+          transform: skew(25deg);
+  width: 70%;
+  height: 100%;
+  position: absolute;
+}
+.cmp-tricolor__position-inverted .cmp-tricolor_start {
+  background-color: #05056696;
+  left: -40%;
+  opacity: 0.7;
+}
+.cmp-tricolor__position-inverted .cmp-tricolor_middle {
+  background-color: #f8f9fa;
+  width: 40%;
+  left: 30%;
+  opacity: 0.7;
+}
+.cmp-tricolor__position-inverted .cmp-tricolor_end {
+  background-color: white;
+  right: -40%;
+  opacity: 1;
+}
+
+/**
+ *  Main css for Slider
+ */
+.cmp-slider .cmp-slider-controls {
+  -webkit-box-pack: center;
+          justify-content: center;
+  position: absolute;
+  bottom: 2vw;
+  left: 0;
+  width: 100%;
+}
+.cmp-slider .cmp-slider-controls.bottom {
+  position: relative;
+  bottom: 0;
+}
+.cmp-slider .cmp-slider-prev,
+.cmp-slider .cmp-slider-next {
+  z-index: 1;
+}
+.cmp-slider .cmp-slider-prev svg,
+.cmp-slider .cmp-slider-next svg {
+  fill: #ced4da;
+}
+.cmp-slider .cmp-slider-prev svg:hover,
+.cmp-slider .cmp-slider-next svg:hover {
+  fill: #f16824;
+}
+.cmp-slider .carousel-indicators {
+  position: unset;
+  margin-right: 2%;
+  margin-left: 2%;
+}
+.cmp-slider .carousel-indicators li {
+  margin-left: 0;
+  margin-right: 0;
+  height: 2px;
+  background-color: #ced4da;
+}
+.cmp-slider .carousel-indicators li.active {
+  background-color: #f16824;
+}
+
+/**
+ *  Main css for HomePage
+ */
+.serve {
+  height: 400px;
+  border: red solid 1px;
+}
+
+/**
+ *  Main css for Shadow Box
+ */
+.cmp-shadow-box > .row, .cmp-shadow-box > .cmp-cols, .cmp-cols .cmp-shadow-box > .field__items {
+  margin-right: 0;
+  margin-left: 0;
+}
+.cmp-shadow-box .cmp-shadow-box-quote {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  -webkit-box-pack: center;
+          justify-content: center;
+}
+.cmp-shadow-box .cmp-shadow-box-img {
+  position: relative;
+}
+.cmp-shadow-box .cmp-shadow-box-img > .cmp-image {
+  -o-object-fit: cover;
+     object-fit: cover;
+  width: 100%;
+  max-height: 300px;
+  -o-object-position: top;
+     object-position: top;
+  margin: 0;
+}
+.cmp-shadow-box .cmp-shadow-box-img > .field--type-entity-reference {
+  margin: 0;
+}
+.cmp-shadow-box .cmp-shadow-box-img > .node .field--type-image {
+  margin: 0;
+}
+.cmp-shadow-box .cmp-shadow-box-img > .field--type-image img {
+  margin: 0;
+}
+.cmp-shadow-box .cmp-shadow-box-img .cmp-shadow-box-play-container {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-align: end;
+          align-items: flex-end;
+}
+.cmp-shadow-box .cmp-shadow-box-img .cmp-shadow-box-play-container button {
+  padding: 4vw;
+}
+@media (min-width: 768px) {
+  .cmp-shadow-box .cmp-shadow-box-img > .cmp-image {
+    min-height: 100%;
+    max-height: unset;
+  }
+  .cmp-shadow-box .cmp-shadow-box-img .cmp-shadow-box-play-container {
+    -webkit-box-pack: center;
+            justify-content: center;
+    -webkit-box-align: center;
+            align-items: center;
+  }
+}
+
+/**
+ *  Main css for Quote
+ */
+.cmp-quote {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  -webkit-box-align: baseline;
+          align-items: baseline;
+  background-color: #fff;
+}
+.cmp-quote img:last-child {
+  align-self: flex-end;
+}
+.cmp-quote blockquote {
+  margin-top: 1rem;
+}
+.cmp-quote blockquote p {
+  font-size: 1.5rem;
+  line-height: 1.38;
+  margin-bottom: 1.25rem;
+}
+.cmp-quote blockquote footer {
+  opacity: 0.54;
+  font-size: 0.875rem;
+  line-height: normal;
+  letter-spacing: normal;
+}
+
+/**
+ *  Main css for Testimonial
+ */
+.cmp-testimonial {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-pack: center;
+          justify-content: center;
+}
+.cmp-testimonial .cmp-testimonial-inner .cmp-slider .cmp-slider-controls {
+  padding-left: 4.16vw;
+}
+@media (max-width: 767.98px) {
+  .cmp-testimonial .cmp-testimonial-inner .cmp-slider .cmp-slider-controls {
+    padding-right: 4.16vw;
+  }
+  .cmp-testimonial .cmp-testimonial-inner .cmp-slider .carousel-indicators {
+    -webkit-box-flex: 1;
+            flex: 1 1 auto;
+    display: -webkit-box;
+    display: flex;
+  }
+  .cmp-testimonial .cmp-testimonial-inner .cmp-slider .carousel-indicators li {
+    -webkit-box-flex: 1;
+            flex: 1;
+  }
+}
+.cmp-testimonial .cmp-testimonial-footer {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+  -webkit-box-align: center;
+          align-items: center;
+}
+.cmp-testimonial .cmp-testimonial-footer .cmp-text {
+  margin-top: 2.9375rem;
+  margin-bottom: 1.4375rem;
+}
+@media (max-width: 991.98px) {
+  .cmp-testimonial .cmp-testimonial-footer .cmp-button {
+    margin-bottom: 2.9375rem;
+  }
+}
+@media (min-width: 768px) {
+  .cmp-testimonial .cmp-testimonial-inner {
+    width: 76%;
+  }
+  .cmp-testimonial .cmp-testimonial-inner .cmp-slider-controls {
+    -webkit-box-pack: start;
+            justify-content: start;
+    left: 50%;
+    bottom: 6vw;
+  }
+  .cmp-testimonial .cmp-testimonial-footer {
+    -webkit-box-align: end;
+            align-items: flex-end;
+    text-align: right;
+  }
+  .cmp-testimonial .cmp-testimonial-footer .cmp-text {
+    max-width: 24vw;
+    margin-top: 1.6875rem;
+    margin-bottom: 3.4375rem;
+  }
+}
+
+/**
+ *  Main css for Servicescards
+ */
+.cmp-servicescards {
+  padding: 150px 25px;
+  height: 1300px;
+  max-width: 1600px;
+  margin: auto;
+}
+.cmp-servicescards .cmp-tricolor__position-inverted {
+  margin-top: -300px;
+  height: inherit;
+}
+.cmp-servicescards .cmp-tricolor__position-inverted .cmp-tricolor_start {
+  display: none;
+}
+.cmp-servicescards .cmp-tricolor__position-inverted .cmp-tricolor_middle {
+  left: -60%;
+  width: 125%;
+}
+.cmp-servicescards .cmp-tricolor__position-inverted .cmp-tricolor_end {
+  width: 110%;
+  left: 60%;
+}
+.cmp-servicescards .cmp-jumbo {
+  position: relative;
+}
+.cmp-servicescards .cmp-servicescards__cardcontainer {
+  position: relative;
+}
+
+@media (min-width: 992px) {
+  .cmp-servicescards .cmp-tricolor__position-inverted {
+    margin-top: -300px;
+    height: inherit;
+  }
+  .cmp-servicescards .cmp-tricolor__position-inverted .cmp-tricolor_start {
+    display: none;
+  }
+  .cmp-servicescards .cmp-tricolor__position-inverted .cmp-tricolor_middle {
+    left: -40%;
+    width: inherit;
+  }
+  .cmp-servicescards .cmp-tricolor__position-inverted .cmp-tricolor_end {
+    width: 100%;
+    left: 30%;
+  }
+}
+/**
+ *  Main css for Servcard
+ */
+.cmp-servcard {
+  width: 335px;
+  height: 96px;
+  box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+  background: white;
+  padding: 0;
+}
+.cmp-servcard .cmp-servcard__image {
+  display: none;
+}
+.cmp-servcard .cmp-servcard__image .field--type-entity-reference {
+  margin: 0;
+  font-family: inherit;
+}
+.cmp-servcard .cmp-servcard__image .field--type-image img {
+  margin: 0;
+}
+@media all and (min-width: 560px) {
+  .cmp-servcard .cmp-servcard__image .node .field--type-image {
+    margin: 0 !important;
+  }
+}
+.cmp-servcard .cmp-servcard__content {
+  padding: 30px;
+}
+.cmp-servcard .cmp-servcard__content .cmp-heading {
+  color: #1b3e6f;
+  display: inline-block;
+  width: 75%;
+  margin-bottom: 3rem;
+}
+.cmp-servcard .cmp-servcard__content .cmp-text {
+  font-size: 14px;
+  font-weight: 300;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: 1.71;
+  letter-spacing: normal;
+  color: #54565a;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 4;
+  overflow-y: hidden;
+  margin-bottom: 1rem;
+}
+.cmp-servcard .cmp-servcard__content .cmp-servcard__more {
+  display: inline-block;
+  width: 50px;
+  float: right;
+  border: none;
+  background: none;
+}
+
+.mobile-overflow {
+  overflow: hidden;
+}
+
+.cmp-servcard__open {
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+  height: 322px;
+}
+
+.last-card {
+  height: 322px;
+  text-align: center;
+}
+.last-card .cmp-servcard__content .cmp-servcard__more {
+  display: none;
+}
+.last-card .cmp-servcard__content .cmp-cardlink {
+  border: 2px solid #f16824;
+  padding: 10px 20px;
+}
+
+@media (min-width: 992px) {
+  .cmp-servcard,
+.last-card {
+    -webkit-box-flex: 0;
+    flex: 1 0 25%;
+    max-width: 30%;
+    height: 535px;
+    box-shadow: none;
+    display: inline-block;
+  }
+  .cmp-servcard .cmp-servcard__image,
+.last-card .cmp-servcard__image {
+    display: -webkit-box;
+    display: flex;
+    width: 100%;
+    max-height: 293px;
+    overflow: hidden;
+  }
+  .cmp-servcard .cmp-servcard__image .cmp-image,
+.last-card .cmp-servcard__image .cmp-image {
+    width: 100%;
+  }
+  .cmp-servcard .cmp-servcard__content,
+.last-card .cmp-servcard__content {
+    padding: 30px 40px;
+  }
+  .cmp-servcard .cmp-servcard__content .cmp-heading,
+.last-card .cmp-servcard__content .cmp-heading {
+    color: #1b3e6f;
+  }
+  .cmp-servcard .cmp-servcard__content .cmp-text,
+.last-card .cmp-servcard__content .cmp-text {
+    font-size: 14px;
+    font-weight: 300;
+    font-stretch: normal;
+    font-style: normal;
+    line-height: 1.71;
+    letter-spacing: normal;
+    color: #54565a;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+    overflow-y: hidden;
+  }
+  .cmp-servcard .cmp-servcard__content .cmp-servcard__more,
+.last-card .cmp-servcard__content .cmp-servcard__more {
+    display: none;
+  }
+
+  .mobile-overflow {
+    overflow: visible;
+  }
+
+  .last-card {
+    text-align: left;
+  }
+  .last-card .cmp-servcard__content .cmp-cardlink {
+    border: 0px;
+    padding: 0 0 7px 0;
+  }
+
+  .cmp-servcard:hover {
+    box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+  }
+
+  .cmp-servcard:hover .cmp-imageblue .cmp-image {
+    opacity: 1;
+    -webkit-transition: 0.3s;
+    transition: 0.3s;
+  }
+
+  .cmp-servcard:hover .cmp-cardlink {
+    text-decoration: none;
+    color: #1b3d6e;
+    cursor: pointer;
+    border-bottom: 2px solid #f16824;
+  }
+}
+/**
+ *  Main css for Imageblue
+ */
+.cmp-imageblue {
+  width: -webkit-fit-content;
+  width: -moz-fit-content;
+  width: fit-content;
+}
+.cmp-imageblue .cmp-image {
+  opacity: 0.5;
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+}
+
+.cmp-imageblue:hover .cmp-image {
+  opacity: 1;
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+}
+
+/**
+ *  Main css for CardLink
+ */
+.cmp-cardlink {
+  color: #1b3d6e;
+  text-transform: uppercase;
+  font-weight: bold;
+  font-size: 0.75rem;
+  font-weight: bold;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: normal;
+  letter-spacing: normal;
+  padding-bottom: 7px;
+  color: #1b3d6e;
+  border-bottom: 2px solid #f16824;
+  width: -webkit-fit-content;
+  width: -moz-fit-content;
+  width: fit-content;
+}
+
+.cmp-cardlink:hover {
+  text-decoration: none;
+  color: #1b3d6e;
+}
+
+@media (min-width: 992px) {
+  .cmp-cardlink {
+    border-bottom: none;
+  }
+
+  .cmp-cardlink:hover {
+    cursor: pointer;
+    border-bottom: 2px solid #f16824;
+  }
+}
+/**
+ *  Main css for Companies
+ */
+@media (min-width: 992px) {
+  .cmp-companies__bs a.cmp-slider-prev,
+.cmp-companies__bs a.cmp-slider-next {
+    position: absolute;
+    margin-top: -50px;
+  }
+  .cmp-companies__bs a.cmp-slider-prev {
+    left: 1em;
+  }
+  .cmp-companies__bs a.cmp-slider-next {
+    right: 1em;
+  }
+  .cmp-companies__bs ol.carousel-indicators {
+    display: none;
+  }
+}
+
+.cmp-companies-page {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+}
+.cmp-companies-page .cmp-companies-company {
+  width: 33%;
+  -webkit-box-flex: 0;
+          flex: 0 0 33.333%;
+  max-width: 33.333%;
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+}
+.cmp-companies-page .cmp-companies-company .cmp-companies-logo {
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+}
+.cmp-companies-page .cmp-companies-company .cmp-company-affiliation {
+  font-size: 8px;
+  line-height: 1.25;
+  letter-spacing: 0.16px;
+  color: #54565a;
+  text-transform: uppercase;
+}
+@media (min-width: 992px) {
+  .cmp-companies-page .cmp-companies-company {
+    width: 20%;
+    -webkit-box-flex: 0;
+            flex: 0 0 20%;
+    max-width: 20%;
+  }
+  .cmp-companies-page .cmp-companies-company .cmp-company-affiliation {
+    font-size: 10px;
+    letter-spacing: 0.2px;
+    -webkit-box-ordinal-group: 0;
+            order: -1;
+  }
+}
+
+.cmp-companies-page {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+}
+.cmp-companies-page .cmp-companies-company {
+  width: 33%;
+  -webkit-box-flex: 0;
+          flex: 0 0 33.333%;
+  max-width: 33.333%;
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+          flex-direction: column;
+}
+@media (min-width: 992px) {
+  .cmp-companies-page .cmp-companies-company {
+    width: 20%;
+    -webkit-box-flex: 0;
+            flex: 0 0 20%;
+    max-width: 20%;
+  }
+  .cmp-companies-page .cmp-companies-company .cmp-company-affiliation {
+    -webkit-box-ordinal-group: 0;
+            order: -1;
+  }
+}
+
+/**
+ *  Main css for Latest
+ */
+.bg-primary-100 {
+  background-color: #004987;
+}
+
+.cmp-latest {
+  padding-top: 1.5rem;
+  padding-bottom: 8rem;
+}
+.cmp-latest .cmp-heading {
+  color: white;
+}
+.cmp-latest .cmp-servcard,
+.cmp-latest .last-card {
+  width: 475px;
+  height: 535px;
+  box-shadow: none;
+  display: inline-block;
+}
+.cmp-latest .cmp-servcard .cmp-servcard__image,
+.cmp-latest .last-card .cmp-servcard__image {
+  display: -webkit-box;
+  display: flex;
+  width: 100%;
+  max-height: 293px;
+  overflow: hidden;
+}
+.cmp-latest .cmp-servcard .cmp-servcard__image .cmp-image,
+.cmp-latest .last-card .cmp-servcard__image .cmp-image {
+  width: 100%;
+}
+.cmp-latest .cmp-servcard .cmp-servcard__content,
+.cmp-latest .last-card .cmp-servcard__content {
+  padding: 30px 40px;
+}
+.cmp-latest .cmp-servcard .cmp-servcard__content .cmp-heading,
+.cmp-latest .last-card .cmp-servcard__content .cmp-heading {
+  color: #1b3e6f;
+}
+.cmp-latest .cmp-servcard .cmp-servcard__content .cmp-text,
+.cmp-latest .last-card .cmp-servcard__content .cmp-text {
+  font-size: 14px;
+  font-weight: 300;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: 1.71;
+  letter-spacing: normal;
+  color: #54565a;
+  padding-bottom: 15px;
+}
+.cmp-latest .cmp-servcard .cmp-servcard__content .cmp-servcard__more,
+.cmp-latest .last-card .cmp-servcard__content .cmp-servcard__more {
+  display: none;
+}
+.cmp-latest .mobile-overflow {
+  overflow: visible;
+}
+.cmp-latest .last-card {
+  text-align: left;
+}
+.cmp-latest .last-card .cmp-servcard__content .cmp-cardlink {
+  border: 0px;
+  padding: 0 0 7px 0;
+}
+.cmp-latest .cmp-servcard:hover {
+  box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+}
+.cmp-latest .cmp-servcard:hover .cmp-imageblue .cmp-image {
+  opacity: 1;
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+}
+.cmp-latest .cmp-servcard:hover .cmp-cardlink {
+  text-decoration: none;
+  color: #1b3d6e;
+  cursor: pointer;
+  border-bottom: 2px solid #f16824;
+}
+.cmp-latest .more-news {
+  margin: 0 auto;
+  margin-top: 40px;
+}
+.cmp-latest .cmp-button {
+  color: white;
+}
+
+/**
+ *  Main css for Servcard
+ */
+.cmp-latestcard {
+  box-shadow: none;
+  margin: 0 auto;
+  margin-top: 20px;
+  padding-bottom: 20px;
+  width: 95%;
+}
+.cmp-latestcard .cmp-latestcard__image {
+  display: -webkit-box;
+  display: flex;
+  width: 100%;
+  max-height: 293px;
+  overflow: hidden;
+}
+.cmp-latestcard .cmp-latestcard__image .cmp-image {
+  width: 100%;
+}
+.cmp-latestcard .cmp-latestcard__content {
+  background: white;
+  padding: 30px 40px;
+}
+.cmp-latestcard .cmp-latestcard__content .cmp-heading {
+  color: #1b3e6f;
+}
+.cmp-latestcard .cmp-latestcard__content .cmp-text {
+  font-size: 14px;
+  font-weight: 300;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: 1.71;
+  letter-spacing: normal;
+  color: #54565a;
+  padding-bottom: 15px;
+}
+.cmp-latestcard .cmp-latestcard__content .cmp-latestcard__more {
+  display: none;
+}
+
+.cmp-latestcard:hover {
+  box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+}
+
+.cmp-latestcard:hover .cmp-imageblue .cmp-image {
+  opacity: 1;
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+}
+
+.cmp-latestcard:hover .cmp-cardlink {
+  text-decoration: none;
+  color: #1b3d6e;
+  cursor: pointer;
+  border-bottom: 2px solid #f16824;
+}
+
+/**
+ *  Main css for LatestHeading
+ */
+.cmp-latestHeading {
+  margin-bottom: 1rem;
+  text-transform: uppercase;
+  height: 20px;
+}
+.cmp-latestHeading .heading-title {
+  color: white;
+  float: left;
+}
+.cmp-latestHeading .heading-link {
+  background: none;
+  border: 0;
+  border-bottom: 2px solid #f16824;
+  color: white;
+  float: right;
+  font-weight: bold;
+  font-size: 0.75rem;
+  font-weight: bold;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: normal;
+  letter-spacing: normal;
+  padding-bottom: 7px;
+  text-transform: uppercase;
+}
+.cmp-latestHeading .heading-link:hover {
+  text-decoration: none;
+}
+@media (min-width: 992px) {
+  .cmp-latestHeading .heading-link {
+    border-bottom: none;
+  }
+  .cmp-latestHeading .heading-link:hover {
+    cursor: pointer;
+    border-bottom: 2px solid #f16824;
+  }
+}
+
+/**
+ *  Main css for Whatwedo
+ */
+.cmp-whatwedo {
+  width: 100%;
+  max-width: 1600px;
+  height: 1000px;
+}
+.cmp-whatwedo .cmp-whatwedo__bgmobile.d-lg-none {
+  margin-bottom: 140px;
+}
+.cmp-whatwedo .cmp-whatwedo__bgmobile.d-lg-none .cmp-skew {
+  height: inherit;
+  width: 100%;
+  overflow: hidden;
+}
+.cmp-whatwedo .cmp-whatwedo__bgmobile.d-lg-none .cmp-skew .cmp-whatwedo__mob-bluefilter {
+  width: 100%;
+  height: 500px;
+  background-color: #05056696;
+  opacity: 0.7;
+  position: absolute;
+  margin-top: -140px;
+}
+.cmp-whatwedo .cmp-whatwedo__about-us {
+  width: 330px;
+  margin: 0px auto;
+}
+.cmp-whatwedo .cmp-whatwedo__about-us .cmp-jumbo .cmp-text {
+  font-weight: 300;
+}
+
+@media (min-width: 992px) {
+  .cmp-whatwedo .cmp-whatwedo__bgdesk {
+    height: inherit;
+    width: 100%;
+    position: absolute;
+    z-index: -1;
+  }
+  .cmp-whatwedo .cmp-whatwedo__bgdesk .cmp-skew {
+    margin-top: 0px;
+    height: inherit;
+    width: 100%;
+    position: absolute;
+    z-index: -1;
+  }
+  .cmp-whatwedo .cmp-whatwedo__bgdesk .cmp-skew .cmp-tricolor__position-inverted {
+    margin-top: 0px;
+    height: inherit;
+  }
+  .cmp-whatwedo .cmp-whatwedo__about-us {
+    width: 530px;
+    float: right;
+    margin: 250px 200px 0px 0px;
+  }
+}
+/**
+ *  Main css for Video
+ */
+@-webkit-keyframes plyr-progress {
+  to {
+    background-position: 25px 0;
+  }
+}
+@keyframes plyr-progress {
+  to {
+    background-position: 25px 0;
+  }
+}
+@-webkit-keyframes plyr-popup {
+  0% {
+    opacity: 0.5;
+    -webkit-transform: translateY(10px);
+            transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+  }
+}
+@keyframes plyr-popup {
+  0% {
+    opacity: 0.5;
+    -webkit-transform: translateY(10px);
+            transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+  }
+}
+@-webkit-keyframes plyr-fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes plyr-fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+.plyr {
+  -moz-osx-font-smoothing: auto;
+  -webkit-font-smoothing: subpixel-antialiased;
+  direction: ltr;
+  font-family: Avenir, "Avenir Next", "Helvetica Neue", "Segoe UI", Helvetica, Arial, sans-serif;
+  font-variant-numeric: tabular-nums;
+  font-weight: 500;
+  line-height: 1.7;
+  max-width: 100%;
+  min-width: 200px;
+  position: relative;
+  text-shadow: none;
+  -webkit-transition: box-shadow 0.3s ease;
+  transition: box-shadow 0.3s ease;
+}
+.plyr video,
+.plyr audio {
+  border-radius: inherit;
+  height: auto;
+  vertical-align: middle;
+  width: 100%;
+}
+.plyr button {
+  font: inherit;
+  line-height: inherit;
+  width: auto;
+}
+.plyr:focus {
+  outline: 0;
+}
+
+.plyr--full-ui {
+  box-sizing: border-box;
+}
+.plyr--full-ui *,
+.plyr--full-ui *::after,
+.plyr--full-ui *::before {
+  box-sizing: inherit;
+}
+
+.plyr--full-ui a,
+.plyr--full-ui button,
+.plyr--full-ui input,
+.plyr--full-ui label {
+  touch-action: manipulation;
+}
+
+.plyr__badge {
+  background: #4a5764;
+  border-radius: 2px;
+  color: #fff;
+  font-size: 9px;
+  line-height: 1;
+  padding: 3px 4px;
+}
+
+.plyr--full-ui ::-webkit-media-text-track-container {
+  display: none;
+}
+
+.plyr__captions {
+  -webkit-animation: plyr-fade-in 0.3s ease;
+          animation: plyr-fade-in 0.3s ease;
+  bottom: 0;
+  color: #fff;
+  display: none;
+  font-size: 14px;
+  left: 0;
+  padding: 10px;
+  position: absolute;
+  text-align: center;
+  -webkit-transition: -webkit-transform 0.4s ease-in-out;
+  transition: -webkit-transform 0.4s ease-in-out;
+  transition: transform 0.4s ease-in-out;
+  transition: transform 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out;
+  width: 100%;
+}
+.plyr__captions .plyr__caption {
+  background: rgba(0, 0, 0, 0.8);
+  border-radius: 2px;
+  -webkit-box-decoration-break: clone;
+          box-decoration-break: clone;
+  line-height: 185%;
+  padding: 0.2em 0.5em;
+  white-space: pre-wrap;
+}
+.plyr__captions .plyr__caption div {
+  display: inline;
+}
+.plyr__captions span:empty {
+  display: none;
+}
+@media (min-width: 480px) {
+  .plyr__captions {
+    font-size: 16px;
+    padding: 20px;
+  }
+}
+@media (min-width: 768px) {
+  .plyr__captions {
+    font-size: 18px;
+  }
+}
+
+.plyr--captions-active .plyr__captions {
+  display: block;
+}
+
+.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty) ~ .plyr__captions {
+  -webkit-transform: translateY(-40px);
+          transform: translateY(-40px);
+}
+
+.plyr__control {
+  background: transparent;
+  border: 0;
+  border-radius: 3px;
+  color: inherit;
+  cursor: pointer;
+  flex-shrink: 0;
+  overflow: visible;
+  padding: 7px;
+  position: relative;
+  -webkit-transition: all 0.3s ease;
+  transition: all 0.3s ease;
+}
+.plyr__control svg {
+  display: block;
+  fill: currentColor;
+  height: 18px;
+  pointer-events: none;
+  width: 18px;
+}
+.plyr__control:focus {
+  outline: 0;
+}
+.plyr__control.plyr__tab-focus {
+  box-shadow: 0 0 0 5px rgba(0, 179, 255, 0.5);
+  outline: 0;
+}
+
+a.plyr__control {
+  text-decoration: none;
+}
+a.plyr__control::after, a.plyr__control::before {
+  display: none;
+}
+
+.plyr__control:not(.plyr__control--pressed) .icon--pressed,
+.plyr__control.plyr__control--pressed .icon--not-pressed,
+.plyr__control:not(.plyr__control--pressed) .label--pressed,
+.plyr__control.plyr__control--pressed .label--not-pressed {
+  display: none;
+}
+
+.plyr--audio .plyr__control.plyr__tab-focus, .plyr--audio .plyr__control:hover, .plyr--audio .plyr__control[aria-expanded=true] {
+  background: #00b3ff;
+  color: #fff;
+}
+
+.plyr--video .plyr__control.plyr__tab-focus, .plyr--video .plyr__control:hover, .plyr--video .plyr__control[aria-expanded=true] {
+  background: #00b3ff;
+  color: #fff;
+}
+
+.plyr__control--overlaid {
+  background: rgba(0, 179, 255, 0.8);
+  border: 0;
+  border-radius: 100%;
+  color: #fff;
+  display: none;
+  left: 50%;
+  padding: 15px;
+  position: absolute;
+  top: 50%;
+  -webkit-transform: translate(-50%, -50%);
+          transform: translate(-50%, -50%);
+  z-index: 2;
+}
+.plyr__control--overlaid svg {
+  left: 2px;
+  position: relative;
+}
+.plyr__control--overlaid:hover, .plyr__control--overlaid:focus {
+  background: #00b3ff;
+}
+
+.plyr--playing .plyr__control--overlaid {
+  opacity: 0;
+  visibility: hidden;
+}
+
+.plyr--full-ui.plyr--video .plyr__control--overlaid {
+  display: block;
+}
+
+.plyr--full-ui ::-webkit-media-controls {
+  display: none;
+}
+
+.plyr__controls {
+  -webkit-box-align: center;
+          align-items: center;
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-pack: end;
+          justify-content: flex-end;
+  text-align: center;
+}
+.plyr__controls .plyr__progress__container {
+  -webkit-box-flex: 1;
+          flex: 1;
+  min-width: 0;
+}
+.plyr__controls .plyr__controls__item {
+  margin-left: 2.5px;
+}
+.plyr__controls .plyr__controls__item:first-child {
+  margin-left: 0;
+  margin-right: auto;
+}
+.plyr__controls .plyr__controls__item.plyr__progress__container {
+  padding-left: 2.5px;
+}
+.plyr__controls .plyr__controls__item.plyr__time {
+  padding: 0 5px;
+}
+.plyr__controls .plyr__controls__item.plyr__progress__container:first-child, .plyr__controls .plyr__controls__item.plyr__time:first-child, .plyr__controls .plyr__controls__item.plyr__time + .plyr__time {
+  padding-left: 0;
+}
+.plyr__controls .plyr__controls__item.plyr__volume {
+  padding-right: 5px;
+}
+.plyr__controls .plyr__controls__item.plyr__volume:first-child {
+  padding-right: 0;
+}
+.plyr__controls:empty {
+  display: none;
+}
+
+.plyr--audio .plyr__controls {
+  background: #fff;
+  border-radius: inherit;
+  color: #4a5764;
+  padding: 10px;
+}
+
+.plyr--video .plyr__controls {
+  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.7)));
+  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
+  border-bottom-left-radius: inherit;
+  border-bottom-right-radius: inherit;
+  bottom: 0;
+  color: #fff;
+  left: 0;
+  padding: 20px 5px 5px;
+  position: absolute;
+  right: 0;
+  -webkit-transition: opacity 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out;
+  transition: opacity 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out;
+  transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
+  transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out;
+  z-index: 3;
+}
+@media (min-width: 480px) {
+  .plyr--video .plyr__controls {
+    padding: 35px 10px 10px;
+  }
+}
+
+.plyr--video.plyr--hide-controls .plyr__controls {
+  opacity: 0;
+  pointer-events: none;
+  -webkit-transform: translateY(100%);
+          transform: translateY(100%);
+}
+
+.plyr [data-plyr=captions],
+.plyr [data-plyr=pip],
+.plyr [data-plyr=airplay],
+.plyr [data-plyr=fullscreen] {
+  display: none;
+}
+
+.plyr--captions-enabled [data-plyr=captions],
+.plyr--pip-supported [data-plyr=pip],
+.plyr--airplay-supported [data-plyr=airplay],
+.plyr--fullscreen-enabled [data-plyr=fullscreen] {
+  display: inline-block;
+}
+
+.plyr__menu {
+  display: -webkit-box;
+  display: flex;
+  position: relative;
+}
+.plyr__menu .plyr__control svg {
+  -webkit-transition: -webkit-transform 0.3s ease;
+  transition: -webkit-transform 0.3s ease;
+  transition: transform 0.3s ease;
+  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
+}
+.plyr__menu .plyr__control[aria-expanded=true] svg {
+  -webkit-transform: rotate(90deg);
+          transform: rotate(90deg);
+}
+.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip {
+  display: none;
+}
+.plyr__menu__container {
+  -webkit-animation: plyr-popup 0.2s ease;
+          animation: plyr-popup 0.2s ease;
+  background: rgba(255, 255, 255, 0.9);
+  border-radius: 4px;
+  bottom: 100%;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
+  color: #4a5764;
+  font-size: 16px;
+  margin-bottom: 10px;
+  position: absolute;
+  right: -3px;
+  text-align: left;
+  white-space: nowrap;
+  z-index: 3;
+}
+.plyr__menu__container > div {
+  overflow: hidden;
+  -webkit-transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1), width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
+  transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1), width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
+}
+.plyr__menu__container::after {
+  border: 4px solid transparent;
+  border-top-color: rgba(255, 255, 255, 0.9);
+  content: "";
+  height: 0;
+  position: absolute;
+  right: 15px;
+  top: 100%;
+  width: 0;
+}
+.plyr__menu__container [role=menu] {
+  padding: 7px;
+}
+.plyr__menu__container [role=menuitem],
+.plyr__menu__container [role=menuitemradio] {
+  margin-top: 2px;
+}
+.plyr__menu__container [role=menuitem]:first-child,
+.plyr__menu__container [role=menuitemradio]:first-child {
+  margin-top: 0;
+}
+.plyr__menu__container .plyr__control {
+  -webkit-box-align: center;
+          align-items: center;
+  color: #4a5764;
+  display: -webkit-box;
+  display: flex;
+  font-size: 14px;
+  padding: 4px 11px;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  width: 100%;
+}
+.plyr__menu__container .plyr__control > span {
+  -webkit-box-align: inherit;
+          align-items: inherit;
+  display: -webkit-box;
+  display: flex;
+  width: 100%;
+}
+.plyr__menu__container .plyr__control::after {
+  border: 4px solid transparent;
+  content: "";
+  position: absolute;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+          transform: translateY(-50%);
+}
+.plyr__menu__container .plyr__control--forward {
+  padding-right: 28px;
+}
+.plyr__menu__container .plyr__control--forward::after {
+  border-left-color: rgba(74, 87, 100, 0.8);
+  right: 5px;
+}
+.plyr__menu__container .plyr__control--forward.plyr__tab-focus::after, .plyr__menu__container .plyr__control--forward:hover::after {
+  border-left-color: currentColor;
+}
+.plyr__menu__container .plyr__control--back {
+  font-weight: 500;
+  margin: 7px;
+  margin-bottom: 3px;
+  padding-left: 28px;
+  position: relative;
+  width: calc(100% - 14px);
+}
+.plyr__menu__container .plyr__control--back::after {
+  border-right-color: rgba(74, 87, 100, 0.8);
+  left: 7px;
+}
+.plyr__menu__container .plyr__control--back::before {
+  background: #c1c9d1;
+  box-shadow: 0 1px 0 #fff;
+  content: "";
+  height: 1px;
+  left: 0;
+  margin-top: 4px;
+  overflow: hidden;
+  position: absolute;
+  right: 0;
+  top: 100%;
+}
+.plyr__menu__container .plyr__control--back.plyr__tab-focus::after, .plyr__menu__container .plyr__control--back:hover::after {
+  border-right-color: currentColor;
+}
+.plyr__menu__container .plyr__control[role=menuitemradio] {
+  padding-left: 7px;
+}
+.plyr__menu__container .plyr__control[role=menuitemradio]::before, .plyr__menu__container .plyr__control[role=menuitemradio]::after {
+  border-radius: 100%;
+}
+.plyr__menu__container .plyr__control[role=menuitemradio]::before {
+  background: rgba(0, 0, 0, 0.1);
+  content: "";
+  display: block;
+  flex-shrink: 0;
+  height: 16px;
+  margin-right: 10px;
+  -webkit-transition: all 0.3s ease;
+  transition: all 0.3s ease;
+  width: 16px;
+}
+.plyr__menu__container .plyr__control[role=menuitemradio]::after {
+  background: #fff;
+  border: 0;
+  height: 6px;
+  left: 12px;
+  opacity: 0;
+  top: 50%;
+  -webkit-transform: translateY(-50%) scale(0);
+          transform: translateY(-50%) scale(0);
+  -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
+  transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
+  transition: transform 0.3s ease, opacity 0.3s ease;
+  transition: transform 0.3s ease, opacity 0.3s ease, -webkit-transform 0.3s ease;
+  width: 6px;
+}
+.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before {
+  background: #00b3ff;
+}
+.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::after {
+  opacity: 1;
+  -webkit-transform: translateY(-50%) scale(1);
+          transform: translateY(-50%) scale(1);
+}
+.plyr__menu__container .plyr__control[role=menuitemradio].plyr__tab-focus::before, .plyr__menu__container .plyr__control[role=menuitemradio]:hover::before {
+  background: rgba(0, 0, 0, 0.1);
+}
+.plyr__menu__container .plyr__menu__value {
+  -webkit-box-align: center;
+          align-items: center;
+  display: -webkit-box;
+  display: flex;
+  margin-left: auto;
+  margin-right: -5px;
+  overflow: hidden;
+  padding-left: 25px;
+  pointer-events: none;
+}
+
+.plyr--full-ui input[type=range] {
+  -webkit-appearance: none;
+  /* stylelint-disable-line */
+  background: transparent;
+  border: 0;
+  border-radius: 26px;
+  color: #00b3ff;
+  display: block;
+  height: 19px;
+  margin: 0;
+  padding: 0;
+  -webkit-transition: box-shadow 0.3s ease;
+  transition: box-shadow 0.3s ease;
+  width: 100%;
+}
+.plyr--full-ui input[type=range]::-webkit-slider-runnable-track {
+  background: transparent;
+  border: 0;
+  border-radius: 2.5px;
+  height: 5px;
+  -webkit-transition: box-shadow 0.3s ease;
+  transition: box-shadow 0.3s ease;
+  -webkit-user-select: none;
+          user-select: none;
+  background-image: -webkit-gradient(linear, left top, right top, from(currentColor), to(transparent));
+  background-image: linear-gradient(to right, currentColor var(--value, 0%), transparent var(--value, 0%));
+}
+.plyr--full-ui input[type=range]::-webkit-slider-thumb {
+  background: #fff;
+  border: 0;
+  border-radius: 100%;
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2);
+  height: 13px;
+  position: relative;
+  -webkit-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+  width: 13px;
+  -webkit-appearance: none;
+  /* stylelint-disable-line */
+  margin-top: -4px;
+}
+.plyr--full-ui input[type=range]::-moz-range-track {
+  background: transparent;
+  border: 0;
+  border-radius: 2.5px;
+  height: 5px;
+  -webkit-transition: box-shadow 0.3s ease;
+  transition: box-shadow 0.3s ease;
+  -moz-user-select: none;
+       user-select: none;
+}
+.plyr--full-ui input[type=range]::-moz-range-thumb {
+  background: #fff;
+  border: 0;
+  border-radius: 100%;
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2);
+  height: 13px;
+  position: relative;
+  -webkit-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+  width: 13px;
+}
+.plyr--full-ui input[type=range]::-moz-range-progress {
+  background: currentColor;
+  border-radius: 2.5px;
+  height: 5px;
+}
+.plyr--full-ui input[type=range]::-ms-track {
+  background: transparent;
+  border: 0;
+  border-radius: 2.5px;
+  height: 5px;
+  -webkit-transition: box-shadow 0.3s ease;
+  transition: box-shadow 0.3s ease;
+  -ms-user-select: none;
+      user-select: none;
+  color: transparent;
+}
+.plyr--full-ui input[type=range]::-ms-fill-upper {
+  background: transparent;
+  border: 0;
+  border-radius: 2.5px;
+  height: 5px;
+  -webkit-transition: box-shadow 0.3s ease;
+  transition: box-shadow 0.3s ease;
+  -ms-user-select: none;
+      user-select: none;
+}
+.plyr--full-ui input[type=range]::-ms-fill-lower {
+  background: transparent;
+  border: 0;
+  border-radius: 2.5px;
+  height: 5px;
+  -webkit-transition: box-shadow 0.3s ease;
+  transition: box-shadow 0.3s ease;
+  -ms-user-select: none;
+      user-select: none;
+  background: currentColor;
+}
+.plyr--full-ui input[type=range]::-ms-thumb {
+  background: #fff;
+  border: 0;
+  border-radius: 100%;
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2);
+  height: 13px;
+  position: relative;
+  -webkit-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+  width: 13px;
+  margin-top: 0;
+}
+.plyr--full-ui input[type=range]::-ms-tooltip {
+  display: none;
+}
+.plyr--full-ui input[type=range]:focus {
+  outline: 0;
+}
+.plyr--full-ui input[type=range]::-moz-focus-outer {
+  border: 0;
+}
+.plyr--full-ui input[type=range].plyr__tab-focus::-webkit-slider-runnable-track {
+  box-shadow: 0 0 0 5px rgba(0, 179, 255, 0.5);
+  outline: 0;
+}
+.plyr--full-ui input[type=range].plyr__tab-focus::-moz-range-track {
+  box-shadow: 0 0 0 5px rgba(0, 179, 255, 0.5);
+  outline: 0;
+}
+.plyr--full-ui input[type=range].plyr__tab-focus::-ms-track {
+  box-shadow: 0 0 0 5px rgba(0, 179, 255, 0.5);
+  outline: 0;
+}
+
+.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track {
+  background-color: rgba(255, 255, 255, 0.25);
+}
+.plyr--full-ui.plyr--video input[type=range]::-moz-range-track {
+  background-color: rgba(255, 255, 255, 0.25);
+}
+.plyr--full-ui.plyr--video input[type=range]::-ms-track {
+  background-color: rgba(255, 255, 255, 0.25);
+}
+.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb {
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2), 0 0 0 3px rgba(255, 255, 255, 0.5);
+}
+.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb {
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2), 0 0 0 3px rgba(255, 255, 255, 0.5);
+}
+.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb {
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2), 0 0 0 3px rgba(255, 255, 255, 0.5);
+}
+
+.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track {
+  background-color: rgba(193, 201, 209, 0.66);
+}
+.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track {
+  background-color: rgba(193, 201, 209, 0.66);
+}
+.plyr--full-ui.plyr--audio input[type=range]::-ms-track {
+  background-color: rgba(193, 201, 209, 0.66);
+}
+.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb {
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2), 0 0 0 3px rgba(0, 0, 0, 0.1);
+}
+.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb {
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2), 0 0 0 3px rgba(0, 0, 0, 0.1);
+}
+.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb {
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(35, 41, 47, 0.2), 0 0 0 3px rgba(0, 0, 0, 0.1);
+}
+
+.plyr__poster {
+  background-color: #000;
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+  background-size: contain;
+  height: 100%;
+  left: 0;
+  opacity: 0;
+  position: absolute;
+  top: 0;
+  -webkit-transition: opacity 0.2s ease;
+  transition: opacity 0.2s ease;
+  width: 100%;
+  z-index: 1;
+}
+
+.plyr--stopped.plyr__poster-enabled .plyr__poster {
+  opacity: 1;
+}
+
+.plyr__time {
+  font-size: 14px;
+}
+
+.plyr__time + .plyr__time::before {
+  content: "⁄";
+  margin-right: 10px;
+}
+@media (max-width: 767px) {
+  .plyr__time + .plyr__time {
+    display: none;
+  }
+}
+
+.plyr--video .plyr__time {
+  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
+}
+
+.plyr__tooltip {
+  background: rgba(255, 255, 255, 0.9);
+  border-radius: 3px;
+  bottom: 100%;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
+  color: #4a5764;
+  font-size: 14px;
+  font-weight: 500;
+  left: 50%;
+  line-height: 1.3;
+  margin-bottom: 10px;
+  opacity: 0;
+  padding: 5px 7.5px;
+  pointer-events: none;
+  position: absolute;
+  -webkit-transform: translate(-50%, 10px) scale(0.8);
+          transform: translate(-50%, 10px) scale(0.8);
+  -webkit-transform-origin: 50% 100%;
+          transform-origin: 50% 100%;
+  -webkit-transition: opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
+  transition: opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
+  transition: transform 0.2s 0.1s ease, opacity 0.2s 0.1s ease;
+  transition: transform 0.2s 0.1s ease, opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
+  white-space: nowrap;
+  z-index: 2;
+}
+.plyr__tooltip::before {
+  border-left: 4px solid transparent;
+  border-right: 4px solid transparent;
+  border-top: 4px solid rgba(255, 255, 255, 0.9);
+  bottom: -4px;
+  content: "";
+  height: 0;
+  left: 50%;
+  position: absolute;
+  -webkit-transform: translateX(-50%);
+          transform: translateX(-50%);
+  width: 0;
+  z-index: 2;
+}
+
+.plyr .plyr__control:hover .plyr__tooltip,
+.plyr .plyr__control.plyr__tab-focus .plyr__tooltip,
+.plyr__tooltip--visible {
+  opacity: 1;
+  -webkit-transform: translate(-50%, 0) scale(1);
+          transform: translate(-50%, 0) scale(1);
+}
+
+.plyr .plyr__control:hover .plyr__tooltip {
+  z-index: 3;
+}
+
+.plyr__controls > .plyr__control:first-child .plyr__tooltip,
+.plyr__controls > .plyr__control:first-child + .plyr__control .plyr__tooltip {
+  left: 0;
+  -webkit-transform: translate(0, 10px) scale(0.8);
+          transform: translate(0, 10px) scale(0.8);
+  -webkit-transform-origin: 0 100%;
+          transform-origin: 0 100%;
+}
+.plyr__controls > .plyr__control:first-child .plyr__tooltip::before,
+.plyr__controls > .plyr__control:first-child + .plyr__control .plyr__tooltip::before {
+  left: 16px;
+}
+
+.plyr__controls > .plyr__control:last-child .plyr__tooltip {
+  left: auto;
+  right: 0;
+  -webkit-transform: translate(0, 10px) scale(0.8);
+          transform: translate(0, 10px) scale(0.8);
+  -webkit-transform-origin: 100% 100%;
+          transform-origin: 100% 100%;
+}
+.plyr__controls > .plyr__control:last-child .plyr__tooltip::before {
+  left: auto;
+  right: 16px;
+  -webkit-transform: translateX(50%);
+          transform: translateX(50%);
+}
+
+.plyr__controls > .plyr__control:first-child:hover .plyr__tooltip, .plyr__controls > .plyr__control:first-child.plyr__tab-focus .plyr__tooltip,
+.plyr__controls > .plyr__control:first-child .plyr__tooltip--visible,
+.plyr__controls > .plyr__control:first-child + .plyr__control:hover .plyr__tooltip,
+.plyr__controls > .plyr__control:first-child + .plyr__control.plyr__tab-focus .plyr__tooltip,
+.plyr__controls > .plyr__control:first-child + .plyr__control .plyr__tooltip--visible,
+.plyr__controls > .plyr__control:last-child:hover .plyr__tooltip,
+.plyr__controls > .plyr__control:last-child.plyr__tab-focus .plyr__tooltip,
+.plyr__controls > .plyr__control:last-child .plyr__tooltip--visible {
+  -webkit-transform: translate(0, 0) scale(1);
+          transform: translate(0, 0) scale(1);
+}
+
+.plyr--video {
+  background: #000;
+  overflow: hidden;
+}
+.plyr--video.plyr--menu-open {
+  overflow: visible;
+}
+
+.plyr__video-wrapper {
+  background: #000;
+  border-radius: inherit;
+  overflow: hidden;
+  position: relative;
+  z-index: 0;
+}
+
+.plyr__video-embed,
+.plyr__video-wrapper--fixed-ratio {
+  height: 0;
+  padding-bottom: 56.25%;
+}
+
+.plyr__video-embed iframe,
+.plyr__video-wrapper--fixed-ratio video {
+  border: 0;
+  height: 100%;
+  left: 0;
+  position: absolute;
+  top: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  width: 100%;
+}
+
+.plyr--full-ui .plyr__video-embed > .plyr__video-embed__container {
+  padding-bottom: 240%;
+  position: relative;
+  -webkit-transform: translateY(-38.28125%);
+          transform: translateY(-38.28125%);
+}
+
+.plyr__progress {
+  left: 6.5px;
+  margin-right: 13px;
+  position: relative;
+}
+.plyr__progress input[type=range], .plyr__progress__buffer {
+  margin-left: -6.5px;
+  margin-right: -6.5px;
+  width: calc(100% + 13px);
+}
+.plyr__progress input[type=range] {
+  position: relative;
+  z-index: 2;
+}
+.plyr__progress .plyr__tooltip {
+  font-size: 14px;
+  left: 0;
+}
+
+.plyr__progress__buffer {
+  -webkit-appearance: none;
+  /* stylelint-disable-line */
+  background: transparent;
+  border: 0;
+  border-radius: 100px;
+  height: 5px;
+  left: 0;
+  margin-top: -2.5px;
+  padding: 0;
+  position: absolute;
+  top: 50%;
+}
+.plyr__progress__buffer::-webkit-progress-bar {
+  background: transparent;
+}
+.plyr__progress__buffer::-webkit-progress-value {
+  background: currentColor;
+  border-radius: 100px;
+  min-width: 5px;
+  -webkit-transition: width 0.2s ease;
+  transition: width 0.2s ease;
+}
+.plyr__progress__buffer::-moz-progress-bar {
+  background: currentColor;
+  border-radius: 100px;
+  min-width: 5px;
+  -webkit-transition: width 0.2s ease;
+  transition: width 0.2s ease;
+}
+.plyr__progress__buffer::-ms-fill {
+  border-radius: 100px;
+  -webkit-transition: width 0.2s ease;
+  transition: width 0.2s ease;
+}
+
+.plyr--video .plyr__progress__buffer {
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
+  color: rgba(255, 255, 255, 0.25);
+}
+
+.plyr--audio .plyr__progress__buffer {
+  color: rgba(193, 201, 209, 0.66);
+}
+
+.plyr--loading .plyr__progress__buffer {
+  -webkit-animation: plyr-progress 1s linear infinite;
+          animation: plyr-progress 1s linear infinite;
+  background-image: linear-gradient(-45deg, rgba(35, 41, 47, 0.6) 25%, transparent 25%, transparent 50%, rgba(35, 41, 47, 0.6) 50%, rgba(35, 41, 47, 0.6) 75%, transparent 75%, transparent);
+  background-repeat: repeat-x;
+  background-size: 25px 25px;
+  color: transparent;
+}
+
+.plyr--video.plyr--loading .plyr__progress__buffer {
+  background-color: rgba(255, 255, 255, 0.25);
+}
+
+.plyr--audio.plyr--loading .plyr__progress__buffer {
+  background-color: rgba(193, 201, 209, 0.66);
+}
+
+.plyr__volume {
+  -webkit-box-align: center;
+          align-items: center;
+  display: -webkit-box;
+  display: flex;
+  -webkit-box-flex: 1;
+          flex: 1;
+  position: relative;
+}
+.plyr__volume input[type=range] {
+  margin-left: 5px;
+  position: relative;
+  z-index: 2;
+}
+@media (min-width: 480px) {
+  .plyr__volume {
+    max-width: 90px;
+  }
+}
+@media (min-width: 768px) {
+  .plyr__volume {
+    max-width: 110px;
+  }
+}
+
+.plyr--is-ios .plyr__volume {
+  display: none !important;
+}
+
+.plyr--is-ios.plyr--vimeo [data-plyr=mute] {
+  display: none !important;
+}
+
+.plyr:-webkit-full-screen {
+  background: #000;
+  border-radius: 0 !important;
+  height: 100%;
+  margin: 0;
+  width: 100%;
+}
+
+.plyr:-moz-full-screen {
+  background: #000;
+  border-radius: 0 !important;
+  height: 100%;
+  margin: 0;
+  width: 100%;
+}
+
+.plyr:-ms-fullscreen {
+  background: #000;
+  border-radius: 0 !important;
+  height: 100%;
+  margin: 0;
+  width: 100%;
+}
+
+.plyr:fullscreen {
+  background: #000;
+  border-radius: 0 !important;
+  height: 100%;
+  margin: 0;
+  width: 100%;
+}
+.plyr:-webkit-full-screen video {
+  height: 100%;
+}
+.plyr:-moz-full-screen video {
+  height: 100%;
+}
+.plyr:-ms-fullscreen video {
+  height: 100%;
+}
+.plyr:fullscreen video {
+  height: 100%;
+}
+.plyr:-webkit-full-screen .plyr__video-wrapper {
+  height: 100%;
+  position: static;
+}
+.plyr:-moz-full-screen .plyr__video-wrapper {
+  height: 100%;
+  position: static;
+}
+.plyr:-ms-fullscreen .plyr__video-wrapper {
+  height: 100%;
+  position: static;
+}
+.plyr:fullscreen .plyr__video-wrapper {
+  height: 100%;
+  position: static;
+}
+.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper {
+  height: 0;
+  position: relative;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+          transform: translateY(-50%);
+}
+.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper {
+  height: 0;
+  position: relative;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper {
+  height: 0;
+  position: relative;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.plyr:fullscreen.plyr--vimeo .plyr__video-wrapper {
+  height: 0;
+  position: relative;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+          transform: translateY(-50%);
+}
+.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen {
+  display: block;
+}
+.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen {
+  display: block;
+}
+.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen {
+  display: block;
+}
+.plyr:fullscreen .plyr__control .icon--exit-fullscreen {
+  display: block;
+}
+.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen + svg {
+  display: none;
+}
+.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen + svg {
+  display: none;
+}
+.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen + svg {
+  display: none;
+}
+.plyr:fullscreen .plyr__control .icon--exit-fullscreen + svg {
+  display: none;
+}
+.plyr:-webkit-full-screen.plyr--hide-controls {
+  cursor: none;
+}
+.plyr:-moz-full-screen.plyr--hide-controls {
+  cursor: none;
+}
+.plyr:-ms-fullscreen.plyr--hide-controls {
+  cursor: none;
+}
+.plyr:fullscreen.plyr--hide-controls {
+  cursor: none;
+}
+@media (min-width: 1024px) {
+  .plyr:-webkit-full-screen .plyr__captions {
+    font-size: 21px;
+  }
+  .plyr:-moz-full-screen .plyr__captions {
+    font-size: 21px;
+  }
+  .plyr:-ms-fullscreen .plyr__captions {
+    font-size: 21px;
+  }
+  .plyr:fullscreen .plyr__captions {
+    font-size: 21px;
+  }
+}
+
+/* stylelint-disable-next-line */
+.plyr:-webkit-full-screen {
+  background: #000;
+  border-radius: 0 !important;
+  height: 100%;
+  margin: 0;
+  width: 100%;
+}
+.plyr:-webkit-full-screen video {
+  height: 100%;
+}
+.plyr:-webkit-full-screen .plyr__video-wrapper {
+  height: 100%;
+  position: static;
+}
+.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper {
+  height: 0;
+  position: relative;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+          transform: translateY(-50%);
+}
+.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen {
+  display: block;
+}
+.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen + svg {
+  display: none;
+}
+.plyr:-webkit-full-screen.plyr--hide-controls {
+  cursor: none;
+}
+@media (min-width: 1024px) {
+  .plyr:-webkit-full-screen .plyr__captions {
+    font-size: 21px;
+  }
+}
+
+/* stylelint-disable-next-line */
+.plyr:-moz-full-screen {
+  background: #000;
+  border-radius: 0 !important;
+  height: 100%;
+  margin: 0;
+  width: 100%;
+}
+.plyr:-moz-full-screen video {
+  height: 100%;
+}
+.plyr:-moz-full-screen .plyr__video-wrapper {
+  height: 100%;
+  position: static;
+}
+.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper {
+  height: 0;
+  position: relative;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen {
+  display: block;
+}
+.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen + svg {
+  display: none;
+}
+.plyr:-moz-full-screen.plyr--hide-controls {
+  cursor: none;
+}
+@media (min-width: 1024px) {
+  .plyr:-moz-full-screen .plyr__captions {
+    font-size: 21px;
+  }
+}
+
+/* stylelint-disable-next-line */
+.plyr:-ms-fullscreen {
+  background: #000;
+  border-radius: 0 !important;
+  height: 100%;
+  margin: 0;
+  width: 100%;
+}
+.plyr:-ms-fullscreen video {
+  height: 100%;
+}
+.plyr:-ms-fullscreen .plyr__video-wrapper {
+  height: 100%;
+  position: static;
+}
+.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper {
+  height: 0;
+  position: relative;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen {
+  display: block;
+}
+.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen + svg {
+  display: none;
+}
+.plyr:-ms-fullscreen.plyr--hide-controls {
+  cursor: none;
+}
+@media (min-width: 1024px) {
+  .plyr:-ms-fullscreen .plyr__captions {
+    font-size: 21px;
+  }
+}
+
+.plyr--fullscreen-fallback {
+  background: #000;
+  border-radius: 0 !important;
+  height: 100%;
+  margin: 0;
+  width: 100%;
+  bottom: 0;
+  left: 0;
+  position: fixed;
+  right: 0;
+  top: 0;
+  z-index: 10000000;
+}
+.plyr--fullscreen-fallback video {
+  height: 100%;
+}
+.plyr--fullscreen-fallback .plyr__video-wrapper {
+  height: 100%;
+  position: static;
+}
+.plyr--fullscreen-fallback.plyr--vimeo .plyr__video-wrapper {
+  height: 0;
+  position: relative;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+          transform: translateY(-50%);
+}
+.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen {
+  display: block;
+}
+.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen + svg {
+  display: none;
+}
+.plyr--fullscreen-fallback.plyr--hide-controls {
+  cursor: none;
+}
+@media (min-width: 1024px) {
+  .plyr--fullscreen-fallback .plyr__captions {
+    font-size: 21px;
+  }
+}
+
+.plyr__ads {
+  border-radius: inherit;
+  bottom: 0;
+  cursor: pointer;
+  left: 0;
+  overflow: hidden;
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: -1;
+}
+.plyr__ads > div,
+.plyr__ads > div iframe {
+  height: 100%;
+  position: absolute;
+  width: 100%;
+}
+.plyr__ads::after {
+  background: rgba(35, 41, 47, 0.8);
+  border-radius: 2px;
+  bottom: 10px;
+  color: #fff;
+  content: attr(data-badge-text);
+  font-size: 11px;
+  padding: 2px 6px;
+  pointer-events: none;
+  position: absolute;
+  right: 10px;
+  z-index: 3;
+}
+.plyr__ads::after:empty {
+  display: none;
+}
+
+.plyr__cues {
+  background: currentColor;
+  display: block;
+  height: 5px;
+  left: 0;
+  margin: -2.5px 0 0;
+  opacity: 0.8;
+  position: absolute;
+  top: 50%;
+  width: 3px;
+  z-index: 3;
+}
+
+.plyr__preview-thumb {
+  background-color: rgba(255, 255, 255, 0.9);
+  border-radius: 3px;
+  bottom: 100%;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
+  margin-bottom: 10px;
+  opacity: 0;
+  padding: 3px;
+  pointer-events: none;
+  position: absolute;
+  -webkit-transform: translate(0, 10px) scale(0.8);
+          transform: translate(0, 10px) scale(0.8);
+  -webkit-transform-origin: 50% 100%;
+          transform-origin: 50% 100%;
+  -webkit-transition: opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
+  transition: opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
+  transition: transform 0.2s 0.1s ease, opacity 0.2s 0.1s ease;
+  transition: transform 0.2s 0.1s ease, opacity 0.2s 0.1s ease, -webkit-transform 0.2s 0.1s ease;
+  z-index: 2;
+}
+.plyr__preview-thumb--is-shown {
+  opacity: 1;
+  -webkit-transform: translate(0, 0) scale(1);
+          transform: translate(0, 0) scale(1);
+}
+.plyr__preview-thumb::before {
+  border-left: 4px solid transparent;
+  border-right: 4px solid transparent;
+  border-top: 4px solid rgba(255, 255, 255, 0.9);
+  bottom: -4px;
+  content: "";
+  height: 0;
+  left: 50%;
+  position: absolute;
+  -webkit-transform: translateX(-50%);
+          transform: translateX(-50%);
+  width: 0;
+  z-index: 2;
+}
+.plyr__preview-thumb__image-container {
+  background: #c1c9d1;
+  border-radius: 2px;
+  overflow: hidden;
+  position: relative;
+  z-index: 0;
+}
+.plyr__preview-thumb__image-container img {
+  height: 100%;
+  left: 0;
+  max-height: none;
+  max-width: none;
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+.plyr__preview-thumb__time-container {
+  bottom: 6px;
+  left: 0;
+  position: absolute;
+  right: 0;
+  white-space: nowrap;
+  z-index: 3;
+}
+.plyr__preview-thumb__time-container span {
+  background-color: rgba(0, 0, 0, 0.55);
+  border-radius: 2px;
+  color: #fff;
+  font-size: 14px;
+  padding: 3px 6px;
+}
+
+.plyr__preview-scrubbing {
+  bottom: 0;
+  -webkit-filter: blur(1px);
+          filter: blur(1px);
+  height: 100%;
+  left: 0;
+  margin: auto;
+  opacity: 0;
+  overflow: hidden;
+  position: absolute;
+  right: 0;
+  top: 0;
+  -webkit-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
+  width: 100%;
+  z-index: 1;
+}
+.plyr__preview-scrubbing--is-shown {
+  opacity: 1;
+}
+.plyr__preview-scrubbing img {
+  height: 100%;
+  left: 0;
+  max-height: none;
+  max-width: none;
+  -o-object-fit: contain;
+     object-fit: contain;
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+
+.plyr--no-transition {
+  -webkit-transition: none !important;
+  transition: none !important;
+}
+
+.plyr__sr-only {
+  clip: rect(1px, 1px, 1px, 1px);
+  overflow: hidden;
+  border: 0 !important;
+  height: 1px !important;
+  padding: 0 !important;
+  position: absolute !important;
+  width: 1px !important;
+}
+
+.plyr [hidden] {
+  display: none !important;
+}
+
+/**
+ *  Main css for Footer
+ */
+.cmp-footer {
+  color: white;
+}
+.cmp-footer__main {
+  width: 100%;
+  margin: 0;
+  padding: 40px 15px;
+  background-color: #1b3e6f;
+}
+.cmp-footer__main .cmp-footer__main-lists-continer.card-columns {
+  -webkit-column-count: 1;
+     -moz-column-count: 1;
+          column-count: 1;
+  margin-bottom: 50px;
+}
+.cmp-footer__secondary {
+  background-color: #1d3359;
+}
+.cmp-footer__main-social {
+  font-size: 14px;
+  letter-spacing: 0.18px;
+  text-transform: uppercase;
+}
+.cmp-footer__main-social .cmp-text {
+  width: 280px;
+  display: inline-block;
+}
+.cmp-footer__social-media {
+  margin-top: 25px;
+}
+.cmp-footer__social-media .cmp-text {
+  width: 100%;
+}
+.cmp-footer__secondary {
+  padding: 40px 0px 15px;
+  font-size: 12px;
+  font-weight: 300;
+  text-align: center;
+}
+.cmp-footer__secondary ul {
+  padding: 0px;
+  margin: 0px;
+}
+.cmp-footer__secondary li {
+  list-style: none;
+  margin-bottom: 25px;
+}
+.cmp-footer__secondary a {
+  color: white;
+}
+.cmp-footer__secondary a:hover {
+  text-decoration: none;
+  cursor: pointer;
+}
+
+@media (min-width: 992px) {
+  .cmp-footer__main {
+    padding: 40px 20px;
+  }
+  .cmp-footer__main .cmp-footer__main-lists-continer.card-columns {
+    -webkit-column-count: 4;
+       -moz-column-count: 4;
+            column-count: 4;
+    margin-bottom: 0px;
+  }
+  .cmp-footer__main .cmp-footer__main-lists-continer.card-columns .cmp-collapse-list {
+    display: inline-block;
+  }
+  .cmp-footer__main .cmp-footer__main-lists-continer.card-columns .cmp-collapse-list .cmp-collapse-list__title {
+    margin-bottom: 20px;
+  }
+  .cmp-footer__main .cmp-footer__main-lists-continer.card-columns .cmp-collapse-list .cmp-collapse-list__content li {
+    margin-bottom: 10px;
+  }
+  .cmp-footer__secondary {
+    padding: 20px 40px 40px;
+    text-align: left;
+  }
+  .cmp-footer__secondary li {
+    margin-bottom: 0;
+    float: left;
+  }
+}
+/**
+ *  Main css for Collapse List
+ */
+.cmp-collapse-list {
+  width: 300px;
+  background-color: #1b3e6f;
+  font-size: 14px;
+  color: white;
+  margin-bottom: 10px;
+  width: 100%;
+}
+.cmp-collapse-list__title {
+  letter-spacing: 0.18px;
+  text-transform: uppercase;
+  font-weight: bold;
+  margin-bottom: 25px;
+}
+.cmp-collapse-list__content {
+  font-weight: 300;
+  line-height: 1.14;
+  overflow: hidden;
+  height: auto;
+  max-height: 1000px;
+}
+.cmp-collapse-list__content ul {
+  padding: 0;
+}
+.cmp-collapse-list__content li {
+  list-style: none;
+  margin-bottom: 20px;
+}
+.cmp-collapse-list__content a {
+  color: white;
+}
+.cmp-collapse-list__content a:hover {
+  text-decoration: none;
+  cursor: pointer;
+}
+.cmp-collapse-list .cmp-collapse-list-button__show-more, .cmp-collapse-list .cmp-collapse-list-button__show-less {
+  display: inline-block;
+  float: right;
+  border: none;
+  background: none;
+}
+.cmp-collapse-list .list-closed {
+  height: 0px;
+  max-height: 0px;
+}
+
+@media (min-width: 992px) {
+  .cmp-collapse-list .list-closed {
+    height: auto;
+    max-height: 1000px;
+  }
+}
+/**
+ *  Main css for Affilliations
+ */
+.cmp-Affilliations .cmp-text {
+  font-size: 14px;
+  font-weight: 300;
+  line-height: 1.71;
+  color: #54565a;
+}
+.cmp-Affilliations .tns-nav {
+  display: block;
+}
+.cmp-Affilliations .cmp-button {
+  margin: 50px auto 0px;
+  padding: 12px 70px;
+}
+.cmp-Affilliations .cmp-affiliations-button {
+  widows: 100%;
+  text-align: center;
+}
+@media (min-width: 992px) {
+  .cmp-Affilliations .cmp-text {
+    width: 575px;
+  }
+  .cmp-Affilliations .cmp-affiliations-button {
+    text-align: right;
+  }
+  .cmp-Affilliations .cmp-button {
+    margin-right: 100px;
+    margin-top: 30px;
+    padding: 12px 30px;
+  }
+}
+
+/**
+ *  Main css for Drupalitemsfacade
+ */
+/**
+ *  Main css for Whoweserve
+ */
+/**
+ *  Main css for Servcard2
+ */
+/**
+ *  Main css for Serve Wedo
+ */
+.cmp-serve-wedo {
+  margin-top: -100px;
+  background: url("/css/carfix2.4b1927a0.jpg") top no-repeat;
+}
+.cmp-serve-wedo .cmp-tricolor__position-inverted {
+  height: 1300px;
+}
+.cmp-serve-wedo .cmp-tricolor__position-inverted .cmp-tricolor_start {
+  display: none;
+}
+.cmp-serve-wedo .cmp-tricolor__position-inverted .cmp-tricolor_middle {
+  background-color: #eeeeee;
+  width: 170%;
+  left: -70%;
+}
+.cmp-serve-wedo .cmp-tricolor__position-inverted .cmp-tricolor_end {
+  right: -90%;
+  width: 90%;
+}
+.cmp-serve-wedo .cmp-whoweserve {
+  padding-top: 100px;
+  position: relative;
+}
+.cmp-serve-wedo .cmp-whoweserve .cmp-cardscontainer .field__items {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  width: 100%;
+}
+.cmp-serve-wedo .cmp-image-separator {
+  padding: 0;
+  height: 230px;
+  overflow: hidden;
+  -webkit-transform: skewY(8deg);
+          transform: skewY(8deg);
+  background-color: #1b3d6e;
+}
+.cmp-serve-wedo .cmp-image-separator .cmp-image {
+  width: 150%;
+  margin-top: -20%;
+  margin-left: -30%;
+  -webkit-transform: skewY(-8deg);
+          transform: skewY(-8deg);
+  opacity: 0.4;
+}
+.cmp-serve-wedo .cmp-what-wedo {
+  position: relative;
+  margin-bottom: 130px;
+}
+.cmp-serve-wedo .cmp-what-wedo .cmp-what-wedo__about-us .cmp-jumbo .cmp-text {
+  font-weight: 300;
+}
+@media (min-width: 992px) {
+  .cmp-serve-wedo {
+    background: url("/css/carfix2.4b1927a0.jpg") bottom no-repeat;
+    height: 2300px;
+  }
+  .cmp-serve-wedo .cmp-tricolor__position-inverted {
+    height: 2300px;
+  }
+  .cmp-serve-wedo .cmp-tricolor__position-inverted .cmp-tricolor_start {
+    left: -70%;
+    display: block;
+  }
+  .cmp-serve-wedo .cmp-tricolor__position-inverted .cmp-tricolor_middle {
+    width: inherit;
+    left: 0;
+  }
+  .cmp-serve-wedo .cmp-tricolor__position-inverted .cmp-tricolor_end {
+    width: 100%;
+    right: -30%;
+  }
+  .cmp-serve-wedo .cmp-what-wedo {
+    position: relative;
+  }
+  .cmp-serve-wedo .cmp-what-wedo .cmp-what-wedo__about-us {
+    width: 530px;
+    float: right;
+    margin: 250px 200px 0px 0px !important;
+  }
+}
+
+/**
+ *  Main css for Whoweserve
+ */
+/**
+ *  Main css for Servcard2
+ */
+/**
+ *  Main css for Demo01172020
+ */
+.field__items > *:not([class*=" col"]):not([class^=col]),
+.cmp-cols.cols-lg-1 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+  position: relative;
+  width: 100%;
+  padding-right: 15px;
+  padding-left: 15px;
+}
+
+/**
+ * Container
+ */
+.layout-container {
+  box-sizing: border-box;
+  max-width: 860px;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+@media all and (min-width: 851px) {
+  .layout-container {
+    max-width: 1290px;
+  }
+}
+/**
+ * Main
+ */
+.layout-main-wrapper {
+  min-height: 300px;
+}
+
+.layout-main {
+  margin-top: 20px;
+  margin-bottom: 40px;
+}
+
+/**
+ * @file
+ * Visual styles for Bartik's main-content component.
+ */
+.main-content .section {
+  padding: 0 15px;
+}
+
+.main-content h2 {
+  margin-bottom: 2px;
+  font-size: 1.429em;
+  line-height: 1.4;
+}
+
+@media all and (min-width: 851px) {
+  .main-content {
+    position: relative;
+    float: left;
+    /* LTR */
+  }
+
+  [dir=rtl] .main-content {
+    float: right;
+  }
+
+  .layout-two-sidebars .main-content {
+    width: 50%;
+    margin-right: 25%;
+    margin-left: 25%;
+  }
+
+  .layout-one-sidebar .main-content {
+    width: 75%;
+  }
+
+  .layout-no-sidebars .main-content {
+    width: 100%;
+  }
+
+  .layout-sidebar-first .main-content {
+    margin-right: 0;
+    /* LTR */
+    margin-left: 25%;
+    /* LTR */
+  }
+
+  [dir=rtl] .layout-sidebar-first .main-content {
+    margin-right: 25%;
+    margin-left: 0;
+  }
+
+  .layout-sidebar-second .main-content {
+    margin-right: 25%;
+    /* LTR */
+    margin-left: 0;
+    /* LTR */
+  }
+
+  [dir=rtl] .layout-sidebar-second .main-content {
+    margin-right: 0;
+    margin-left: 25%;
+  }
+}
+/**
+ * @file
+ * Visual styles for Bartik's field components.
+ */
+.field--type-entity-reference {
+  margin: 0 0 1.2em;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
+.field--type-entity-reference .field__label {
+  margin: 0;
+  padding-right: 5px;
+  /* LTR */
+  font-weight: normal;
+}
+
+[dir=rtl] .field--type-entity-reference .field__label {
+  padding-right: 0;
+  padding-left: 5px;
+}
+
+.field--type-entity-reference .field__label,
+.field--type-entity-reference ul.links {
+  font-size: 0.8em;
+}
+
+.node--view-mode-teaser .field--type-entity-reference .field__label,
+.node--view-mode-teaser .field--type-entity-reference ul.links {
+  font-size: 0.821em;
+}
+
+.field--type-entity-reference ul.links {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+/* This is required to win over specificity of [dir="rtl"] .region-content ul */
+[dir=rtl] .field--type-entity-reference ul.links {
+  padding: 0;
+}
+
+.field--type-entity-reference ul.links li {
+  float: left;
+  /* LTR */
+  padding: 0 1em 0 0;
+  /* LTR */
+  white-space: nowrap;
+}
+
+[dir=rtl] .field--type-entity-reference ul.links li {
+  float: right;
+  padding: 0 0 0 1em;
+}
+
+@media all and (min-width: 560px) {
+  .node .field--type-image {
+    float: left;
+    /* LTR */
+    margin: 0 1em 0 0;
+    /* LTR */
+  }
+
+  [dir=rtl] .node .field--type-image {
+    float: right;
+    margin: 0 0 0 1em;
+  }
+
+  .node .field--type-image + .field--type-image {
+    clear: both;
+  }
+}
+.field--type-image img,
+.field--name-user-picture img {
+  margin: 0 0 1em;
+}
+
+.field--type-image a {
+  border-bottom: none;
+}
+
+.field--name-field-tags {
+  margin: 0 0 1.2em;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+}
+
+.field--name-field-tags .field__label {
+  margin: 0;
+  padding-right: 5px;
+  /* LTR */
+  font-weight: normal;
+}
+
+[dir=rtl] .field--name-field-tags .field__label {
+  padding-right: 0;
+  padding-left: 5px;
+}
+
+.field--name-field-tags .field__label,
+.field--name-field-tags ul.links {
+  font-size: 0.8em;
+}
+
+.node--view-mode-teaser .field--name-field-tags .field__label,
+.node--view-mode-teaser .field--name-field-tags ul.links {
+  font-size: 0.821em;
+}
+
+.field--name-field-tags ul.links {
+  margin: 0;
+  padding: 0;
+}
+
+.field--name-field-tags ul.links li {
+  float: left;
+  /* LTR */
+  padding: 0 1em 0 0;
+  /* LTR */
+  white-space: nowrap;
+}
+
+[dir=rtl] .field--name-field-tags ul.links li {
+  float: right;
+  padding: 0 0 0 1em;
+}
+
+/**
+ * @file
+ * Visual styles for Bartik's blocks.
+ */
+/* Block has its own content wrapper. */
+.block .content {
+  margin-top: 10px;
+}
+
+/*
+ * @file
+ * Provides the layout styles for layout_onecol.
+ */
+.layout--onecol .layout__region {
+  width: 100%;
+}
+
+blockquote {
+  margin: 1.5em 10px;
+  padding: 0.5em 10px;
+  border-left: 1px solid #bbb;
+  background: #f7f7f7;
+  font-style: italic;
+}
+
+blockquote:before {
+  margin-right: 0.2em;
+  content: "“";
+  vertical-align: -0.4em;
+  color: #bbb;
+  font-size: 3em;
+  line-height: 0.1em;
+}
+
+blockquote .small:before,
+blockquote footer:before,
+blockquote small:before {
+  content: "— ";
+}
+
+@media (min-width: 768px) {
+  .cmp-cols.cols-md-2 .field__items > *:not([class*=" col"]):not([class^=col]),
+.cmp-cols.cols-md-2 > *:not([class*=" col"]):not([class^=col]):not(.field__items) {
+    -webkit-box-flex: 0;
+    flex: 0 0 50%;
+    max-width: 50%;
+  }
+}
+#page .cmp-servicescards__cardcontainer .field__items {
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  -webkit-box-pack: justify;
+          justify-content: space-between;
+}
+@media (min-width: 992px) {
+  #page .cmp-servicescards__cardcontainer .field__items > .field__item {
+    -webkit-box-flex: 0;
+            flex: 0 0 28%;
+  }
+}
+#page .cmp-servicescards__cardcontainer .field__items > .field__item .field.field--name-image.field--type-image.field--label-hidden.field__item {
+  margin: 0;
+}
+@media (max-width: 999px) {
+  #page .cmp-servicescards__cardcontainer .field__items > .field__item .cmp-servcard {
+    width: 100%;
+  }
+}
+@media (min-width: 992px) {
+  #page .cmp-servicescards__cardcontainer .cmp-servcard,
+#page .cmp-servicescards__cardcontainer .last-card {
+    min-width: 100%;
+  }
+}
+#page .cmp-brandingcard .clearfix.text-formatted.field.field--name-field-brand-body.field--type-text-long.field--label-hidden.field__item p {
+  opacity: 0.6;
+  font-size: 0.875rem;
+}
+@media (max-width: 999px) {
+  #page .cmp-brandingcard .field--name-image .cmp-image {
+    width: 50%;
+  }
+}
+#page .cmp-testimonial blockquote {
+  margin: 0 0 1rem;
+  padding: 0;
+  border-left: none;
+  background: white;
+  font-style: normal;
+}
+#page .cmp-testimonial blockquote:before {
+  content: none;
+}
+#page .cmp-shadow-box-quote {
+  align-self: center;
+}
+#page .cmp-image {
+  max-width: 100%;
+}
+@media (min-width: 992px) {
+  #page .cmp-latest .container {
+    max-width: 1200px;
+    padding: 0;
+  }
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer {
+  width: 100%;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-latestcard {
+  width: 100%;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-latestcard:hover {
+  box-shadow: none;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-latestcard:hover .cmp-imageblue .cmp-image {
+  opacity: 0.5;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-latestcard:hover .cmp-cardlink {
+  text-decoration: none;
+  cursor: pointer;
+  border-bottom: none;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .row, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols .field__items, .cmp-cols #page .cmp-latest .cmp-latestcards__cardcontainer .field__items {
+  display: grid;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items), #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]), #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items), #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items), #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items), .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items), #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]), #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items), .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items), #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]), #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]), .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) {
+  width: 100%;
+  max-width: 100%;
+  padding: 0;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard-content .field.field--name-field-posts-blog-post.field--type-entity-reference.field--label-hidden.field__item {
+  -webkit-box-flex: 0;
+          flex: 0 0 100%;
+  max-width: 100%;
+  display: -webkit-box;
+  display: flex;
+  flex-wrap: wrap;
+  margin: 0;
+}
+@media (min-width: 992px) {
+  #page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item {
+    display: -webkit-inline-box;
+    display: inline-flex;
+    -webkit-box-flex: 0;
+            flex: 0 0 45%;
+    max-width: 45%;
+    margin: 0 1.5rem;
+    padding: 0;
+  }
+  #page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item .heading-title .field.field--name-field-posts-headline.field--type-string.field--label-hidden.field__item {
+    min-width: 140px;
+  }
+  #page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item button.heading-link:hover, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item button.heading-link:hover, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item button.heading-link:hover, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item button.heading-link:hover, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item button.heading-link:hover, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item button.heading-link:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item button.heading-link:hover, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item button.heading-link:hover {
+    border: none;
+  }
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover {
+  box-shadow: 20px 19px 61px -25px rgba(0, 0, 0, 0.27);
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-imageblue .cmp-image {
+  opacity: 1;
+  -webkit-transition: 0.3;
+  transition: 0.3;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-cardlink, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-cardlink, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-cardlink, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-cardlink, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-cardlink, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-cardlink, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-cardlink, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .field__item:hover .cmp-cardlink {
+  border-bottom: 2px solid #f16824;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-imageblue.bg-primary .field.field--name-field-blog-desktop-image.field--type-entity-reference.field--label-hidden.field__item .field.field--name-image.field--type-image.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-latestcard__content .field.field--name-field-blog-headline.field--type-string.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+.cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+#page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item,
+.cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item {
+  -webkit-box-flex: 0;
+          flex: 0 0 100%;
+  max-width: 100%;
+  margin: 0;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-text .clearfix.text-formatted.field.field--name-field-blog-abstract.field--type-text-long.field--label-hidden.field__item:hover {
+  box-shadow: none;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .col-xs-12.col-sm-12.col-md-6.col-lg-6 .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-lg-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2.field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12.col-md-6:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items.cmp-cols.cols-md-2 > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]):not(.field__items) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, .cmp-cols.cols-md-2 .cmp-cols.cols-lg-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, #page .cmp-latest .cmp-latestcards__cardcontainer .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover, .cmp-cols.cols-lg-2 .cmp-cols.cols-md-2 #page .cmp-latest .cmp-latestcards__cardcontainer .field__items > .col-xs-12.col-sm-12:not([class*=" col"]):not([class^=col]) .cmp-latestcard .cmp-cardlink .field.field--name-field-blog-cta.field--type-link.field--label-hidden.field__item a:hover {
+  text-decoration: none;
+  color: #1b3d6e;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .more-new.d-none.d-md-block {
+  width: 100%;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .more-news a {
+  color: white;
+}
+#page .cmp-latest .cmp-latestcards__cardcontainer .more-news a:hover {
+  text-decoration: none;
+}
+
+/*# sourceMappingURL=/css/global.css.map */
\ No newline at end of file
diff --git a/css/global.css.map b/css/global.css.map
new file mode 100644
index 0000000..0eed8f1
--- /dev/null
+++ b/css/global.css.map
@@ -0,0 +1 @@
+{"version":3,"sources":["../../node_modules/bootstrap/scss/_root.scss","../../node_modules/bootstrap/scss/_reboot.scss","_variables.scss","../../node_modules/bootstrap/scss/vendor/_rfs.scss","../../node_modules/bootstrap/scss/mixins/_hover.scss","../../node_modules/bootstrap/scss/_type.scss","../../node_modules/bootstrap/scss/mixins/_lists.scss","../../node_modules/bootstrap/scss/_images.scss","../../node_modules/bootstrap/scss/mixins/_image.scss","../../node_modules/bootstrap/scss/_code.scss","../../node_modules/bootstrap/scss/_grid.scss","../../node_modules/bootstrap/scss/mixins/_grid.scss","../../node_modules/bootstrap/scss/mixins/_breakpoints.scss","../../node_modules/bootstrap/scss/mixins/_grid-framework.scss","../../node_modules/bootstrap/scss/_tables.scss","../../node_modules/bootstrap/scss/mixins/_table-row.scss","../../node_modules/bootstrap/scss/_forms.scss","../../node_modules/bootstrap/scss/mixins/_border-radius.scss","../../node_modules/bootstrap/scss/mixins/_transition.scss","../../node_modules/bootstrap/scss/mixins/_forms.scss","../../node_modules/bootstrap/scss/mixins/_gradients.scss","../../node_modules/bootstrap/scss/_buttons.scss","../../node_modules/bootstrap/scss/mixins/_buttons.scss","../../node_modules/bootstrap/scss/_transitions.scss","../../node_modules/bootstrap/scss/_dropdown.scss","../../node_modules/bootstrap/scss/mixins/_caret.scss","../../node_modules/bootstrap/scss/mixins/_nav-divider.scss","../../node_modules/bootstrap/scss/_button-group.scss","../../node_modules/bootstrap/scss/_input-group.scss","../../node_modules/bootstrap/scss/_custom-forms.scss","../../node_modules/bootstrap/scss/_nav.scss","../../node_modules/bootstrap/scss/_navbar.scss","../../node_modules/bootstrap/scss/_card.scss","../../node_modules/bootstrap/scss/_breadcrumb.scss","../../node_modules/bootstrap/scss/_pagination.scss","../../node_modules/bootstrap/scss/mixins/_pagination.scss","../../node_modules/bootstrap/scss/_badge.scss","../../node_modules/bootstrap/scss/mixins/_badge.scss","../../node_modules/bootstrap/scss/_jumbotron.scss","../../node_modules/bootstrap/scss/_alert.scss","../../node_modules/bootstrap/scss/mixins/_alert.scss","../../node_modules/bootstrap/scss/_progress.scss","../../node_modules/bootstrap/scss/_media.scss","../../node_modules/bootstrap/scss/_list-group.scss","../../node_modules/bootstrap/scss/mixins/_list-group.scss","../../node_modules/bootstrap/scss/_close.scss","../../node_modules/bootstrap/scss/_toasts.scss","../../node_modules/bootstrap/scss/_modal.scss","../../node_modules/bootstrap/scss/_tooltip.scss","../../node_modules/bootstrap/scss/mixins/_reset-text.scss","../../node_modules/bootstrap/scss/_popover.scss","../../node_modules/bootstrap/scss/_carousel.scss","../../node_modules/bootstrap/scss/mixins/_clearfix.scss","../../node_modules/bootstrap/scss/_spinners.scss","../../node_modules/bootstrap/scss/utilities/_align.scss","../../node_modules/bootstrap/scss/mixins/_background-variant.scss","../../node_modules/bootstrap/scss/utilities/_background.scss","../../node_modules/bootstrap/scss/utilities/_borders.scss","../../node_modules/bootstrap/scss/utilities/_display.scss","../../node_modules/bootstrap/scss/utilities/_embed.scss","../../node_modules/bootstrap/scss/utilities/_flex.scss","../../node_modules/bootstrap/scss/utilities/_float.scss","../../node_modules/bootstrap/scss/utilities/_overflow.scss","../../node_modules/bootstrap/scss/utilities/_position.scss","../../node_modules/bootstrap/scss/utilities/_screenreaders.scss","../../node_modules/bootstrap/scss/mixins/_screen-reader.scss","../../node_modules/bootstrap/scss/utilities/_shadows.scss","../../node_modules/bootstrap/scss/utilities/_sizing.scss","../../node_modules/bootstrap/scss/utilities/_stretched-link.scss","../../node_modules/bootstrap/scss/utilities/_spacing.scss","../../node_modules/bootstrap/scss/utilities/_text.scss","../../node_modules/bootstrap/scss/mixins/_text-truncate.scss","../../node_modules/bootstrap/scss/mixins/_text-emphasis.scss","../../node_modules/bootstrap/scss/mixins/_text-hide.scss","../../node_modules/bootstrap/scss/utilities/_visibility.scss","../../node_modules/bootstrap/scss/_print.scss","_customVariables.scss","_spacing.scss","_fonts.scss","../../components/groups/header/header.scss","../../components/01-units/button/button.scss","../../components/blocks/jumbo/jumbo.scss","../../components/01-units/skew/skew.scss","../../components/01-units/threelines/threelines.scss","../../components/01-units/heading/heading.scss","../../components/01-units/simpletext/simpletext.scss","../../components/02-layout/cols/cols.scss","../../components/blocks/brandingcard/brandingcard.scss","../../components/01-units/image/image.scss","../../components/01-units/unitmacros/unitmacros.scss","../../components/groups/branding/branding.scss","../../components/groups/hero/hero.scss","../../components/01-units/tricolor/tricolor.scss","../../components/01-units/slider/slider.scss","../../components/pages/homePage/homePage.scss","../../components/blocks/shadow-box/shadow-box.scss","../../components/01-units/quote/quote.scss","../../components/groups/testimonial/testimonial.scss","../../components/groups/servicescards/servicescards.scss","../../components/blocks/servcard/servcard.scss","../../components/blocks/imageblue/imageblue.scss","../../components/01-units/cardlink/cardlink.scss","../../components/01-units/companies/companies.scss","../../components/groups/latest/latest.scss","../../components/blocks/latestCard/latestCard.scss","../../components/01-units/latestHeading/latestHeading.scss","../../components/groups/whatwedo/whatwedo.scss","../../components/01-units/video/video.scss","../../node_modules/plyr/src/sass/lib/animation.scss","../../node_modules/plyr/src/sass/base.scss","../../node_modules/plyr/src/sass/lib/mixins.scss","../../node_modules/plyr/src/sass/settings/type.scss","../../node_modules/plyr/src/sass/components/badges.scss","../../node_modules/plyr/src/sass/settings/colors.scss","../../node_modules/plyr/src/sass/settings/badges.scss","../../node_modules/plyr/src/sass/components/captions.scss","../../node_modules/plyr/src/sass/settings/captions.scss","../../node_modules/plyr/src/sass/settings/controls.scss","../../node_modules/plyr/src/sass/components/control.scss","../../node_modules/plyr/src/sass/components/controls.scss","../../node_modules/plyr/src/sass/components/menus.scss","../../node_modules/plyr/src/sass/settings/menus.scss","../../node_modules/plyr/src/sass/components/sliders.scss","../../node_modules/plyr/src/sass/settings/sliders.scss","../../node_modules/plyr/src/sass/settings/progress.scss","../../node_modules/plyr/src/sass/components/poster.scss","../../node_modules/plyr/src/sass/components/times.scss","../../node_modules/plyr/src/sass/components/tooltips.scss","../../node_modules/plyr/src/sass/settings/tooltips.scss","../../node_modules/plyr/src/sass/components/video.scss","../../node_modules/plyr/src/sass/components/progress.scss","../../node_modules/plyr/src/sass/components/volume.scss","../../node_modules/plyr/src/sass/states/fullscreen.scss","../../node_modules/plyr/src/sass/plugins/ads.scss","../../node_modules/plyr/src/sass/plugins/preview-thumbnails.scss","../../node_modules/plyr/src/sass/utils/animation.scss","../../node_modules/plyr/src/sass/utils/hidden.scss","../../components/groups/footer/footer.scss","../../components/blocks/collapse-list/collapse-list.scss","../../components/groups/Affilliations/Affilliations.scss","../../components/01-units/drupalitemsfacade/drupalitemsfacade.scss","../../components/groups/whoweserve/whoweserve.scss","../../components/01-units/servcard2/servcard2.scss","../../components/groups/serve-wedo/serve-wedo.scss","../../components/pages/demo01172020/demo01172020.scss"],"names":[],"mappings":"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Q9B;EFyFM,iBAtCa;EEjDjB,gBHuR4B;EGtR5B,gBH4Q4B;;;AG1Q9B;EFoFM,iBAtCa;EE5CjB,gBHmR4B;EGlR5B,gBHuQ4B;;;AG/P9B;EACE,gBHkFO;EGjFP,mBHiFO;EGhFP,SAAA;EACA,wCAAA;;;AAQF;;EFMI,cAAA;EEHF,gBH+N4B;;;AG5N9B;;EAEE,cHuQ4B;EGtQ5B,yBH+Q4B;;;AGvQ9B;EC/EE,eAAA;EACA,gBAAA;;;ADmFF;ECpFE,eAAA;EACA,gBAAA;;;ADsFF;EACE,qBAAA;;AAEA;EACE,oBHyP0B;;;AG/O9B;EFjCI,cAAA;EEmCF,yBAAA;;;AAIF;EACE,mBHyBO;ECVH,kBAtCa;;;AE2BnB;EACE,cAAA;EF7CE,cAAA;EE+CF,cH1GS;;AG4GT;EACE,aAAA;;;AEnHJ;ECIE,eAAA;EAGA,YAAA;;;ADDF;EACE,gBLkgCkC;EKjgClC,sBLRS;EKST,yBAAA;ECLA,eAAA;EAGA,YAAA;;;ADcF;EAEE,qBAAA;;;AAGF;EACE,qBAAA;EACA,cAAA;;;AAGF;EJkCI,cAAA;EIhCF,cL3BS;;;AOZX;ENuEI,gBAAA;EMrEF,cPqCQ;EOpCR,qBAAA;;AAGA;EACE,cAAA;;;AAKJ;EACE,sBAAA;EN0DE,gBAAA;EMxDF,WPTS;EOUT,yBAAA;;AAIA;EACE,UAAA;ENkDA,eAAA;EMhDA,gBP6Q0B;;;AOvQ9B;EACE,cAAA;ENyCE,gBAAA;EMvCF,cPhBS;;AOmBT;ENoCE,kBAAA;EMlCA,cAAA;EACA,kBAAA;;;AAKJ;EACE,iBP6jCkC;EO5jClC,kBAAA;;;ACxCA;ECDA,WAAA;EACA,mBAAA;EACA,kBAAA;EACA,kBAAA;EACA,iBAAA;;ACmDE;EFtDF;ICWI,gBTqMiB;;;AU1JnB;EFtDF;ICWI,gBTqMiB;;;AU1JnB;EFtDF;ICWI,gBTqMiB;;;AU1JnB;EFtDF;ICWI,iBTqMiB;;;;AQ1MrB;ECPA,WAAA;EACA,mBAAA;EACA,kBAAA;EACA,kBAAA;EACA,iBAAA;;;ACmDE;EFrCE;IACE,gBR8Le;;;AU1JnB;EFrCE;IACE,gBR8Le;;;AU1JnB;EFrCE;IACE,gBR8Le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;;AoBWX;EAKI,gDAAA;;;AD7BN;ECHA,cpBgBa;EoBfb,qBpBea;;AEpEb;EkBwDE,cALgD;EAMhD,yBpBWW;EoBVX,qBpBUW;;AoBPb;EAEE,+CAAA;;AAGF;EAEE,cAAA;EACA,6BAAA;;AAGF;EAGE,cAAA;EACA,yBpBRW;EoBSX,qBpBTW;;AoBWX;EAKI,+CAAA;;;AD7BN;ECHA,cpBgBa;EoBfb,qBpBea;;AEpEb;EkBwDE,WALgD;EAMhD,yBpBWW;EoBVX,qBpBUW;;AoBPb;EAEE,+CAAA;;AAGF;EAEE,cAAA;EACA,6BAAA;;AAGF;EAGE,WAAA;EACA,yBpBRW;EoBSX,qBpBTW;;AoBWX;EAKI,+CAAA;;;AD7BN;ECHA,cpBgBa;EoBfb,qBpBea;;AEpEb;EkBwDE,cALgD;EAMhD,yBpBWW;EoBVX,qBpBUW;;AoBPb;EAEE,iDAAA;;AAGF;EAEE,cAAA;EACA,6BAAA;;AAGF;EAGE,cAAA;EACA,yBpBRW;EoBSX,qBpBTW;;AoBWX;EAKI,iDAAA;;;AD7BN;ECHA,cpBgBa;EoBfb,qBpBea;;AEpEb;EkBwDE,WALgD;EAMhD,yBpBWW;EoBVX,qBpBUW;;AoBPb;EAEE,8CAAA;;AAGF;EAEE,cAAA;EACA,6BAAA;;AAGF;EAGE,WAAA;EACA,yBpBRW;EoBSX,qBpBTW;;AoBWX;EAKI,8CAAA;;;ADlBR;EACE,gBnBqN4B;EmBpN5B,cnBmGwC;EmBlGxC,qBnBmGwC;;AExKxC;EiBwEE,cnBiGsC;EmBhGtC,0BnBiGsC;;AmB9FxC;EAEE,0BnB4FsC;EmB3FtC,gBAAA;;AAGF;EAEE,cnBnFO;EmBoFP,oBAAA;;;AAWJ;ECJE,oBAAA;EnBuBI,kBAtCa;EmBiBjB,gBpBmI4B;EerO1B,gBKoGqC;;;ADIzC;ECRE,uBAAA;EnBuBI,mBAtCa;EmBiBjB,gBpBoI4B;EetO1B,gBKoGqC;;;ADazC;EACE,cAAA;EACA,WAAA;;AAGA;EACE,kBnB8T0B;;;AmBtT5B;;;EACE,WAAA;;;AExIJ;ELMM,wCKLJ;ELKI,gCKLJ;;ALUE;EKXJ;ILYM,wBAAA;IAAA,gBAAA;;;AKTJ;EACE,UAAA;;;AAKF;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3BgMyC;EkBvmBzC,yBlBwP0B;E2BiL1B,S3BiMyC;EgB1mBvC,oHW4aF;EX5aE,4GW4aF;EACA,qBAAA;OAAA,gBAAA;;AXxaA;EWgaF;IX/ZI,wBAAA;IAAA,gBAAA;;;AWyaF;ET/aA,yBlB+mByC;;A2B3L3C;EACE,W3B2KgC;E2B1KhC,c3B2KgC;E2B1KhC,kBAAA;EACA,e3B0KgC;E2BzKhC,yB3BrbO;E2BsbP,yBAAA;;AAKF;EACE,W3BuKyC;E2BtKzC,Y3BsKyC;E2BrKzC,aAAA;EACA,oB3B7D0B;E2B8D1B,mB3B9D0B;EkBtY1B,yBlBwP0B;E2B8M1B,S3BoKyC;EgB1mBvC,oHWycF;EXzcE,4GWycF;EACA,gBAAA;;AXrcA;EW0bF;IXzbI,wBAAA;IAAA,gBAAA;;;AWscF;ET5cA,yBlB+mByC;;A2B9J3C;EACE,W3B8IgC;E2B7IhC,c3B8IgC;E2B7IhC,kBAAA;EACA,e3B6IgC;E2B5IhC,6BAAA;EACA,yBAAA;EACA,oBAAA;;AAIF;EACE,yB3BzdO;;A2B6dT;EACE,kBAAA;EACA,yB3B/dO;;A2BoeP;EACE,yB3BneK;;A2BseP;EACE,eAAA;;AAGF;EACE,yB3B3eK;;A2B8eP;EACE,eAAA;;AAGF;EACE,yB3BnfK;;;A2BwfX;;;EX9fM,oHWigBJ;EXjgBI,4GWigBJ;;AX5fE;EWyfJ;;;IXxfM,wBAAA;IAAA,gBAAA;;;;AYPN;EACE,oBAAA;EAAA,aAAA;EACA,eAAA;EACA,eAAA;EACA,gBAAA;EACA,gBAAA;;;AAGF;EACE,cAAA;EACA,oBAAA;;A1BCA;E0BEE,qBAAA;;AAIF;EACE,c5BVO;E4BWP,oBAAA;EACA,eAAA;;;AAQJ;EACE,gCAAA;;AAEA;EACE,mBAAA;;AAGF;EACE,6BAAA;;A1BzBF;E0B6BI,qC5BspB8B;;A4BnpBhC;EACE,c5BpCK;E4BqCL,6BAAA;EACA,yBAAA;;AAIJ;;EAEE,c5B1CO;E4B2CP,sB5BnDO;E4BoDP,kC5B2oBgC;;A4BxoBlC;EAEE,gBAAA;;;AAgBF;;EAEE,W5B3EO;E4B4EP,yB5B2K0B;;;A4BjK5B;EACE,mBAAA;UAAA,cA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IACA,sBzC2HkB;;;AyC5G5B;EACE,qBAAA;EACA,oBAAA;;AAGA;EACE,mBAAA;;AAKF;EACE,sBAAA;;;AC7IJ;EACE,cDwJsE;ECvJtE,yBDuJuC;;AvC5IzC;EwCPM,cDmJkE;EClJlE,yBAAA;;AAGF;EACE,W1CPG;E0CQH,yBD6IkE;EC5IlE,qBD4IkE;;;ACzJxE;EACE,cDwJsE;ECvJtE,yBDuJuC;;AvC5IzC;EwCPM,cDmJkE;EClJlE,yBAAA;;AAGF;EACE,W1CPG;E0CQH,yBD6IkE;EC5IlE,qBD4IkE;;;ACzJxE;EACE,cDwJsE;ECvJtE,yBDuJuC;;AvC5IzC;EwCPM,cDmJkE;EClJlE,yBAAA;;AAGF;EACE,W1CPG;E0CQH,yBD6IkE;EC5IlE,qBD4IkE;;;ACzJxE;EACE,cDwJsE;ECvJtE,yBDuJuC;;AvC5IzC;EwCPM,cDmJkE;EClJlE,yBAAA;;AAGF;EACE,W1CPG;E0CQH,yBD6IkE;EC5IlE,qBD4IkE;;;ACzJxE;EACE,cDwJsE;ECvJtE,yBDuJuC;;AvC5IzC;EwCPM,cDmJkE;EClJlE,yBAAA;;AAGF;EACE,W1CPG;E0CQH,yBD6IkE;EC5IlE,qBD4IkE;;;ACzJxE;EACE,cDwJsE;ECvJtE,yBDuJuC;;AvC5IzC;EwCPM,cDmJkE;EClJlE,yBAAA;;AAGF;EACE,W1CPG;E0CQH,yBD6IkE;EC5IlE,qBD4IkE;;;ACzJxE;EACE,cDwJsE;ECvJtE,yBDuJuC;;AvC5IzC;EwCPM,cDmJkE;EClJlE,yBAAA;;AAGF;EACE,W1CPG;E0CQH,yBD6IkE;EC5IlE,qBD4IkE;;;ACzJxE;EACE,cDwJsE;ECvJtE,yBDuJuC;;AvC5IzC;EwCPM,cDmJkE;EClJlE,yBAAA;;AAGF;EACE,W1CPG;E0CQH,yBD6IkE;EC5IlE,qBD4IkE;;;AE5J1E;EACE,YAAA;E1C8HI,iBAtCa;E0CtFjB,gB3CkS4B;E2CjS5B,cAAA;EACA,W3CaS;E2CZT,yB3CqlCkC;E2CplClC,YAAA;;AzCKA;EyCDE,W3COO;E2CNP,qBAAA;;AzCIF;EyCCI,aAAA;;;AAWN;EACE,UAAA;EACA,6BAAA;EACA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","file":"global.css","sourceRoot":"../../assets/scss","sourcesContent":["// Do not forget to update getting-started/theming.md!\n:root {\n  // Custom variable values only support SassScript inside `#{}`.\n  @each $color, $value in $colors {\n    --#{$color}: #{$value};\n  }\n\n  @each $color, $value in $theme-colors {\n    --#{$color}: #{$value};\n  }\n\n  @each $bp, $value in $grid-breakpoints {\n    --breakpoint-#{$bp}: #{$value};\n  }\n\n  // Use `inspect` for lists so that quoted items keep the quotes.\n  // See https://github.com/sass/sass/issues/2383#issuecomment-336349172\n  --font-family-sans-serif: #{inspect($font-family-sans-serif)};\n  --font-family-monospace: #{inspect($font-family-monospace)};\n}\n","// stylelint-disable at-rule-no-vendor-prefix, declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix\n\n// Reboot\n//\n// Normalization of HTML elements, manually forked from Normalize.css to remove\n// styles targeting irrelevant browsers while applying new styles.\n//\n// Normalize is licensed MIT. https://github.com/necolas/normalize.css\n\n\n// Document\n//\n// 1. Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.\n// 2. Change the default font family in all browsers.\n// 3. Correct the line height in all browsers.\n// 4. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS.\n// 5. Change the default tap highlight to be completely transparent in iOS.\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box; // 1\n}\n\nhtml {\n  font-family: sans-serif; // 2\n  line-height: 1.15; // 3\n  -webkit-text-size-adjust: 100%; // 4\n  -webkit-tap-highlight-color: rgba($black, 0); // 5\n}\n\n// Shim for \"new\" HTML5 structural elements to display correctly (IE10, older browsers)\n// TODO: remove in v5\n// stylelint-disable-next-line selector-list-comma-newline-after\narticle, aside, figcaption, figure, footer, header, hgroup, main, nav, section {\n  display: block;\n}\n\n// Body\n//\n// 1. Remove the margin in all browsers.\n// 2. As a best practice, apply a default `background-color`.\n// 3. Set an explicit initial text-align value so that we can later use\n//    the `inherit` value on things like `` elements.\n\nbody {\n  margin: 0; // 1\n  font-family: $font-family-base;\n  @include font-size($font-size-base);\n  font-weight: $font-weight-base;\n  line-height: $line-height-base;\n  color: $body-color;\n  text-align: left; // 3\n  background-color: $body-bg; // 2\n}\n\n// Future-proof rule: in browsers that support :focus-visible, suppress the focus outline\n// on elements that programmatically receive focus but wouldn't normally show a visible\n// focus outline. In general, this would mean that the outline is only applied if the\n// interaction that led to the element receiving programmatic focus was a keyboard interaction,\n// or the browser has somehow determined that the user is primarily a keyboard user and/or\n// wants focus outlines to always be presented.\n//\n// See https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible\n// and https://developer.paciellogroup.com/blog/2018/03/focus-visible-and-backwards-compatibility/\n[tabindex=\"-1\"]:focus:not(:focus-visible) {\n  outline: 0 !important;\n}\n\n\n// Content grouping\n//\n// 1. Add the correct box sizing in Firefox.\n// 2. Show the overflow in Edge and IE.\n\nhr {\n  box-sizing: content-box; // 1\n  height: 0; // 1\n  overflow: visible; // 2\n}\n\n\n//\n// Typography\n//\n\n// Remove top margins from headings\n//\n// By default, `
`-`
` all receive top and bottom margins. We nuke the top\n// margin for easier control within type scales as it avoids margin collapsing.\n// stylelint-disable-next-line selector-list-comma-newline-after\nh1, h2, h3, h4, h5, h6 {\n  margin-top: 0;\n  margin-bottom: $headings-margin-bottom;\n}\n\n// Reset margins on paragraphs\n//\n// Similarly, the top margin on `
`s get reset. However, we also reset the\n// bottom margin to use `rem` units instead of `em`.\np {\n  margin-top: 0;\n  margin-bottom: $paragraph-margin-bottom;\n}\n\n// Abbreviations\n//\n// 1. Duplicate behavior to the data-* attribute for our tooltip plugin\n// 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n// 3. Add explicit cursor to indicate changed behavior.\n// 4. Remove the bottom border in Firefox 39-.\n// 5. Prevent the text-decoration to be skipped.\n\nabbr[title],\nabbr[data-original-title] { // 1\n  text-decoration: underline; // 2\n  text-decoration: underline dotted; // 2\n  cursor: help; // 3\n  border-bottom: 0; // 4\n  text-decoration-skip-ink: none; // 5\n}\n\naddress {\n  margin-bottom: 1rem;\n  font-style: normal;\n  line-height: inherit;\n}\n\nol,\nul,\ndl {\n  margin-top: 0;\n  margin-bottom: 1rem;\n}\n\nol ol,\nul ul,\nol ul,\nul ol {\n  margin-bottom: 0;\n}\n\ndt {\n  font-weight: $dt-font-weight;\n}\n\ndd {\n  margin-bottom: .5rem;\n  margin-left: 0; // Undo browser default\n}\n\nblockquote {\n  margin: 0 0 1rem;\n}\n\nb,\nstrong {\n  font-weight: $font-weight-bolder; // Add the correct font weight in Chrome, Edge, and Safari\n}\n\nsmall {\n  @include font-size(80%); // Add the correct font size in all browsers\n}\n\n//\n// Prevent `sub` and `sup` elements from affecting the line height in\n// all browsers.\n//\n\nsub,\nsup {\n  position: relative;\n  @include font-size(75%);\n  line-height: 0;\n  vertical-align: baseline;\n}\n\nsub { bottom: -.25em; }\nsup { top: -.5em; }\n\n\n//\n// Links\n//\n\na {\n  color: $link-color;\n  text-decoration: $link-decoration;\n  background-color: transparent; // Remove the gray background on active links in IE 10.\n\n  @include hover() {\n    color: $link-hover-color;\n    text-decoration: $link-hover-decoration;\n  }\n}\n\n// And undo these styles for placeholder links/named anchors (without href).\n// It would be more straightforward to just use a[href] in previous block, but that\n// causes specificity issues in many other styles that are too complex to fix.\n// See https://github.com/twbs/bootstrap/issues/19402\n\na:not([href]) {\n  color: inherit;\n  text-decoration: none;\n\n  @include hover() {\n    color: inherit;\n    text-decoration: none;\n  }\n}\n\n\n//\n// Code\n//\n\npre,\ncode,\nkbd,\nsamp {\n  font-family: $font-family-monospace;\n  @include font-size(1em); // Correct the odd `em` font sizing in all browsers.\n}\n\npre {\n  // Remove browser default top margin\n  margin-top: 0;\n  // Reset browser default of `1em` to use `rem`s\n  margin-bottom: 1rem;\n  // Don't allow content to break outside\n  overflow: auto;\n}\n\n\n//\n// Figures\n//\n\nfigure {\n  // Apply a consistent margin strategy (matches our type styles).\n  margin: 0 0 1rem;\n}\n\n\n//\n// Images and content\n//\n\nimg {\n  vertical-align: middle;\n  border-style: none; // Remove the border on images inside links in IE 10-.\n}\n\nsvg {\n  // Workaround for the SVG overflow bug in IE10/11 is still required.\n  // See https://github.com/twbs/bootstrap/issues/26878\n  overflow: hidden;\n  vertical-align: middle;\n}\n\n\n//\n// Tables\n//\n\ntable {\n  border-collapse: collapse; // Prevent double borders\n}\n\ncaption {\n  padding-top: $table-cell-padding;\n  padding-bottom: $table-cell-padding;\n  color: $table-caption-color;\n  text-align: left;\n  caption-side: bottom;\n}\n\nth {\n  // Matches default `` alignment by inheriting from the ``, or the\n  // closest parent with a set `text-align`.\n  text-align: inherit;\n}\n\n\n//\n// Forms\n//\n\nlabel {\n  // Allow labels to use `margin` for spacing.\n  display: inline-block;\n  margin-bottom: $label-margin-bottom;\n}\n\n// Remove the default `border-radius` that macOS Chrome adds.\n//\n// Details at https://github.com/twbs/bootstrap/issues/24093\nbutton {\n  // stylelint-disable-next-line property-blacklist\n  border-radius: 0;\n}\n\n// Work around a Firefox/IE bug where the transparent `button` background\n// results in a loss of the default `button` focus styles.\n//\n// Credit: https://github.com/suitcss/base/\nbutton:focus {\n  outline: 1px dotted;\n  outline: 5px auto -webkit-focus-ring-color;\n}\n\ninput,\nbutton,\nselect,\noptgroup,\ntextarea {\n  margin: 0; // Remove the margin in Firefox and Safari\n  font-family: inherit;\n  @include font-size(inherit);\n  line-height: inherit;\n}\n\nbutton,\ninput {\n  overflow: visible; // Show the overflow in Edge\n}\n\nbutton,\nselect {\n  text-transform: none; // Remove the inheritance of text transform in Firefox\n}\n\n// Remove the inheritance of word-wrap in Safari.\n//\n// Details at https://github.com/twbs/bootstrap/issues/24990\nselect {\n  word-wrap: normal;\n}\n\n\n// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`\n//    controls in Android 4.\n// 2. Correct the inability to style clickable types in iOS and Safari.\nbutton,\n[type=\"button\"], // 1\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button; // 2\n}\n\n// Opinionated: add \"hand\" cursor to non-disabled button elements.\n@if $enable-pointer-cursor-for-buttons {\n  button,\n  [type=\"button\"],\n  [type=\"reset\"],\n  [type=\"submit\"] {\n    &:not(:disabled) {\n      cursor: pointer;\n    }\n  }\n}\n\n// Remove inner border and padding from Firefox, but don't restore the outline like Normalize.\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  padding: 0;\n  border-style: none;\n}\n\ninput[type=\"radio\"],\ninput[type=\"checkbox\"] {\n  box-sizing: border-box; // 1. Add the correct box sizing in IE 10-\n  padding: 0; // 2. Remove the padding in IE 10-\n}\n\n\ninput[type=\"date\"],\ninput[type=\"time\"],\ninput[type=\"datetime-local\"],\ninput[type=\"month\"] {\n  // Remove the default appearance of temporal inputs to avoid a Mobile Safari\n  // bug where setting a custom line-height prevents text from being vertically\n  // centered within the input.\n  // See https://bugs.webkit.org/show_bug.cgi?id=139848\n  // and https://github.com/twbs/bootstrap/issues/11266\n  -webkit-appearance: listbox;\n}\n\ntextarea {\n  overflow: auto; // Remove the default vertical scrollbar in IE.\n  // Textareas should really only resize vertically so they don't break their (horizontal) containers.\n  resize: vertical;\n}\n\nfieldset {\n  // Browsers set a default `min-width: min-content;` on fieldsets,\n  // unlike e.g. `
`s, which have `min-width: 0;` by default.\n  // So we reset that to ensure fieldsets behave more like a standard block element.\n  // See https://github.com/twbs/bootstrap/issues/12359\n  // and https://html.spec.whatwg.org/multipage/#the-fieldset-and-legend-elements\n  min-width: 0;\n  // Reset the default outline behavior of fieldsets so they don't affect page layout.\n  padding: 0;\n  margin: 0;\n  border: 0;\n}\n\n// 1. Correct the text wrapping in Edge and IE.\n// 2. Correct the color inheritance from `fieldset` elements in IE.\nlegend {\n  display: block;\n  width: 100%;\n  max-width: 100%; // 1\n  padding: 0;\n  margin-bottom: .5rem;\n  @include font-size(1.5rem);\n  line-height: inherit;\n  color: inherit; // 2\n  white-space: normal; // 1\n}\n\nprogress {\n  vertical-align: baseline; // Add the correct vertical alignment in Chrome, Firefox, and Opera.\n}\n\n// Correct the cursor style of increment and decrement buttons in Chrome.\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n[type=\"search\"] {\n  // This overrides the extra rounded corners on search inputs in iOS so that our\n  // `.form-control` class can properly style them. Note that this cannot simply\n  // be added to `.form-control` as it's not specific enough. For details, see\n  // https://github.com/twbs/bootstrap/issues/11586.\n  outline-offset: -2px; // 2. Correct the outline style in Safari.\n  -webkit-appearance: none;\n}\n\n//\n// Remove the inner padding in Chrome and Safari on macOS.\n//\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n//\n// 1. Correct the inability to style clickable types in iOS and Safari.\n// 2. Change font properties to `inherit` in Safari.\n//\n\n::-webkit-file-upload-button {\n  font: inherit; // 2\n  -webkit-appearance: button; // 1\n}\n\n//\n// Correct element displays\n//\n\noutput {\n  display: inline-block;\n}\n\nsummary {\n  display: list-item; // Add the correct display in all browsers\n  cursor: pointer;\n}\n\ntemplate {\n  display: none; // Add the correct display in IE\n}\n\n// Always hide an element with the `hidden` HTML attribute (from PureCSS).\n// Needed for proper display in IE 10-.\n[hidden] {\n  display: none !important;\n}\n","// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// Color system\n\n$white:    #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #e9ecef !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-650: #54565a !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black:    #000 !default;\n\n$grays: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$grays: map-merge(\n  (\n    \"100\": $gray-100,\n    \"200\": $gray-200,\n    \"300\": $gray-300,\n    \"400\": $gray-400,\n    \"500\": $gray-500,\n    \"600\": $gray-600,\n    \"700\": $gray-700,\n    \"800\": $gray-800,\n    \"900\": $gray-900\n  ),\n  $grays\n);\n\n$blue:    #1b3d6e !default;\n$indigo:  #6610f2 !default;\n$purple:  #6f42c1 !default;\n$pink:    #e83e8c !default;\n$red:     #dc3545 !default;\n$orange:  #f16824 !default;\n$yellow:  #ffc107 !default;\n$green:   #28a745 !default;\n$teal:    #20c997 !default;\n$cyan:    #17a2b8 !default;\n\n$colors: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$colors: map-merge(\n  (\n    \"blue\":       $blue,\n    \"indigo\":     $indigo,\n    \"purple\":     $purple,\n    \"pink\":       $pink,\n    \"red\":        $red,\n    \"orange\":     $orange,\n    \"yellow\":     $yellow,\n    \"green\":      $green,\n    \"teal\":       $teal,\n    \"cyan\":       $cyan,\n    \"white\":      $white,\n    \"gray\":       $gray-600,\n    \"gray-dark\":  $gray-800\n  ),\n  $colors\n);\n\n$primary:       $blue !default;\n$secondary:     $orange !default;\n$success:       $green !default;\n$info:          $cyan !default;\n$warning:       $yellow !default;\n$danger:        $red !default;\n$light:         $gray-100 !default;\n$dark:          $gray-800 !default;\n\n$theme-colors: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$theme-colors: map-merge(\n  (\n    \"primary\":    $primary,\n    \"secondary\":  $secondary,\n    \"success\":    $success,\n    \"info\":       $info,\n    \"warning\":    $warning,\n    \"danger\":     $danger,\n    \"light\":      $light,\n    \"dark\":       $dark\n  ),\n  $theme-colors\n);\n\n// Set a specific jump point for requesting color jumps\n$theme-color-interval:      8% !default;\n\n// The yiq lightness value that determines when the lightness of color changes from \"dark\" to \"light\". Acceptable values are between 0 and 255.\n$yiq-contrasted-threshold:  150 !default;\n\n// Customize the light and dark text colors for use in our YIQ color contrast function.\n$yiq-text-dark:             $gray-900 !default;\n$yiq-text-light:            $white !default;\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n  (\"<\",\"%3c\"),\n  (\">\",\"%3e\"),\n  (\"#\",\"%23\"),\n) !default;\n\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret:                                true !default;\n$enable-rounded:                              false !default;\n$enable-shadows:                              false !default;\n$enable-gradients:                            false !default;\n$enable-transitions:                          true !default;\n$enable-prefers-reduced-motion-media-query:   true !default;\n$enable-hover-media-query:                    false !default; // Deprecated, no longer affects any compiled CSS\n$enable-grid-classes:                         true !default;\n$enable-pointer-cursor-for-buttons:           true !default;\n$enable-print-styles:                         true !default;\n$enable-responsive-font-sizes:                false !default;\n$enable-validation-icons:                     true !default;\n$enable-deprecation-messages:                 true !default;\n\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n$spacer: 1rem !default;\n$spacers: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$spacers: map-merge(\n  (\n    0: 0,\n    1: ($spacer * .25),\n    2: ($spacer * .5),\n    3: $spacer,\n    4: ($spacer * 1.5),\n    5: ($spacer * 3)\n  ),\n  $spacers\n);\n\n// This variable affects the `.h-*` and `.w-*` classes.\n$sizes: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$sizes: map-merge(\n  (\n    25: 25%,\n    50: 50%,\n    75: 75%,\n    100: 100%,\n    auto: auto\n  ),\n  $sizes\n);\n\n\n// Body\n//\n// Settings for the `` element.\n\n$body-bg:                   $white !default;\n$body-color:                $gray-900 !default;\n\n\n// Links\n//\n// Style anchor elements.\n\n$link-color:                              theme-color(\"primary\") !default;\n$link-decoration:                         none !default;\n$link-hover-color:                        darken($link-color, 15%) !default;\n$link-hover-decoration:                   underline !default;\n// Darken percentage for links with `.text-*` class (e.g. `.text-success`)\n$emphasized-link-hover-darken-percentage: 15% !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom:   1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n$grid-breakpoints: (\n  xs: 0,\n  sm: 576px,\n  md: 768px,\n  lg: 992px,\n  xl: 1200px\n) !default;\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n$container-max-widths: (\n  sm: 540px,\n  md: 720px,\n  lg: 960px,\n  xl: 1140px\n) !default;\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns:                12 !default;\n$grid-gutter-width:           30px !default;\n$grid-row-columns:            6 !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n$line-height-lg:              1.5 !default;\n$line-height-sm:              1.5 !default;\n\n$border-width:                1px !default;\n$border-color:                $gray-300 !default;\n\n$border-radius:               .25rem !default;\n$border-radius-lg:            .3rem !default;\n$border-radius-sm:            .2rem !default;\n\n$rounded-pill:                50rem !default;\n\n$box-shadow-sm:               0 .125rem .25rem rgba($black, .075) !default;\n$box-shadow:                  0 .5rem 1rem rgba($black, .15) !default;\n$box-shadow-lg:               0 1rem 3rem rgba($black, .175) !default;\n\n$component-active-color:      $white !default;\n$component-active-bg:         theme-color(\"primary\") !default;\n\n$caret-width:                 .3em !default;\n$caret-vertical-align:        $caret-width * .85 !default;\n$caret-spacing:               $caret-width * .85 !default;\n\n$transition-base:             all .2s ease-in-out !default;\n$transition-fade:             opacity .15s linear !default;\n$transition-collapse:         height .35s ease !default;\n\n$embed-responsive-aspect-ratios: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$embed-responsive-aspect-ratios: join(\n  (\n    (21 9),\n    (16 9),\n    (4 3),\n    (1 1),\n  ),\n  $embed-responsive-aspect-ratios\n);\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// stylelint-disable value-keyword-case\n$font-family-sans-serif:      -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\" !default;\n$font-family-monospace:       SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n$font-family-base:            $font-family-sans-serif !default;\n// stylelint-enable value-keyword-case\n\n$font-size-base:              1rem !default; // Assumes the browser default, typically `16px`\n$font-size-lg:                $font-size-base * 1.25 !default;\n$font-size-sm:                $font-size-base * .875 !default;\n\n$font-weight-lighter:         lighter !default;\n$font-weight-light:           300 !default;\n$font-weight-normal:          400 !default;\n$font-weight-bold:            700 !default;\n$font-weight-bolder:          bolder !default;\n\n$font-weight-base:            $font-weight-normal !default;\n$line-height-base:            1.5 !default;\n\n$h1-font-size:                $font-size-base * 2.5 !default;\n$h2-font-size:                $font-size-base * 2 !default;\n$h3-font-size:                $font-size-base * 1.75 !default;\n$h4-font-size:                $font-size-base * 1.5 !default;\n$h5-font-size:                $font-size-base * 1.25 !default;\n$h6-font-size:                $font-size-base !default;\n\n$headings-margin-bottom:      $spacer / 2 !default;\n$headings-font-family:        null !default;\n$headings-font-weight:        500 !default;\n$headings-line-height:        1.2 !default;\n$headings-color:              null !default;\n\n$display1-size:               6rem !default;\n$display2-size:               5.5rem !default;\n$display3-size:               4.5rem !default;\n$display4-size:               3.5rem !default;\n\n$display1-weight:             300 !default;\n$display2-weight:             300 !default;\n$display3-weight:             300 !default;\n$display4-weight:             300 !default;\n$display-line-height:         $headings-line-height !default;\n\n$lead-font-size:              $font-size-base * 1.25 !default;\n$lead-font-weight:            300 !default;\n\n$small-font-size:             80% !default;\n\n$text-muted:                  $gray-600 !default;\n\n$blockquote-small-color:      $gray-600 !default;\n$blockquote-small-font-size:  $small-font-size !default;\n$blockquote-font-size:        $font-size-base * 1.25 !default;\n\n$hr-border-color:             rgba($black, .1) !default;\n$hr-border-width:             $border-width !default;\n\n$mark-padding:                .2em !default;\n\n$dt-font-weight:              $font-weight-bold !default;\n\n$kbd-box-shadow:              inset 0 -.1rem 0 rgba($black, .25) !default;\n$nested-kbd-font-weight:      $font-weight-bold !default;\n\n$list-inline-padding:         .5rem !default;\n\n$mark-bg:                     #fcf8e3 !default;\n\n$hr-margin-y:                 $spacer !default;\n\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n\n$table-cell-padding:          .75rem !default;\n$table-cell-padding-sm:       .3rem !default;\n\n$table-color:                 $body-color !default;\n$table-bg:                    null !default;\n$table-accent-bg:             rgba($black, .05) !default;\n$table-hover-color:           $table-color !default;\n$table-hover-bg:              rgba($black, .075) !default;\n$table-active-bg:             $table-hover-bg !default;\n\n$table-border-width:          $border-width !default;\n$table-border-color:          $border-color !default;\n\n$table-head-bg:               $gray-200 !default;\n$table-head-color:            $gray-700 !default;\n\n$table-dark-color:            $white !default;\n$table-dark-bg:               $gray-800 !default;\n$table-dark-accent-bg:        rgba($white, .05) !default;\n$table-dark-hover-color:      $table-dark-color !default;\n$table-dark-hover-bg:         rgba($white, .075) !default;\n$table-dark-border-color:     lighten($table-dark-bg, 7.5%) !default;\n\n$table-striped-order:         odd !default;\n\n$table-caption-color:         $text-muted !default;\n\n$table-bg-level:              -9 !default;\n$table-border-level:          -6 !default;\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n$input-btn-padding-y:         .375rem !default;\n$input-btn-padding-x:         .75rem !default;\n$input-btn-font-family:       null !default;\n$input-btn-font-size:         $font-size-base !default;\n$input-btn-line-height:       $line-height-base !default;\n\n$input-btn-focus-width:       .2rem !default;\n$input-btn-focus-color:       rgba($component-active-bg, .25) !default;\n$input-btn-focus-box-shadow:  0 0 0 $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm:      .25rem !default;\n$input-btn-padding-x-sm:      .5rem !default;\n$input-btn-font-size-sm:      $font-size-sm !default;\n$input-btn-line-height-sm:    $line-height-sm !default;\n\n$input-btn-padding-y-lg:      .5rem !default;\n$input-btn-padding-x-lg:      1rem !default;\n$input-btn-font-size-lg:      $font-size-lg !default;\n$input-btn-line-height-lg:    $line-height-lg !default;\n\n$input-btn-border-width:      $border-width !default;\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n$btn-padding-y:               $input-btn-padding-y !default;\n$btn-padding-x:               $input-btn-padding-x !default;\n$btn-font-family:             $input-btn-font-family !default;\n$btn-font-size:               $input-btn-font-size !default;\n$btn-line-height:             $input-btn-line-height !default;\n$btn-white-space:             null !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-padding-y-sm:            $input-btn-padding-y-sm !default;\n$btn-padding-x-sm:            $input-btn-padding-x-sm !default;\n$btn-font-size-sm:            $input-btn-font-size-sm !default;\n$btn-line-height-sm:          $input-btn-line-height-sm !default;\n\n$btn-padding-y-lg:            $input-btn-padding-y-lg !default;\n$btn-padding-x-lg:            $input-btn-padding-x-lg !default;\n$btn-font-size-lg:            $input-btn-font-size-lg !default;\n$btn-line-height-lg:          $input-btn-line-height-lg !default;\n\n$btn-border-width:            $input-btn-border-width !default;\n\n$btn-font-weight:             $font-weight-normal !default;\n$btn-box-shadow:              inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;\n$btn-focus-width:             $input-btn-focus-width !default;\n$btn-focus-box-shadow:        $input-btn-focus-box-shadow !default;\n$btn-disabled-opacity:        .65 !default;\n$btn-active-box-shadow:       inset 0 3px 5px rgba($black, .125) !default;\n\n$btn-link-disabled-color:     $gray-600 !default;\n\n$btn-block-spacing-y:         .5rem !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius:           $border-radius !default;\n$btn-border-radius-lg:        $border-radius-lg !default;\n$btn-border-radius-sm:        $border-radius-sm !default;\n\n$btn-transition:              color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n\n// Forms\n\n$label-margin-bottom:                   .5rem !default;\n\n$input-padding-y:                       $input-btn-padding-y !default;\n$input-padding-x:                       $input-btn-padding-x !default;\n$input-font-family:                     $input-btn-font-family !default;\n$input-font-size:                       $input-btn-font-size !default;\n$input-font-weight:                     $font-weight-base !default;\n$input-line-height:                     $input-btn-line-height !default;\n\n$input-padding-y-sm:                    $input-btn-padding-y-sm !default;\n$input-padding-x-sm:                    $input-btn-padding-x-sm !default;\n$input-font-size-sm:                    $input-btn-font-size-sm !default;\n$input-line-height-sm:                  $input-btn-line-height-sm !default;\n\n$input-padding-y-lg:                    $input-btn-padding-y-lg !default;\n$input-padding-x-lg:                    $input-btn-padding-x-lg !default;\n$input-font-size-lg:                    $input-btn-font-size-lg !default;\n$input-line-height-lg:                  $input-btn-line-height-lg !default;\n\n$input-bg:                              $white !default;\n$input-disabled-bg:                     $gray-200 !default;\n\n$input-color:                           $gray-700 !default;\n$input-border-color:                    $gray-400 !default;\n$input-border-width:                    $input-btn-border-width !default;\n$input-box-shadow:                      inset 0 1px 1px rgba($black, .075) !default;\n\n$input-border-radius:                   $border-radius !default;\n$input-border-radius-lg:                $border-radius-lg !default;\n$input-border-radius-sm:                $border-radius-sm !default;\n\n$input-focus-bg:                        $input-bg !default;\n$input-focus-border-color:              lighten($component-active-bg, 25%) !default;\n$input-focus-color:                     $input-color !default;\n$input-focus-width:                     $input-btn-focus-width !default;\n$input-focus-box-shadow:                $input-btn-focus-box-shadow !default;\n\n$input-placeholder-color:               $gray-600 !default;\n$input-plaintext-color:                 $body-color !default;\n\n$input-height-border:                   $input-border-width * 2 !default;\n\n$input-height-inner:                    add($input-line-height * 1em, $input-padding-y * 2) !default;\n$input-height-inner-half:               add($input-line-height * .5em, $input-padding-y) !default;\n$input-height-inner-quarter:            add($input-line-height * .25em, $input-padding-y / 2) !default;\n\n$input-height:                          add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;\n$input-height-sm:                       add($input-line-height-sm * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;\n$input-height-lg:                       add($input-line-height-lg * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;\n\n$input-transition:                      border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-text-margin-top:                  .25rem !default;\n\n$form-check-input-gutter:               1.25rem !default;\n$form-check-input-margin-y:             .3rem !default;\n$form-check-input-margin-x:             .25rem !default;\n\n$form-check-inline-margin-x:            .75rem !default;\n$form-check-inline-input-margin-x:      .3125rem !default;\n\n$form-grid-gutter-width:                10px !default;\n$form-group-margin-bottom:              1rem !default;\n\n$input-group-addon-color:               $input-color !default;\n$input-group-addon-bg:                  $gray-200 !default;\n$input-group-addon-border-color:        $input-border-color !default;\n\n$custom-forms-transition:               background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$custom-control-gutter:                 .5rem !default;\n$custom-control-spacer-x:               1rem !default;\n$custom-control-cursor:                 null !default;\n\n$custom-control-indicator-size:         1rem !default;\n$custom-control-indicator-bg:           $input-bg !default;\n\n$custom-control-indicator-bg-size:      50% 50% !default;\n$custom-control-indicator-box-shadow:   $input-box-shadow !default;\n$custom-control-indicator-border-color: $gray-500 !default;\n$custom-control-indicator-border-width: $input-border-width !default;\n\n$custom-control-label-color:            null !default;\n\n$custom-control-indicator-disabled-bg:          $input-disabled-bg !default;\n$custom-control-label-disabled-color:           $gray-600 !default;\n\n$custom-control-indicator-checked-color:        $component-active-color !default;\n$custom-control-indicator-checked-bg:           $component-active-bg !default;\n$custom-control-indicator-checked-disabled-bg:  rgba(theme-color(\"primary\"), .5) !default;\n$custom-control-indicator-checked-box-shadow:   none !default;\n$custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default;\n\n$custom-control-indicator-focus-box-shadow:     $input-focus-box-shadow !default;\n$custom-control-indicator-focus-border-color:   $input-focus-border-color !default;\n\n$custom-control-indicator-active-color:         $component-active-color !default;\n$custom-control-indicator-active-bg:            lighten($component-active-bg, 35%) !default;\n$custom-control-indicator-active-box-shadow:    none !default;\n$custom-control-indicator-active-border-color:  $custom-control-indicator-active-bg !default;\n\n$custom-checkbox-indicator-border-radius:       $border-radius !default;\n$custom-checkbox-indicator-icon-checked:        url(\"data:image/svg+xml,\") !default;\n\n$custom-checkbox-indicator-indeterminate-bg:           $component-active-bg !default;\n$custom-checkbox-indicator-indeterminate-color:        $custom-control-indicator-checked-color !default;\n$custom-checkbox-indicator-icon-indeterminate:         url(\"data:image/svg+xml,\") !default;\n$custom-checkbox-indicator-indeterminate-box-shadow:   none !default;\n$custom-checkbox-indicator-indeterminate-border-color: $custom-checkbox-indicator-indeterminate-bg !default;\n\n$custom-radio-indicator-border-radius:          50% !default;\n$custom-radio-indicator-icon-checked:           url(\"data:image/svg+xml,\") !default;\n\n$custom-switch-width:                           $custom-control-indicator-size * 1.75 !default;\n$custom-switch-indicator-border-radius:         $custom-control-indicator-size / 2 !default;\n$custom-switch-indicator-size:                  subtract($custom-control-indicator-size, $custom-control-indicator-border-width * 4) !default;\n\n$custom-select-padding-y:           $input-padding-y !default;\n$custom-select-padding-x:           $input-padding-x !default;\n$custom-select-font-family:         $input-font-family !default;\n$custom-select-font-size:           $input-font-size !default;\n$custom-select-height:              $input-height !default;\n$custom-select-indicator-padding:   1rem !default; // Extra padding to account for the presence of the background-image based indicator\n$custom-select-font-weight:         $input-font-weight !default;\n$custom-select-line-height:         $input-line-height !default;\n$custom-select-color:               $input-color !default;\n$custom-select-disabled-color:      $gray-600 !default;\n$custom-select-bg:                  $input-bg !default;\n$custom-select-disabled-bg:         $gray-200 !default;\n$custom-select-bg-size:             8px 10px !default; // In pixels because image dimensions\n$custom-select-indicator-color:     $gray-800 !default;\n$custom-select-indicator:           url(\"data:image/svg+xml,\") !default;\n$custom-select-background:          escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)\n\n$custom-select-feedback-icon-padding-right: add(1em * .75, (2 * $custom-select-padding-y * .75) + $custom-select-padding-x + $custom-select-indicator-padding) !default;\n$custom-select-feedback-icon-position:      center right ($custom-select-padding-x + $custom-select-indicator-padding) !default;\n$custom-select-feedback-icon-size:          $input-height-inner-half $input-height-inner-half !default;\n\n$custom-select-border-width:        $input-border-width !default;\n$custom-select-border-color:        $input-border-color !default;\n$custom-select-border-radius:       $border-radius !default;\n$custom-select-box-shadow:          inset 0 1px 2px rgba($black, .075) !default;\n\n$custom-select-focus-border-color:  $input-focus-border-color !default;\n$custom-select-focus-width:         $input-focus-width !default;\n$custom-select-focus-box-shadow:    0 0 0 $custom-select-focus-width $input-btn-focus-color !default;\n\n$custom-select-padding-y-sm:        $input-padding-y-sm !default;\n$custom-select-padding-x-sm:        $input-padding-x-sm !default;\n$custom-select-font-size-sm:        $input-font-size-sm !default;\n$custom-select-height-sm:           $input-height-sm !default;\n\n$custom-select-padding-y-lg:        $input-padding-y-lg !default;\n$custom-select-padding-x-lg:        $input-padding-x-lg !default;\n$custom-select-font-size-lg:        $input-font-size-lg !default;\n$custom-select-height-lg:           $input-height-lg !default;\n\n$custom-range-track-width:          100% !default;\n$custom-range-track-height:         .5rem !default;\n$custom-range-track-cursor:         pointer !default;\n$custom-range-track-bg:             $gray-300 !default;\n$custom-range-track-border-radius:  1rem !default;\n$custom-range-track-box-shadow:     inset 0 .25rem .25rem rgba($black, .1) !default;\n\n$custom-range-thumb-width:                   1rem !default;\n$custom-range-thumb-height:                  $custom-range-thumb-width !default;\n$custom-range-thumb-bg:                      $component-active-bg !default;\n$custom-range-thumb-border:                  0 !default;\n$custom-range-thumb-border-radius:           1rem !default;\n$custom-range-thumb-box-shadow:              0 .1rem .25rem rgba($black, .1) !default;\n$custom-range-thumb-focus-box-shadow:        0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$custom-range-thumb-focus-box-shadow-width:  $input-focus-width !default; // For focus box shadow issue in IE/Edge\n$custom-range-thumb-active-bg:               lighten($component-active-bg, 35%) !default;\n$custom-range-thumb-disabled-bg:             $gray-500 !default;\n\n$custom-file-height:                $input-height !default;\n$custom-file-height-inner:          $input-height-inner !default;\n$custom-file-focus-border-color:    $input-focus-border-color !default;\n$custom-file-focus-box-shadow:      $input-focus-box-shadow !default;\n$custom-file-disabled-bg:           $input-disabled-bg !default;\n\n$custom-file-padding-y:             $input-padding-y !default;\n$custom-file-padding-x:             $input-padding-x !default;\n$custom-file-line-height:           $input-line-height !default;\n$custom-file-font-family:           $input-font-family !default;\n$custom-file-font-weight:           $input-font-weight !default;\n$custom-file-color:                 $input-color !default;\n$custom-file-bg:                    $input-bg !default;\n$custom-file-border-width:          $input-border-width !default;\n$custom-file-border-color:          $input-border-color !default;\n$custom-file-border-radius:         $input-border-radius !default;\n$custom-file-box-shadow:            $input-box-shadow !default;\n$custom-file-button-color:          $custom-file-color !default;\n$custom-file-button-bg:             $input-group-addon-bg !default;\n$custom-file-text: (\n  en: \"Browse\"\n) !default;\n\n\n// Form validation\n\n$form-feedback-margin-top:          $form-text-margin-top !default;\n$form-feedback-font-size:           $small-font-size !default;\n$form-feedback-valid-color:         theme-color(\"success\") !default;\n$form-feedback-invalid-color:       theme-color(\"danger\") !default;\n\n$form-feedback-icon-valid-color:    $form-feedback-valid-color !default;\n$form-feedback-icon-valid:          url(\"data:image/svg+xml,\") !default;\n$form-feedback-icon-invalid-color:  $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid:        url(\"data:image/svg+xml,\") !default;\n\n$form-validation-states: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$form-validation-states: map-merge(\n  (\n    \"valid\": (\n      \"color\": $form-feedback-valid-color,\n      \"icon\": $form-feedback-icon-valid\n    ),\n    \"invalid\": (\n      \"color\": $form-feedback-invalid-color,\n      \"icon\": $form-feedback-icon-invalid\n    ),\n  ),\n  $form-validation-states\n);\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n$zindex-dropdown:                   1000 !default;\n$zindex-sticky:                     1020 !default;\n$zindex-fixed:                      1030 !default;\n$zindex-modal-backdrop:             1040 !default;\n$zindex-modal:                      1050 !default;\n$zindex-popover:                    1060 !default;\n$zindex-tooltip:                    1070 !default;\n\n\n// Navs\n\n$nav-link-padding-y:                .5rem !default;\n$nav-link-padding-x:                1rem !default;\n$nav-link-disabled-color:           $gray-600 !default;\n\n$nav-tabs-border-color:             $gray-300 !default;\n$nav-tabs-border-width:             $border-width !default;\n$nav-tabs-border-radius:            $border-radius !default;\n$nav-tabs-link-hover-border-color:  $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color:        $gray-700 !default;\n$nav-tabs-link-active-bg:           $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius:           $border-radius !default;\n$nav-pills-link-active-color:       $component-active-color !default;\n$nav-pills-link-active-bg:          $component-active-bg !default;\n\n$nav-divider-color:                 $gray-200 !default;\n$nav-divider-margin-y:              $spacer / 2 !default;\n\n\n// Navbar\n\n$navbar-padding-y:                  $spacer / 2 !default;\n$navbar-padding-x:                  $spacer !default;\n\n$navbar-nav-link-padding-x:         .5rem !default;\n\n$navbar-brand-font-size:            $font-size-lg !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height:                   $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height:               $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y:            ($nav-link-height - $navbar-brand-height) / 2 !default;\n\n$navbar-toggler-padding-y:          .25rem !default;\n$navbar-toggler-padding-x:          .75rem !default;\n$navbar-toggler-font-size:          $font-size-lg !default;\n$navbar-toggler-border-radius:      $btn-border-radius !default;\n\n$navbar-dark-color:                 rgba($white, .5) !default;\n$navbar-dark-hover-color:           rgba($white, .75) !default;\n$navbar-dark-active-color:          $white !default;\n$navbar-dark-disabled-color:        rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg:       url(\"data:image/svg+xml,\") !default;\n$navbar-dark-toggler-border-color:  rgba($white, .1) !default;\n\n$navbar-light-color:                rgba($black, .5) !default;\n$navbar-light-hover-color:          rgba($black, .7) !default;\n$navbar-light-active-color:         rgba($black, .9) !default;\n$navbar-light-disabled-color:       rgba($black, .3) !default;\n$navbar-light-toggler-icon-bg:      url(\"data:image/svg+xml,\") !default;\n$navbar-light-toggler-border-color: rgba($black, .1) !default;\n\n$navbar-light-brand-color:                $navbar-light-active-color !default;\n$navbar-light-brand-hover-color:          $navbar-light-active-color !default;\n$navbar-dark-brand-color:                 $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color:           $navbar-dark-active-color !default;\n\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n$dropdown-min-width:                10rem !default;\n$dropdown-padding-y:                .5rem !default;\n$dropdown-spacer:                   .125rem !default;\n$dropdown-font-size:                $font-size-base !default;\n$dropdown-color:                    $body-color !default;\n$dropdown-bg:                       $white !default;\n$dropdown-border-color:             rgba($black, .15) !default;\n$dropdown-border-radius:            $border-radius !default;\n$dropdown-border-width:             $border-width !default;\n$dropdown-inner-border-radius:      subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-divider-bg:               $gray-200 !default;\n$dropdown-divider-margin-y:         $nav-divider-margin-y !default;\n$dropdown-box-shadow:               0 .5rem 1rem rgba($black, .175) !default;\n\n$dropdown-link-color:               $gray-900 !default;\n$dropdown-link-hover-color:         darken($gray-900, 5%) !default;\n$dropdown-link-hover-bg:            $gray-100 !default;\n\n$dropdown-link-active-color:        $component-active-color !default;\n$dropdown-link-active-bg:           $component-active-bg !default;\n\n$dropdown-link-disabled-color:      $gray-600 !default;\n\n$dropdown-item-padding-y:           .25rem !default;\n$dropdown-item-padding-x:           1.5rem !default;\n\n$dropdown-header-color:             $gray-600 !default;\n\n\n// Pagination\n\n$pagination-padding-y:              .5rem !default;\n$pagination-padding-x:              .75rem !default;\n$pagination-padding-y-sm:           .25rem !default;\n$pagination-padding-x-sm:           .5rem !default;\n$pagination-padding-y-lg:           .75rem !default;\n$pagination-padding-x-lg:           1.5rem !default;\n$pagination-line-height:            1.25 !default;\n\n$pagination-color:                  $link-color !default;\n$pagination-bg:                     $white !default;\n$pagination-border-width:           $border-width !default;\n$pagination-border-color:           $gray-300 !default;\n\n$pagination-focus-box-shadow:       $input-btn-focus-box-shadow !default;\n$pagination-focus-outline:          0 !default;\n\n$pagination-hover-color:            $link-hover-color !default;\n$pagination-hover-bg:               $gray-200 !default;\n$pagination-hover-border-color:     $gray-300 !default;\n\n$pagination-active-color:           $component-active-color !default;\n$pagination-active-bg:              $component-active-bg !default;\n$pagination-active-border-color:    $pagination-active-bg !default;\n\n$pagination-disabled-color:         $gray-600 !default;\n$pagination-disabled-bg:            $white !default;\n$pagination-disabled-border-color:  $gray-300 !default;\n\n\n// Jumbotron\n\n$jumbotron-padding:                 2rem !default;\n$jumbotron-color:                   null !default;\n$jumbotron-bg:                      $gray-200 !default;\n\n\n// Cards\n\n$card-spacer-y:                     .75rem !default;\n$card-spacer-x:                     1.25rem !default;\n$card-border-width:                 $border-width !default;\n$card-border-radius:                $border-radius !default;\n$card-border-color:                 rgba($black, .125) !default;\n$card-inner-border-radius:          subtract($card-border-radius, $card-border-width) !default;\n$card-cap-bg:                       rgba($black, .03) !default;\n$card-cap-color:                    null !default;\n$card-height:                       null !default;\n$card-color:                        null !default;\n$card-bg:                           $white !default;\n\n$card-img-overlay-padding:          1.25rem !default;\n\n$card-group-margin:                 $grid-gutter-width / 2 !default;\n$card-deck-margin:                  $card-group-margin !default;\n\n$card-columns-count:                3 !default;\n$card-columns-gap:                  1.25rem !default;\n$card-columns-margin:               $card-spacer-y !default;\n\n\n// Tooltips\n\n$tooltip-font-size:                 $font-size-sm !default;\n$tooltip-max-width:                 200px !default;\n$tooltip-color:                     $white !default;\n$tooltip-bg:                        $black !default;\n$tooltip-border-radius:             $border-radius !default;\n$tooltip-opacity:                   .9 !default;\n$tooltip-padding-y:                 .25rem !default;\n$tooltip-padding-x:                 .5rem !default;\n$tooltip-margin:                    0 !default;\n\n$tooltip-arrow-width:               .8rem !default;\n$tooltip-arrow-height:              .4rem !default;\n$tooltip-arrow-color:               $tooltip-bg !default;\n\n// Form tooltips must come after regular tooltips\n$form-feedback-tooltip-padding-y:     $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x:     $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size:     $tooltip-font-size !default;\n$form-feedback-tooltip-line-height:   $line-height-base !default;\n$form-feedback-tooltip-opacity:       $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n\n\n// Popovers\n\n$popover-font-size:                 $font-size-sm !default;\n$popover-bg:                        $white !default;\n$popover-max-width:                 276px !default;\n$popover-border-width:              $border-width !default;\n$popover-border-color:              rgba($black, .2) !default;\n$popover-border-radius:             $border-radius-lg !default;\n$popover-inner-border-radius:       subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow:                0 .25rem .5rem rgba($black, .2) !default;\n\n$popover-header-bg:                 darken($popover-bg, 3%) !default;\n$popover-header-color:              $headings-color !default;\n$popover-header-padding-y:          .5rem !default;\n$popover-header-padding-x:          .75rem !default;\n\n$popover-body-color:                $body-color !default;\n$popover-body-padding-y:            $popover-header-padding-y !default;\n$popover-body-padding-x:            $popover-header-padding-x !default;\n\n$popover-arrow-width:               1rem !default;\n$popover-arrow-height:              .5rem !default;\n$popover-arrow-color:               $popover-bg !default;\n\n$popover-arrow-outer-color:         fade-in($popover-border-color, .05) !default;\n\n\n// Toasts\n\n$toast-max-width:                   350px !default;\n$toast-padding-x:                   .75rem !default;\n$toast-padding-y:                   .25rem !default;\n$toast-font-size:                   .875rem !default;\n$toast-color:                       null !default;\n$toast-background-color:            rgba($white, .85) !default;\n$toast-border-width:                1px !default;\n$toast-border-color:                rgba(0, 0, 0, .1) !default;\n$toast-border-radius:               .25rem !default;\n$toast-box-shadow:                  0 .25rem .75rem rgba($black, .1) !default;\n\n$toast-header-color:                $gray-600 !default;\n$toast-header-background-color:     rgba($white, .85) !default;\n$toast-header-border-color:         rgba(0, 0, 0, .05) !default;\n\n\n// Badges\n\n$badge-font-size:                   75% !default;\n$badge-font-weight:                 $font-weight-bold !default;\n$badge-padding-y:                   .25em !default;\n$badge-padding-x:                   .4em !default;\n$badge-border-radius:               $border-radius !default;\n\n$badge-transition:                  $btn-transition !default;\n$badge-focus-width:                 $input-btn-focus-width !default;\n\n$badge-pill-padding-x:              .6em !default;\n// Use a higher than normal value to ensure completely rounded edges when\n// customizing padding or font-size on labels.\n$badge-pill-border-radius:          10rem !default;\n\n\n// Modals\n\n// Padding applied to the modal body\n$modal-inner-padding:               1rem !default;\n\n// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding\n$modal-footer-margin-between:       .5rem !default;\n\n$modal-dialog-margin:               .5rem !default;\n$modal-dialog-margin-y-sm-up:       1.75rem !default;\n\n$modal-title-line-height:           $line-height-base !default;\n\n$modal-content-color:               null !default;\n$modal-content-bg:                  $white !default;\n$modal-content-border-color:        rgba($black, .2) !default;\n$modal-content-border-width:        $border-width !default;\n$modal-content-border-radius:       $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs:       0 .25rem .5rem rgba($black, .5) !default;\n$modal-content-box-shadow-sm-up:    0 .5rem 1rem rgba($black, .5) !default;\n\n$modal-backdrop-bg:                 $black !default;\n$modal-backdrop-opacity:            .5 !default;\n$modal-header-border-color:         $border-color !default;\n$modal-footer-border-color:         $modal-header-border-color !default;\n$modal-header-border-width:         $modal-content-border-width !default;\n$modal-footer-border-width:         $modal-header-border-width !default;\n$modal-header-padding-y:            1rem !default;\n$modal-header-padding-x:            1rem !default;\n$modal-header-padding:              $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-xl:                          1140px !default;\n$modal-lg:                          800px !default;\n$modal-md:                          500px !default;\n$modal-sm:                          300px !default;\n\n$modal-fade-transform:              translate(0, -50px) !default;\n$modal-show-transform:              none !default;\n$modal-transition:                  transform .3s ease-out !default;\n$modal-scale-transform:             scale(1.02) !default;\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n$alert-padding-y:                   .75rem !default;\n$alert-padding-x:                   1.25rem !default;\n$alert-margin-bottom:               1rem !default;\n$alert-border-radius:               $border-radius !default;\n$alert-link-font-weight:            $font-weight-bold !default;\n$alert-border-width:                $border-width !default;\n\n$alert-bg-level:                    -10 !default;\n$alert-border-level:                -9 !default;\n$alert-color-level:                 6 !default;\n\n\n// Progress bars\n\n$progress-height:                   1rem !default;\n$progress-font-size:                $font-size-base * .75 !default;\n$progress-bg:                       $gray-200 !default;\n$progress-border-radius:            $border-radius !default;\n$progress-box-shadow:               inset 0 .1rem .1rem rgba($black, .1) !default;\n$progress-bar-color:                $white !default;\n$progress-bar-bg:                   theme-color(\"primary\") !default;\n$progress-bar-animation-timing:     1s linear infinite !default;\n$progress-bar-transition:           width .6s ease !default;\n\n\n// List group\n\n$list-group-color:                  null !default;\n$list-group-bg:                     $white !default;\n$list-group-border-color:           rgba($black, .125) !default;\n$list-group-border-width:           $border-width !default;\n$list-group-border-radius:          $border-radius !default;\n\n$list-group-item-padding-y:         .75rem !default;\n$list-group-item-padding-x:         1.25rem !default;\n\n$list-group-hover-bg:               $gray-100 !default;\n$list-group-active-color:           $component-active-color !default;\n$list-group-active-bg:              $component-active-bg !default;\n$list-group-active-border-color:    $list-group-active-bg !default;\n\n$list-group-disabled-color:         $gray-600 !default;\n$list-group-disabled-bg:            $list-group-bg !default;\n\n$list-group-action-color:           $gray-700 !default;\n$list-group-action-hover-color:     $list-group-action-color !default;\n\n$list-group-action-active-color:    $body-color !default;\n$list-group-action-active-bg:       $gray-200 !default;\n\n\n// Image thumbnails\n\n$thumbnail-padding:                 .25rem !default;\n$thumbnail-bg:                      $body-bg !default;\n$thumbnail-border-width:            $border-width !default;\n$thumbnail-border-color:            $gray-300 !default;\n$thumbnail-border-radius:           $border-radius !default;\n$thumbnail-box-shadow:              0 1px 2px rgba($black, .075) !default;\n\n\n// Figures\n\n$figure-caption-font-size:          90% !default;\n$figure-caption-color:              $gray-600 !default;\n\n\n// Breadcrumbs\n\n$breadcrumb-font-size:              null !default;\n\n$breadcrumb-padding-y:              .75rem !default;\n$breadcrumb-padding-x:              1rem !default;\n$breadcrumb-item-padding:           .5rem !default;\n\n$breadcrumb-margin-bottom:          1rem !default;\n\n$breadcrumb-bg:                     $gray-200 !default;\n$breadcrumb-divider-color:          $gray-600 !default;\n$breadcrumb-active-color:           $gray-600 !default;\n$breadcrumb-divider:                quote(\"/\") !default;\n\n$breadcrumb-border-radius:          $border-radius !default;\n\n\n// Carousel\n\n$carousel-control-color:             $white !default;\n$carousel-control-width:             15% !default;\n$carousel-control-opacity:           .5 !default;\n$carousel-control-hover-opacity:     .9 !default;\n$carousel-control-transition:        opacity .15s ease !default;\n\n$carousel-indicator-width:           30px !default;\n$carousel-indicator-height:          3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer:          3px !default;\n$carousel-indicator-active-bg:       $white !default;\n$carousel-indicator-transition:      opacity .6s ease !default;\n\n$carousel-caption-width:             70% !default;\n$carousel-caption-color:             $white !default;\n\n$carousel-control-icon-width:        20px !default;\n\n$carousel-control-prev-icon-bg:      url(\"data:image/svg+xml,\") !default;\n$carousel-control-next-icon-bg:      url(\"data:image/svg+xml,\") !default;\n\n$carousel-transition-duration:       .6s !default;\n$carousel-transition:                transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n\n// Spinners\n\n$spinner-width:         2rem !default;\n$spinner-height:        $spinner-width !default;\n$spinner-border-width:  .25em !default;\n\n$spinner-width-sm:        1rem !default;\n$spinner-height-sm:       $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n\n\n// Close\n\n$close-font-size:                   $font-size-base * 1.5 !default;\n$close-font-weight:                 $font-weight-bold !default;\n$close-color:                       $black !default;\n$close-text-shadow:                 0 1px 0 $white !default;\n\n\n// Code\n\n$code-font-size:                    87.5% !default;\n$code-color:                        $pink !default;\n\n$kbd-padding-y:                     .2rem !default;\n$kbd-padding-x:                     .4rem !default;\n$kbd-font-size:                     $code-font-size !default;\n$kbd-color:                         $white !default;\n$kbd-bg:                            $gray-900 !default;\n\n$pre-color:                         $gray-900 !default;\n$pre-scrollable-max-height:         340px !default;\n\n\n// Utilities\n\n$displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default;\n$overflows: auto, hidden !default;\n$positions: static, relative, absolute, fixed, sticky !default;\n\n\n// Printing\n\n$print-page-size:                   a3 !default;\n$print-body-min-width:              map-get($grid-breakpoints, \"lg\") !default;\n","// stylelint-disable property-blacklist, scss/dollar-variable-default\n\n// SCSS RFS mixin\n//\n// Automated font-resizing\n//\n// See https://github.com/twbs/rfs\n\n// Configuration\n\n// Base font size\n$rfs-base-font-size: 1.25rem !default;\n$rfs-font-size-unit: rem !default;\n\n// Breakpoint at where font-size starts decreasing if screen width is smaller\n$rfs-breakpoint: 1200px !default;\n$rfs-breakpoint-unit: px !default;\n\n// Resize font-size based on screen height and width\n$rfs-two-dimensional: false !default;\n\n// Factor of decrease\n$rfs-factor: 10 !default;\n\n@if type-of($rfs-factor) != \"number\" or $rfs-factor <= 1 {\n  @error \"`#{$rfs-factor}` is not a valid  $rfs-factor, it must be greater than 1.\";\n}\n\n// Generate enable or disable classes. Possibilities: false, \"enable\" or \"disable\"\n$rfs-class: false !default;\n\n// 1 rem = $rfs-rem-value px\n$rfs-rem-value: 16 !default;\n\n// Safari iframe resize bug: https://github.com/twbs/rfs/issues/14\n$rfs-safari-iframe-resize-bug-fix: false !default;\n\n// Disable RFS by setting $enable-responsive-font-sizes to false\n$enable-responsive-font-sizes: true !default;\n\n// Cache $rfs-base-font-size unit\n$rfs-base-font-size-unit: unit($rfs-base-font-size);\n\n// Remove px-unit from $rfs-base-font-size for calculations\n@if $rfs-base-font-size-unit == \"px\" {\n  $rfs-base-font-size: $rfs-base-font-size / ($rfs-base-font-size * 0 + 1);\n}\n@else if $rfs-base-font-size-unit == \"rem\" {\n  $rfs-base-font-size: $rfs-base-font-size / ($rfs-base-font-size * 0 + 1 / $rfs-rem-value);\n}\n\n// Cache $rfs-breakpoint unit to prevent multiple calls\n$rfs-breakpoint-unit-cache: unit($rfs-breakpoint);\n\n// Remove unit from $rfs-breakpoint for calculations\n@if $rfs-breakpoint-unit-cache == \"px\" {\n  $rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1);\n}\n@else if $rfs-breakpoint-unit-cache == \"rem\" or $rfs-breakpoint-unit-cache == \"em\" {\n  $rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1 / $rfs-rem-value);\n}\n\n// Responsive font-size mixin\n@mixin rfs($fs, $important: false) {\n  // Cache $fs unit\n  $fs-unit: if(type-of($fs) == \"number\", unit($fs), false);\n\n  // Add !important suffix if needed\n  $rfs-suffix: if($important, \" !important\", \"\");\n\n  // If $fs isn't a number (like inherit) or $fs has a unit (not px or rem, like 1.5em) or $ is 0, just print the value\n  @if not $fs-unit or $fs-unit != \"\" and $fs-unit != \"px\" and $fs-unit != \"rem\" or $fs == 0 {\n    font-size: #{$fs}#{$rfs-suffix};\n  }\n  @else {\n    // Variables for storing static and fluid rescaling\n    $rfs-static: null;\n    $rfs-fluid: null;\n\n    // Remove px-unit from $fs for calculations\n    @if $fs-unit == \"px\" {\n      $fs: $fs / ($fs * 0 + 1);\n    }\n    @else if $fs-unit == \"rem\" {\n      $fs: $fs / ($fs * 0 + 1 / $rfs-rem-value);\n    }\n\n    // Set default font-size\n    @if $rfs-font-size-unit == rem {\n      $rfs-static: #{$fs / $rfs-rem-value}rem#{$rfs-suffix};\n    }\n    @else if $rfs-font-size-unit == px {\n      $rfs-static: #{$fs}px#{$rfs-suffix};\n    }\n    @else {\n      @error \"`#{$rfs-font-size-unit}` is not a valid unit for $rfs-font-size-unit. Use `px` or `rem`.\";\n    }\n\n    // Only add media query if font-size is bigger as the minimum font-size\n    // If $rfs-factor == 1, no rescaling will take place\n    @if $fs > $rfs-base-font-size and $enable-responsive-font-sizes {\n      $min-width: null;\n      $variable-unit: null;\n\n      // Calculate minimum font-size for given font-size\n      $fs-min: $rfs-base-font-size + ($fs - $rfs-base-font-size) / $rfs-factor;\n\n      // Calculate difference between given font-size and minimum font-size for given font-size\n      $fs-diff: $fs - $fs-min;\n\n      // Base font-size formatting\n      // No need to check if the unit is valid, because we did that before\n      $min-width: if($rfs-font-size-unit == rem, #{$fs-min / $rfs-rem-value}rem, #{$fs-min}px);\n\n      // If two-dimensional, use smallest of screen width and height\n      $variable-unit: if($rfs-two-dimensional, vmin, vw);\n\n      // Calculate the variable width between 0 and $rfs-breakpoint\n      $variable-width: #{$fs-diff * 100 / $rfs-breakpoint}#{$variable-unit};\n\n      // Set the calculated font-size.\n      $rfs-fluid: calc(#{$min-width} + #{$variable-width}) #{$rfs-suffix};\n    }\n\n    // Rendering\n    @if $rfs-fluid == null {\n      // Only render static font-size if no fluid font-size is available\n      font-size: $rfs-static;\n    }\n    @else {\n      $mq-value: null;\n\n      // RFS breakpoint formatting\n      @if $rfs-breakpoint-unit == em or $rfs-breakpoint-unit == rem {\n        $mq-value: #{$rfs-breakpoint / $rfs-rem-value}#{$rfs-breakpoint-unit};\n      }\n      @else if $rfs-breakpoint-unit == px {\n        $mq-value: #{$rfs-breakpoint}px;\n      }\n      @else {\n        @error \"`#{$rfs-breakpoint-unit}` is not a valid unit for $rfs-breakpoint-unit. Use `px`, `em` or `rem`.\";\n      }\n\n      @if $rfs-class == \"disable\" {\n        // Adding an extra class increases specificity,\n        // which prevents the media query to override the font size\n        &,\n        .disable-responsive-font-size &,\n        &.disable-responsive-font-size {\n          font-size: $rfs-static;\n        }\n      }\n      @else {\n        font-size: $rfs-static;\n      }\n\n      @if $rfs-two-dimensional {\n        @media (max-width: #{$mq-value}), (max-height: #{$mq-value}) {\n          @if $rfs-class == \"enable\" {\n            .enable-responsive-font-size &,\n            &.enable-responsive-font-size {\n              font-size: $rfs-fluid;\n            }\n          }\n          @else {\n            font-size: $rfs-fluid;\n          }\n\n          @if $rfs-safari-iframe-resize-bug-fix {\n            // stylelint-disable-next-line length-zero-no-unit\n            min-width: 0vw;\n          }\n        }\n      }\n      @else {\n        @media (max-width: #{$mq-value}) {\n          @if $rfs-class == \"enable\" {\n            .enable-responsive-font-size &,\n            &.enable-responsive-font-size {\n              font-size: $rfs-fluid;\n            }\n          }\n          @else {\n            font-size: $rfs-fluid;\n          }\n\n          @if $rfs-safari-iframe-resize-bug-fix {\n            // stylelint-disable-next-line length-zero-no-unit\n            min-width: 0vw;\n          }\n        }\n      }\n    }\n  }\n}\n\n// The font-size & responsive-font-size mixin uses RFS to rescale font sizes\n@mixin font-size($fs, $important: false) {\n  @include rfs($fs, $important);\n}\n\n@mixin responsive-font-size($fs, $important: false) {\n  @include rfs($fs, $important);\n}\n","// Hover mixin and `$enable-hover-media-query` are deprecated.\n//\n// Originally added during our alphas and maintained during betas, this mixin was\n// designed to prevent `:hover` stickiness on iOS-an issue where hover styles\n// would persist after initial touch.\n//\n// For backward compatibility, we've kept these mixins and updated them to\n// always return their regular pseudo-classes instead of a shimmed media query.\n//\n// Issue: https://github.com/twbs/bootstrap/issues/25195\n\n@mixin hover() {\n  &:hover { @content; }\n}\n\n@mixin hover-focus() {\n  &:hover,\n  &:focus {\n    @content;\n  }\n}\n\n@mixin plain-hover-focus() {\n  &,\n  &:hover,\n  &:focus {\n    @content;\n  }\n}\n\n@mixin hover-focus-active() {\n  &:hover,\n  &:focus,\n  &:active {\n    @content;\n  }\n}\n","// stylelint-disable declaration-no-important, selector-list-comma-newline-after\n\n//\n// Headings\n//\n\nh1, h2, h3, h4, h5, h6,\n.h1, .h2, .h3, .h4, .h5, .h6 {\n  margin-bottom: $headings-margin-bottom;\n  font-family: $headings-font-family;\n  font-weight: $headings-font-weight;\n  line-height: $headings-line-height;\n  color: $headings-color;\n}\n\nh1, .h1 { @include font-size($h1-font-size); }\nh2, .h2 { @include font-size($h2-font-size); }\nh3, .h3 { @include font-size($h3-font-size); }\nh4, .h4 { @include font-size($h4-font-size); }\nh5, .h5 { @include font-size($h5-font-size); }\nh6, .h6 { @include font-size($h6-font-size); }\n\n.lead {\n  @include font-size($lead-font-size);\n  font-weight: $lead-font-weight;\n}\n\n// Type display classes\n.display-1 {\n  @include font-size($display1-size);\n  font-weight: $display1-weight;\n  line-height: $display-line-height;\n}\n.display-2 {\n  @include font-size($display2-size);\n  font-weight: $display2-weight;\n  line-height: $display-line-height;\n}\n.display-3 {\n  @include font-size($display3-size);\n  font-weight: $display3-weight;\n  line-height: $display-line-height;\n}\n.display-4 {\n  @include font-size($display4-size);\n  font-weight: $display4-weight;\n  line-height: $display-line-height;\n}\n\n\n//\n// Horizontal rules\n//\n\nhr {\n  margin-top: $hr-margin-y;\n  margin-bottom: $hr-margin-y;\n  border: 0;\n  border-top: $hr-border-width solid $hr-border-color;\n}\n\n\n//\n// Emphasis\n//\n\nsmall,\n.small {\n  @include font-size($small-font-size);\n  font-weight: $font-weight-normal;\n}\n\nmark,\n.mark {\n  padding: $mark-padding;\n  background-color: $mark-bg;\n}\n\n\n//\n// Lists\n//\n\n.list-unstyled {\n  @include list-unstyled();\n}\n\n// Inline turns list items into inline-block\n.list-inline {\n  @include list-unstyled();\n}\n.list-inline-item {\n  display: inline-block;\n\n  &:not(:last-child) {\n    margin-right: $list-inline-padding;\n  }\n}\n\n\n//\n// Misc\n//\n\n// Builds on `abbr`\n.initialism {\n  @include font-size(90%);\n  text-transform: uppercase;\n}\n\n// Blockquotes\n.blockquote {\n  margin-bottom: $spacer;\n  @include font-size($blockquote-font-size);\n}\n\n.blockquote-footer {\n  display: block;\n  @include font-size($blockquote-small-font-size);\n  color: $blockquote-small-color;\n\n  &::before {\n    content: \"\\2014\\00A0\"; // em dash, nbsp\n  }\n}\n","// Lists\n\n// Unstyled keeps list items block level, just removes default browser padding and list-style\n@mixin list-unstyled() {\n  padding-left: 0;\n  list-style: none;\n}\n","// Responsive images (ensure images don't scale beyond their parents)\n//\n// This is purposefully opt-in via an explicit class rather than being the default for all ``s.\n// We previously tried the \"images are responsive by default\" approach in Bootstrap v2,\n// and abandoned it in Bootstrap v3 because it breaks lots of third-party widgets (including Google Maps)\n// which weren't expecting the images within themselves to be involuntarily resized.\n// See also https://github.com/twbs/bootstrap/issues/18178\n.img-fluid {\n  @include img-fluid();\n}\n\n\n// Image thumbnails\n.img-thumbnail {\n  padding: $thumbnail-padding;\n  background-color: $thumbnail-bg;\n  border: $thumbnail-border-width solid $thumbnail-border-color;\n  @include border-radius($thumbnail-border-radius);\n  @include box-shadow($thumbnail-box-shadow);\n\n  // Keep them at most 100% wide\n  @include img-fluid();\n}\n\n//\n// Figures\n//\n\n.figure {\n  // Ensures the caption's text aligns with the image.\n  display: inline-block;\n}\n\n.figure-img {\n  margin-bottom: $spacer / 2;\n  line-height: 1;\n}\n\n.figure-caption {\n  @include font-size($figure-caption-font-size);\n  color: $figure-caption-color;\n}\n","// Image Mixins\n// - Responsive image\n// - Retina image\n\n\n// Responsive image\n//\n// Keep images from scaling beyond the width of their parents.\n\n@mixin img-fluid() {\n  // Part 1: Set a maximum relative to the parent\n  max-width: 100%;\n  // Part 2: Override the height to auto, otherwise images will be stretched\n  // when setting a width and height attribute on the img element.\n  height: auto;\n}\n\n\n// Retina image\n//\n// Short retina mixin for setting background-image and -size.\n\n@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {\n  background-image: url($file-1x);\n\n  // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,\n  // but doesn't convert dppx=>dpi.\n  // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.\n  // Compatibility info: https://caniuse.com/#feat=css-media-resolution\n  @media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx\n    only screen and (min-resolution: 2dppx) { // Standardized\n    background-image: url($file-2x);\n    background-size: $width-1x $height-1x;\n  }\n  @include deprecate(\"`img-retina()`\", \"v4.3.0\", \"v5\");\n}\n","// Inline code\ncode {\n  @include font-size($code-font-size);\n  color: $code-color;\n  word-wrap: break-word;\n\n  // Streamline the style when inside anchors to avoid broken underline and more\n  a > & {\n    color: inherit;\n  }\n}\n\n// User input typically entered via keyboard\nkbd {\n  padding: $kbd-padding-y $kbd-padding-x;\n  @include font-size($kbd-font-size);\n  color: $kbd-color;\n  background-color: $kbd-bg;\n  @include border-radius($border-radius-sm);\n  @include box-shadow($kbd-box-shadow);\n\n  kbd {\n    padding: 0;\n    @include font-size(100%);\n    font-weight: $nested-kbd-font-weight;\n    @include box-shadow(none);\n  }\n}\n\n// Blocks of code\npre {\n  display: block;\n  @include font-size($code-font-size);\n  color: $pre-color;\n\n  // Account for some code outputs that place code tags in pre tags\n  code {\n    @include font-size(inherit);\n    color: inherit;\n    word-break: normal;\n  }\n}\n\n// Enable scrollable blocks of code\n.pre-scrollable {\n  max-height: $pre-scrollable-max-height;\n  overflow-y: scroll;\n}\n","// Container widths\n//\n// Set the container width, and override it for fixed navbars in media queries.\n\n@if $enable-grid-classes {\n  // Single container class with breakpoint max-widths\n  .container {\n    @include make-container();\n    @include make-container-max-widths();\n  }\n\n  // 100% wide container at all breakpoints\n  .container-fluid {\n    @include make-container();\n  }\n\n  // Responsive containers that are 100% wide until a breakpoint\n  @each $breakpoint, $container-max-width in $container-max-widths {\n    .container-#{$breakpoint} {\n      @extend .container-fluid;\n    }\n\n    @include media-breakpoint-up($breakpoint, $grid-breakpoints) {\n      %responsive-container-#{$breakpoint} {\n        max-width: $container-max-width;\n      }\n\n      @each $name, $width in $grid-breakpoints {\n        @if ($container-max-width > $width or $breakpoint == $name) {\n          .container#{breakpoint-infix($name, $grid-breakpoints)} {\n            @extend %responsive-container-#{$breakpoint};\n          }\n        }\n      }\n    }\n  }\n}\n\n\n// Row\n//\n// Rows contain your columns.\n\n@if $enable-grid-classes {\n  .row {\n    @include make-row();\n  }\n\n  // Remove the negative margin from default .row, then the horizontal padding\n  // from all immediate children columns (to prevent runaway style inheritance).\n  .no-gutters {\n    margin-right: 0;\n    margin-left: 0;\n\n    > .col,\n    > [class*=\"col-\"] {\n      padding-right: 0;\n      padding-left: 0;\n    }\n  }\n}\n\n// Columns\n//\n// Common styles for small and large grid columns\n\n@if $enable-grid-classes {\n  @include make-grid-columns();\n}\n","/// Grid system\n//\n// Generate semantic grid columns with these mixins.\n\n@mixin make-container($gutter: $grid-gutter-width) {\n  width: 100%;\n  padding-right: $gutter / 2;\n  padding-left: $gutter / 2;\n  margin-right: auto;\n  margin-left: auto;\n}\n\n\n// For each breakpoint, define the maximum width of the container in a media query\n@mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {\n  @each $breakpoint, $container-max-width in $max-widths {\n    @include media-breakpoint-up($breakpoint, $breakpoints) {\n      max-width: $container-max-width;\n    }\n  }\n}\n\n@mixin make-row($gutter: $grid-gutter-width) {\n  display: flex;\n  flex-wrap: wrap;\n  margin-right: -$gutter / 2;\n  margin-left: -$gutter / 2;\n}\n\n@mixin make-col-ready($gutter: $grid-gutter-width) {\n  position: relative;\n  // Prevent columns from becoming too narrow when at smaller grid tiers by\n  // always setting `width: 100%;`. This works because we use `flex` values\n  // later on to override this initial width.\n  width: 100%;\n  padding-right: $gutter / 2;\n  padding-left: $gutter / 2;\n}\n\n@mixin make-col($size, $columns: $grid-columns) {\n  flex: 0 0 percentage($size / $columns);\n  // Add a `max-width` to ensure content within each column does not blow out\n  // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari\n  // do not appear to require this.\n  max-width: percentage($size / $columns);\n}\n\n@mixin make-col-auto() {\n  flex: 0 0 auto;\n  width: auto;\n  max-width: 100%; // Reset earlier grid tiers\n}\n\n@mixin make-col-offset($size, $columns: $grid-columns) {\n  $num: $size / $columns;\n  margin-left: if($num == 0, 0, percentage($num));\n}\n\n// Row columns\n//\n// Specify on a parent element(e.g., .row) to force immediate children into NN\n// numberof columns. Supports wrapping to new lines, but does not do a Masonry\n// style grid.\n@mixin row-cols($count) {\n  & > * {\n    flex: 0 0 100% / $count;\n    max-width: 100% / $count;\n  }\n}\n","// Breakpoint viewport sizes and media queries.\n//\n// Breakpoints are defined as a map of (name: minimum width), order from small to large:\n//\n//    (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)\n//\n// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.\n\n// Name of the next breakpoint, or null for the last breakpoint.\n//\n//    >> breakpoint-next(sm)\n//    md\n//    >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    md\n//    >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))\n//    md\n@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {\n  $n: index($breakpoint-names, $name);\n  @return if($n != null and $n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);\n}\n\n// Minimum breakpoint width. Null for the smallest (first) breakpoint.\n//\n//    >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    576px\n@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {\n  $min: map-get($breakpoints, $name);\n  @return if($min != 0, $min, null);\n}\n\n// Maximum breakpoint width. Null for the largest (last) breakpoint.\n// The maximum value is calculated as the minimum of the next one less 0.02px\n// to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.\n// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max\n// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.\n// See https://bugs.webkit.org/show_bug.cgi?id=178261\n//\n//    >> breakpoint-max(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    767.98px\n@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {\n  $next: breakpoint-next($name, $breakpoints);\n  @return if($next, breakpoint-min($next, $breakpoints) - .02, null);\n}\n\n// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.\n// Useful for making responsive utilities.\n//\n//    >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    \"\"  (Returns a blank string)\n//    >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))\n//    \"-sm\"\n@function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {\n  @return if(breakpoint-min($name, $breakpoints) == null, \"\", \"-#{$name}\");\n}\n\n// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.\n// Makes the @content apply to the given breakpoint and wider.\n@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {\n  $min: breakpoint-min($name, $breakpoints);\n  @if $min {\n    @media (min-width: $min) {\n      @content;\n    }\n  } @else {\n    @content;\n  }\n}\n\n// Media of at most the maximum breakpoint width. No query for the largest breakpoint.\n// Makes the @content apply to the given breakpoint and narrower.\n@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {\n  $max: breakpoint-max($name, $breakpoints);\n  @if $max {\n    @media (max-width: $max) {\n      @content;\n    }\n  } @else {\n    @content;\n  }\n}\n\n// Media that spans multiple breakpoint widths.\n// Makes the @content apply between the min and max breakpoints\n@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {\n  $min: breakpoint-min($lower, $breakpoints);\n  $max: breakpoint-max($upper, $breakpoints);\n\n  @if $min != null and $max != null {\n    @media (min-width: $min) and (max-width: $max) {\n      @content;\n    }\n  } @else if $max == null {\n    @include media-breakpoint-up($lower, $breakpoints) {\n      @content;\n    }\n  } @else if $min == null {\n    @include media-breakpoint-down($upper, $breakpoints) {\n      @content;\n    }\n  }\n}\n\n// Media between the breakpoint's minimum and maximum widths.\n// No minimum for the smallest breakpoint, and no maximum for the largest one.\n// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.\n@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {\n  $min: breakpoint-min($name, $breakpoints);\n  $max: breakpoint-max($name, $breakpoints);\n\n  @if $min != null and $max != null {\n    @media (min-width: $min) and (max-width: $max) {\n      @content;\n    }\n  } @else if $max == null {\n    @include media-breakpoint-up($name, $breakpoints) {\n      @content;\n    }\n  } @else if $min == null {\n    @include media-breakpoint-down($name, $breakpoints) {\n      @content;\n    }\n  }\n}\n","// Framework grid generation\n//\n// Used only by Bootstrap to generate the correct number of grid classes given\n// any value of `$grid-columns`.\n\n@mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {\n  // Common properties for all breakpoints\n  %grid-column {\n    position: relative;\n    width: 100%;\n    padding-right: $gutter / 2;\n    padding-left: $gutter / 2;\n  }\n\n  @each $breakpoint in map-keys($breakpoints) {\n    $infix: breakpoint-infix($breakpoint, $breakpoints);\n\n    // Allow columns to stretch full width below their breakpoints\n    @for $i from 1 through $columns {\n      .col#{$infix}-#{$i} {\n        @extend %grid-column;\n      }\n    }\n    .col#{$infix},\n    .col#{$infix}-auto {\n      @extend %grid-column;\n    }\n\n    @include media-breakpoint-up($breakpoint, $breakpoints) {\n      // Provide basic `.col-{bp}` classes for equal-width flexbox columns\n      .col#{$infix} {\n        flex-basis: 0;\n        flex-grow: 1;\n        max-width: 100%;\n      }\n\n      @for $i from 1 through $grid-row-columns {\n        .row-cols#{$infix}-#{$i} {\n          @include row-cols($i);\n        }\n      }\n\n      .col#{$infix}-auto {\n        @include make-col-auto();\n      }\n\n      @for $i from 1 through $columns {\n        .col#{$infix}-#{$i} {\n          @include make-col($i, $columns);\n        }\n      }\n\n      .order#{$infix}-first { order: -1; }\n\n      .order#{$infix}-last { order: $columns + 1; }\n\n      @for $i from 0 through $columns {\n        .order#{$infix}-#{$i} { order: $i; }\n      }\n\n      // `$columns - 1` because offsetting by the width of an entire row isn't possible\n      @for $i from 0 through ($columns - 1) {\n        @if not ($infix == \"\" and $i == 0) { // Avoid emitting useless .offset-0\n          .offset#{$infix}-#{$i} {\n            @include make-col-offset($i, $columns);\n          }\n        }\n      }\n    }\n  }\n}\n","//\n// Basic Bootstrap table\n//\n\n.table {\n  width: 100%;\n  margin-bottom: $spacer;\n  color: $table-color;\n  background-color: $table-bg; // Reset for nesting within parents with `background-color`.\n\n  th,\n  td {\n    padding: $table-cell-padding;\n    vertical-align: top;\n    border-top: $table-border-width solid $table-border-color;\n  }\n\n  thead th {\n    vertical-align: bottom;\n    border-bottom: (2 * $table-border-width) solid $table-border-color;\n  }\n\n  tbody + tbody {\n    border-top: (2 * $table-border-width) solid $table-border-color;\n  }\n}\n\n\n//\n// Condensed table w/ half padding\n//\n\n.table-sm {\n  th,\n  td {\n    padding: $table-cell-padding-sm;\n  }\n}\n\n\n// Border versions\n//\n// Add or remove borders all around the table and between all the columns.\n\n.table-bordered {\n  border: $table-border-width solid $table-border-color;\n\n  th,\n  td {\n    border: $table-border-width solid $table-border-color;\n  }\n\n  thead {\n    th,\n    td {\n      border-bottom-width: 2 * $table-border-width;\n    }\n  }\n}\n\n.table-borderless {\n  th,\n  td,\n  thead th,\n  tbody + tbody {\n    border: 0;\n  }\n}\n\n// Zebra-striping\n//\n// Default zebra-stripe styles (alternating gray and transparent backgrounds)\n\n.table-striped {\n  tbody tr:nth-of-type(#{$table-striped-order}) {\n    background-color: $table-accent-bg;\n  }\n}\n\n\n// Hover effect\n//\n// Placed here since it has to come after the potential zebra striping\n\n.table-hover {\n  tbody tr {\n    @include hover() {\n      color: $table-hover-color;\n      background-color: $table-hover-bg;\n    }\n  }\n}\n\n\n// Table backgrounds\n//\n// Exact selectors below required to override `.table-striped` and prevent\n// inheritance to nested tables.\n\n@each $color, $value in $theme-colors {\n  @include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level));\n}\n\n@include table-row-variant(active, $table-active-bg);\n\n\n// Dark styles\n//\n// Same table markup, but inverted color scheme: dark background and light text.\n\n// stylelint-disable-next-line no-duplicate-selectors\n.table {\n  .thead-dark {\n    th {\n      color: $table-dark-color;\n      background-color: $table-dark-bg;\n      border-color: $table-dark-border-color;\n    }\n  }\n\n  .thead-light {\n    th {\n      color: $table-head-color;\n      background-color: $table-head-bg;\n      border-color: $table-border-color;\n    }\n  }\n}\n\n.table-dark {\n  color: $table-dark-color;\n  background-color: $table-dark-bg;\n\n  th,\n  td,\n  thead th {\n    border-color: $table-dark-border-color;\n  }\n\n  &.table-bordered {\n    border: 0;\n  }\n\n  &.table-striped {\n    tbody tr:nth-of-type(#{$table-striped-order}) {\n      background-color: $table-dark-accent-bg;\n    }\n  }\n\n  &.table-hover {\n    tbody tr {\n      @include hover() {\n        color: $table-dark-hover-color;\n        background-color: $table-dark-hover-bg;\n      }\n    }\n  }\n}\n\n\n// Responsive tables\n//\n// Generate series of `.table-responsive-*` classes for configuring the screen\n// size of where your table will overflow.\n\n.table-responsive {\n  @each $breakpoint in map-keys($grid-breakpoints) {\n    $next: breakpoint-next($breakpoint, $grid-breakpoints);\n    $infix: breakpoint-infix($next, $grid-breakpoints);\n\n    &#{$infix} {\n      @include media-breakpoint-down($breakpoint) {\n        display: block;\n        width: 100%;\n        overflow-x: auto;\n        -webkit-overflow-scrolling: touch;\n\n        // Prevent double border on horizontal scroll due to use of `display: block;`\n        > .table-bordered {\n          border: 0;\n        }\n      }\n    }\n  }\n}\n","// Tables\n\n@mixin table-row-variant($state, $background, $border: null) {\n  // Exact selectors below required to override `.table-striped` and prevent\n  // inheritance to nested tables.\n  .table-#{$state} {\n    &,\n    > th,\n    > td {\n      background-color: $background;\n    }\n\n    @if $border != null {\n      th,\n      td,\n      thead th,\n      tbody + tbody {\n        border-color: $border;\n      }\n    }\n  }\n\n  // Hover states for `.table-hover`\n  // Note: this is not available for cells or rows within `thead` or `tfoot`.\n  .table-hover {\n    $hover-background: darken($background, 5%);\n\n    .table-#{$state} {\n      @include hover() {\n        background-color: $hover-background;\n\n        > td,\n        > th {\n          background-color: $hover-background;\n        }\n      }\n    }\n  }\n}\n","// stylelint-disable selector-no-qualifying-type\n\n//\n// Textual form controls\n//\n\n.form-control {\n  display: block;\n  width: 100%;\n  height: $input-height;\n  padding: $input-padding-y $input-padding-x;\n  font-family: $input-font-family;\n  @include font-size($input-font-size);\n  font-weight: $input-font-weight;\n  line-height: $input-line-height;\n  color: $input-color;\n  background-color: $input-bg;\n  background-clip: padding-box;\n  border: $input-border-width solid $input-border-color;\n\n  // Note: This has no effect on `s in CSS.\n  @include border-radius($input-border-radius, 0);\n\n  @include box-shadow($input-box-shadow);\n  @include transition($input-transition);\n\n  // Unstyle the caret on ` receives focus\n    // in IE and (under certain conditions) Edge, as it looks bad and cannot be made to\n    // match the appearance of the native widget.\n    // See https://github.com/twbs/bootstrap/issues/19398.\n    color: $input-color;\n    background-color: $input-bg;\n  }\n}\n\n// Make file inputs better match text inputs by forcing them to new lines.\n.form-control-file,\n.form-control-range {\n  display: block;\n  width: 100%;\n}\n\n\n//\n// Labels\n//\n\n// For use with horizontal and inline forms, when you need the label (or legend)\n// text to align with the form controls.\n.col-form-label {\n  padding-top: add($input-padding-y, $input-border-width);\n  padding-bottom: add($input-padding-y, $input-border-width);\n  margin-bottom: 0; // Override the `

+
+    

+
+        

+            

+            
+
+

+
+    

+        
+        
First Test

+        
+
+
+        
+    

+
+    

+
+    
+
+

+
+
+
+    
+    
+    
This is your index page. You can edit its contents at docs/01-index.hbs

+
+    
+
+
+

+
+
+
+    

+
+

+
+
+            

+        

+
+        

+        
+        

+            
+
+        

+    

+

+
+
+
+
+
+
+
+
+
+
diff --git a/jiffy-lube.svg b/jiffy-lube.svg
new file mode 100644
index 0000000..162a4c8
--- /dev/null
+++ b/jiffy-lube.svg
@@ -0,0 +1,9 @@
+
+    
+        
+        
+        
+        
+        
+    
+
diff --git a/js.0e7c6ad9.js b/js.0e7c6ad9.js
new file mode 100644
index 0000000..a6e8111
--- /dev/null
+++ b/js.0e7c6ad9.js
@@ -0,0 +1,16814 @@
+// modules are defined as an array
+// [ module function, map of requires ]
+//
+// map of requires is short require name -> numeric require
+//
+// anything defined in a previous bundle is accessed via the
+// orig method which is the require for previous bundles
+parcelRequire = (function (modules, cache, entry, globalName) {
+  // Save the require from previous bundle to this closure if any
+  var previousRequire = typeof parcelRequire === 'function' && parcelRequire;
+  var nodeRequire = typeof require === 'function' && require;
+
+  function newRequire(name, jumped) {
+    if (!cache[name]) {
+      if (!modules[name]) {
+        // if we cannot find the module within our internal map or
+        // cache jump to the current global require ie. the last bundle
+        // that was added to the page.
+        var currentRequire = typeof parcelRequire === 'function' && parcelRequire;
+        if (!jumped && currentRequire) {
+          return currentRequire(name, true);
+        }
+
+        // If there are other bundles on this page the require from the
+        // previous one is saved to 'previousRequire'. Repeat this as
+        // many times as there are bundles until the module is found or
+        // we exhaust the require chain.
+        if (previousRequire) {
+          return previousRequire(name, true);
+        }
+
+        // Try the node require function if it exists.
+        if (nodeRequire && typeof name === 'string') {
+          return nodeRequire(name);
+        }
+
+        var err = new Error('Cannot find module \'' + name + '\'');
+        err.code = 'MODULE_NOT_FOUND';
+        throw err;
+      }
+
+      localRequire.resolve = resolve;
+      localRequire.cache = {};
+
+      var module = cache[name] = new newRequire.Module(name);
+
+      modules[name][0].call(module.exports, localRequire, module, module.exports, this);
+    }
+
+    return cache[name].exports;
+
+    function localRequire(x){
+      return newRequire(localRequire.resolve(x));
+    }
+
+    function resolve(x){
+      return modules[name][1][x] || x;
+    }
+  }
+
+  function Module(moduleName) {
+    this.id = moduleName;
+    this.bundle = newRequire;
+    this.exports = {};
+  }
+
+  newRequire.isParcelRequire = true;
+  newRequire.Module = Module;
+  newRequire.modules = modules;
+  newRequire.cache = cache;
+  newRequire.parent = previousRequire;
+  newRequire.register = function (id, exports) {
+    modules[id] = [function (require, module) {
+      module.exports = exports;
+    }, {}];
+  };
+
+  var error;
+  for (var i = 0; i < entry.length; i++) {
+    try {
+      newRequire(entry[i]);
+    } catch (e) {
+      // Save first error but execute all entries
+      if (!error) {
+        error = e;
+      }
+    }
+  }
+
+  if (entry.length) {
+    // Expose entry point to Node, AMD or browser globals
+    // Based on https://github.com/ForbesLindesay/umd/blob/master/template.js
+    var mainExports = newRequire(entry[entry.length - 1]);
+
+    // CommonJS
+    if (typeof exports === "object" && typeof module !== "undefined") {
+      module.exports = mainExports;
+
+    // RequireJS
+    } else if (typeof define === "function" && define.amd) {
+     define(function () {
+       return mainExports;
+     });
+
+    //