@charset "UTF-8";
/*
 *	Level8 MLS Framework Global SCSS
 *	Add globally accessible vars, settings, mixins, extends, and libraries to base imports
 *	Layout-specific files should be added to layout imports
 *	Global components should be added to component imports (sliders, carousels, etc)
 */
/*
 *	BASE IMPORTS
 */
/* BASE VARS - must come first */
/* FONT AWESOME SASS BUILD */
/*!
 *  Font Awesome 4.5.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
/*
* Comment out unnecessary components on a per-project basis
* Retain the same order, do not change @import order of files
*/
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: "FontAwesome";
  src: url("/common/fonts/fontawesome-4.5.0/fontawesome-webfont.eot?v=4.5.0");
  src: url("/common/fonts/fontawesome-4.5.0/fontawesome-webfont.eot?#iefix&v=4.5.0") format("embedded-opentype"), url("/common/fonts/fontawesome-4.5.0/fontawesome-webfont.woff2?v=4.5.0") format("woff2"), url("/common/fonts/fontawesome-4.5.0/fontawesome-webfont.woff?v=4.5.0") format("woff"), url("/common/fonts/fontawesome-4.5.0/fontawesome-webfont.ttf?v=4.5.0") format("truetype"), url("/common/fonts/fontawesome-4.5.0/fontawesome-webfont.svg?v=4.5.0#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
.fa {
  display: inline-block;
  font: normal normal normal 16px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* makes the font 33% larger relative to the icon container */
.fa-lg {
  font-size: 1.3333333333em;
  line-height: 0.75em;
  vertical-align: -15%;
}

.fa-2x {
  font-size: 2em;
}

.fa-3x {
  font-size: 3em;
}

.fa-4x {
  font-size: 4em;
}

.fa-5x {
  font-size: 5em;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.fa-glass:before {
  content: "\f000";
}

.fa-music:before {
  content: "\f001";
}

.fa-search:before {
  content: "\f002";
}

.fa-envelope-o:before {
  content: "\f003";
}

.fa-heart:before {
  content: "\f004";
}

.fa-star:before {
  content: "\f005";
}

.fa-star-o:before {
  content: "\f006";
}

.fa-user:before {
  content: "\f007";
}

.fa-film:before {
  content: "\f008";
}

.fa-th-large:before {
  content: "\f009";
}

.fa-th:before {
  content: "\f00a";
}

.fa-th-list:before {
  content: "\f00b";
}

.fa-check:before {
  content: "\f00c";
}

.fa-remove:before,
.fa-close:before,
.fa-times:before {
  content: "\f00d";
}

.fa-search-plus:before {
  content: "\f00e";
}

.fa-search-minus:before {
  content: "\f010";
}

.fa-power-off:before {
  content: "\f011";
}

.fa-signal:before {
  content: "\f012";
}

.fa-gear:before,
.fa-cog:before {
  content: "\f013";
}

.fa-trash-o:before {
  content: "\f014";
}

.fa-home:before {
  content: "\f015";
}

.fa-file-o:before {
  content: "\f016";
}

.fa-clock-o:before {
  content: "\f017";
}

.fa-road:before {
  content: "\f018";
}

.fa-download:before {
  content: "\f019";
}

.fa-arrow-circle-o-down:before {
  content: "\f01a";
}

.fa-arrow-circle-o-up:before {
  content: "\f01b";
}

.fa-inbox:before {
  content: "\f01c";
}

.fa-play-circle-o:before {
  content: "\f01d";
}

.fa-rotate-right:before,
.fa-repeat:before {
  content: "\f01e";
}

.fa-refresh:before {
  content: "\f021";
}

.fa-list-alt:before {
  content: "\f022";
}

.fa-lock:before {
  content: "\f023";
}

.fa-flag:before {
  content: "\f024";
}

.fa-headphones:before {
  content: "\f025";
}

.fa-volume-off:before {
  content: "\f026";
}

.fa-volume-down:before {
  content: "\f027";
}

.fa-volume-up:before {
  content: "\f028";
}

.fa-qrcode:before {
  content: "\f029";
}

.fa-barcode:before {
  content: "\f02a";
}

.fa-tag:before {
  content: "\f02b";
}

.fa-tags:before {
  content: "\f02c";
}

.fa-book:before {
  content: "\f02d";
}

.fa-bookmark:before {
  content: "\f02e";
}

.fa-print:before {
  content: "\f02f";
}

.fa-camera:before {
  content: "\f030";
}

.fa-font:before {
  content: "\f031";
}

.fa-bold:before {
  content: "\f032";
}

.fa-italic:before {
  content: "\f033";
}

.fa-text-height:before {
  content: "\f034";
}

.fa-text-width:before {
  content: "\f035";
}

.fa-align-left:before {
  content: "\f036";
}

.fa-align-center:before {
  content: "\f037";
}

.fa-align-right:before {
  content: "\f038";
}

.fa-align-justify:before {
  content: "\f039";
}

.fa-list:before {
  content: "\f03a";
}

.fa-dedent:before,
.fa-outdent:before {
  content: "\f03b";
}

.fa-indent:before {
  content: "\f03c";
}

.fa-video-camera:before {
  content: "\f03d";
}

.fa-photo:before,
.fa-image:before,
.fa-picture-o:before {
  content: "\f03e";
}

.fa-pencil:before {
  content: "\f040";
}

.fa-map-marker:before {
  content: "\f041";
}

.fa-adjust:before {
  content: "\f042";
}

.fa-tint:before {
  content: "\f043";
}

.fa-edit:before,
.fa-pencil-square-o:before {
  content: "\f044";
}

.fa-share-square-o:before {
  content: "\f045";
}

.fa-check-square-o:before {
  content: "\f046";
}

.fa-arrows:before {
  content: "\f047";
}

.fa-step-backward:before {
  content: "\f048";
}

.fa-fast-backward:before {
  content: "\f049";
}

.fa-backward:before {
  content: "\f04a";
}

.fa-play:before {
  content: "\f04b";
}

.fa-pause:before {
  content: "\f04c";
}

.fa-stop:before {
  content: "\f04d";
}

.fa-forward:before {
  content: "\f04e";
}

.fa-fast-forward:before {
  content: "\f050";
}

.fa-step-forward:before {
  content: "\f051";
}

.fa-eject:before {
  content: "\f052";
}

.fa-chevron-left:before {
  content: "\f053";
}

.fa-chevron-right:before {
  content: "\f054";
}

.fa-plus-circle:before {
  content: "\f055";
}

.fa-minus-circle:before {
  content: "\f056";
}

.fa-times-circle:before {
  content: "\f057";
}

.fa-check-circle:before {
  content: "\f058";
}

.fa-question-circle:before {
  content: "\f059";
}

.fa-info-circle:before {
  content: "\f05a";
}

.fa-crosshairs:before {
  content: "\f05b";
}

.fa-times-circle-o:before {
  content: "\f05c";
}

.fa-check-circle-o:before {
  content: "\f05d";
}

.fa-ban:before {
  content: "\f05e";
}

.fa-arrow-left:before {
  content: "\f060";
}

.fa-arrow-right:before {
  content: "\f061";
}

.fa-arrow-up:before {
  content: "\f062";
}

.fa-arrow-down:before {
  content: "\f063";
}

.fa-mail-forward:before,
.fa-share:before {
  content: "\f064";
}

.fa-expand:before {
  content: "\f065";
}

.fa-compress:before {
  content: "\f066";
}

.fa-plus:before {
  content: "\f067";
}

.fa-minus:before {
  content: "\f068";
}

.fa-asterisk:before {
  content: "\f069";
}

.fa-exclamation-circle:before {
  content: "\f06a";
}

.fa-gift:before {
  content: "\f06b";
}

.fa-leaf:before {
  content: "\f06c";
}

.fa-fire:before {
  content: "\f06d";
}

.fa-eye:before {
  content: "\f06e";
}

.fa-eye-slash:before {
  content: "\f070";
}

.fa-warning:before,
.fa-exclamation-triangle:before {
  content: "\f071";
}

.fa-plane:before {
  content: "\f072";
}

.fa-calendar:before {
  content: "\f073";
}

.fa-random:before {
  content: "\f074";
}

.fa-comment:before {
  content: "\f075";
}

.fa-magnet:before {
  content: "\f076";
}

.fa-chevron-up:before {
  content: "\f077";
}

.fa-chevron-down:before {
  content: "\f078";
}

.fa-retweet:before {
  content: "\f079";
}

.fa-shopping-cart:before {
  content: "\f07a";
}

.fa-folder:before {
  content: "\f07b";
}

.fa-folder-open:before {
  content: "\f07c";
}

.fa-arrows-v:before {
  content: "\f07d";
}

.fa-arrows-h:before {
  content: "\f07e";
}

.fa-bar-chart-o:before,
.fa-bar-chart:before {
  content: "\f080";
}

.fa-twitter-square:before {
  content: "\f081";
}

.fa-facebook-square:before {
  content: "\f082";
}

.fa-camera-retro:before {
  content: "\f083";
}

.fa-key:before {
  content: "\f084";
}

.fa-gears:before,
.fa-cogs:before {
  content: "\f085";
}

.fa-comments:before {
  content: "\f086";
}

.fa-thumbs-o-up:before {
  content: "\f087";
}

.fa-thumbs-o-down:before {
  content: "\f088";
}

.fa-star-half:before {
  content: "\f089";
}

.fa-heart-o:before {
  content: "\f08a";
}

.fa-sign-out:before {
  content: "\f08b";
}

.fa-linkedin-square:before {
  content: "\f08c";
}

.fa-thumb-tack:before {
  content: "\f08d";
}

.fa-external-link:before {
  content: "\f08e";
}

.fa-sign-in:before {
  content: "\f090";
}

.fa-trophy:before {
  content: "\f091";
}

.fa-github-square:before {
  content: "\f092";
}

.fa-upload:before {
  content: "\f093";
}

.fa-lemon-o:before {
  content: "\f094";
}

.fa-phone:before {
  content: "\f095";
}

.fa-square-o:before {
  content: "\f096";
}

.fa-bookmark-o:before {
  content: "\f097";
}

.fa-phone-square:before {
  content: "\f098";
}

.fa-twitter:before {
  content: "\f099";
}

.fa-facebook-f:before,
.fa-facebook:before {
  content: "\f09a";
}

.fa-github:before {
  content: "\f09b";
}

.fa-unlock:before {
  content: "\f09c";
}

.fa-credit-card:before {
  content: "\f09d";
}

.fa-feed:before,
.fa-rss:before {
  content: "\f09e";
}

.fa-hdd-o:before {
  content: "\f0a0";
}

.fa-bullhorn:before {
  content: "\f0a1";
}

.fa-bell:before {
  content: "\f0f3";
}

.fa-certificate:before {
  content: "\f0a3";
}

.fa-hand-o-right:before {
  content: "\f0a4";
}

.fa-hand-o-left:before {
  content: "\f0a5";
}

.fa-hand-o-up:before {
  content: "\f0a6";
}

.fa-hand-o-down:before {
  content: "\f0a7";
}

.fa-arrow-circle-left:before {
  content: "\f0a8";
}

.fa-arrow-circle-right:before {
  content: "\f0a9";
}

.fa-arrow-circle-up:before {
  content: "\f0aa";
}

.fa-arrow-circle-down:before {
  content: "\f0ab";
}

.fa-globe:before {
  content: "\f0ac";
}

.fa-wrench:before {
  content: "\f0ad";
}

.fa-tasks:before {
  content: "\f0ae";
}

.fa-filter:before {
  content: "\f0b0";
}

.fa-briefcase:before {
  content: "\f0b1";
}

.fa-arrows-alt:before {
  content: "\f0b2";
}

.fa-group:before,
.fa-users:before {
  content: "\f0c0";
}

.fa-chain:before,
.fa-link:before {
  content: "\f0c1";
}

.fa-cloud:before {
  content: "\f0c2";
}

.fa-flask:before {
  content: "\f0c3";
}

.fa-cut:before,
.fa-scissors:before {
  content: "\f0c4";
}

.fa-copy:before,
.fa-files-o:before {
  content: "\f0c5";
}

.fa-paperclip:before {
  content: "\f0c6";
}

.fa-save:before,
.fa-floppy-o:before {
  content: "\f0c7";
}

.fa-square:before {
  content: "\f0c8";
}

.fa-navicon:before,
.fa-reorder:before,
.fa-bars:before {
  content: "\f0c9";
}

.fa-list-ul:before {
  content: "\f0ca";
}

.fa-list-ol:before {
  content: "\f0cb";
}

.fa-strikethrough:before {
  content: "\f0cc";
}

.fa-underline:before {
  content: "\f0cd";
}

.fa-table:before {
  content: "\f0ce";
}

.fa-magic:before {
  content: "\f0d0";
}

.fa-truck:before {
  content: "\f0d1";
}

.fa-pinterest:before {
  content: "\f0d2";
}

.fa-pinterest-square:before {
  content: "\f0d3";
}

.fa-google-plus-square:before {
  content: "\f0d4";
}

.fa-google-plus:before {
  content: "\f0d5";
}

.fa-money:before {
  content: "\f0d6";
}

.fa-caret-down:before {
  content: "\f0d7";
}

.fa-caret-up:before {
  content: "\f0d8";
}

.fa-caret-left:before {
  content: "\f0d9";
}

.fa-caret-right:before {
  content: "\f0da";
}

.fa-columns:before {
  content: "\f0db";
}

.fa-unsorted:before,
.fa-sort:before {
  content: "\f0dc";
}

.fa-sort-down:before,
.fa-sort-desc:before {
  content: "\f0dd";
}

.fa-sort-up:before,
.fa-sort-asc:before {
  content: "\f0de";
}

.fa-envelope:before {
  content: "\f0e0";
}

.fa-linkedin:before {
  content: "\f0e1";
}

.fa-rotate-left:before,
.fa-undo:before {
  content: "\f0e2";
}

.fa-legal:before,
.fa-gavel:before {
  content: "\f0e3";
}

.fa-dashboard:before,
.fa-tachometer:before {
  content: "\f0e4";
}

.fa-comment-o:before {
  content: "\f0e5";
}

.fa-comments-o:before {
  content: "\f0e6";
}

.fa-flash:before,
.fa-bolt:before {
  content: "\f0e7";
}

.fa-sitemap:before {
  content: "\f0e8";
}

.fa-umbrella:before {
  content: "\f0e9";
}

.fa-paste:before,
.fa-clipboard:before {
  content: "\f0ea";
}

.fa-lightbulb-o:before {
  content: "\f0eb";
}

.fa-exchange:before {
  content: "\f0ec";
}

.fa-cloud-download:before {
  content: "\f0ed";
}

.fa-cloud-upload:before {
  content: "\f0ee";
}

.fa-user-md:before {
  content: "\f0f0";
}

.fa-stethoscope:before {
  content: "\f0f1";
}

.fa-suitcase:before {
  content: "\f0f2";
}

.fa-bell-o:before {
  content: "\f0a2";
}

.fa-coffee:before {
  content: "\f0f4";
}

.fa-cutlery:before {
  content: "\f0f5";
}

.fa-file-text-o:before {
  content: "\f0f6";
}

.fa-building-o:before {
  content: "\f0f7";
}

.fa-hospital-o:before {
  content: "\f0f8";
}

.fa-ambulance:before {
  content: "\f0f9";
}

.fa-medkit:before {
  content: "\f0fa";
}

.fa-fighter-jet:before {
  content: "\f0fb";
}

.fa-beer:before {
  content: "\f0fc";
}

.fa-h-square:before {
  content: "\f0fd";
}

.fa-plus-square:before {
  content: "\f0fe";
}

.fa-angle-double-left:before {
  content: "\f100";
}

.fa-angle-double-right:before {
  content: "\f101";
}

.fa-angle-double-up:before {
  content: "\f102";
}

.fa-angle-double-down:before {
  content: "\f103";
}

.fa-angle-left:before {
  content: "\f104";
}

.fa-angle-right:before {
  content: "\f105";
}

.fa-angle-up:before {
  content: "\f106";
}

.fa-angle-down:before {
  content: "\f107";
}

.fa-desktop:before {
  content: "\f108";
}

.fa-laptop:before {
  content: "\f109";
}

.fa-tablet:before {
  content: "\f10a";
}

.fa-mobile-phone:before,
.fa-mobile:before {
  content: "\f10b";
}

.fa-circle-o:before {
  content: "\f10c";
}

.fa-quote-left:before {
  content: "\f10d";
}

.fa-quote-right:before {
  content: "\f10e";
}

.fa-spinner:before {
  content: "\f110";
}

.fa-circle:before {
  content: "\f111";
}

.fa-mail-reply:before,
.fa-reply:before {
  content: "\f112";
}

.fa-github-alt:before {
  content: "\f113";
}

.fa-folder-o:before {
  content: "\f114";
}

.fa-folder-open-o:before {
  content: "\f115";
}

.fa-smile-o:before {
  content: "\f118";
}

.fa-frown-o:before {
  content: "\f119";
}

.fa-meh-o:before {
  content: "\f11a";
}

.fa-gamepad:before {
  content: "\f11b";
}

.fa-keyboard-o:before {
  content: "\f11c";
}

.fa-flag-o:before {
  content: "\f11d";
}

.fa-flag-checkered:before {
  content: "\f11e";
}

.fa-terminal:before {
  content: "\f120";
}

.fa-code:before {
  content: "\f121";
}

.fa-mail-reply-all:before,
.fa-reply-all:before {
  content: "\f122";
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
  content: "\f123";
}

.fa-location-arrow:before {
  content: "\f124";
}

.fa-crop:before {
  content: "\f125";
}

.fa-code-fork:before {
  content: "\f126";
}

.fa-unlink:before,
.fa-chain-broken:before {
  content: "\f127";
}

.fa-question:before {
  content: "\f128";
}

.fa-info:before {
  content: "\f129";
}

.fa-exclamation:before {
  content: "\f12a";
}

.fa-superscript:before {
  content: "\f12b";
}

.fa-subscript:before {
  content: "\f12c";
}

.fa-eraser:before {
  content: "\f12d";
}

.fa-puzzle-piece:before {
  content: "\f12e";
}

.fa-microphone:before {
  content: "\f130";
}

.fa-microphone-slash:before {
  content: "\f131";
}

.fa-shield:before {
  content: "\f132";
}

.fa-calendar-o:before {
  content: "\f133";
}

.fa-fire-extinguisher:before {
  content: "\f134";
}

.fa-rocket:before {
  content: "\f135";
}

.fa-maxcdn:before {
  content: "\f136";
}

.fa-chevron-circle-left:before {
  content: "\f137";
}

.fa-chevron-circle-right:before {
  content: "\f138";
}

.fa-chevron-circle-up:before {
  content: "\f139";
}

.fa-chevron-circle-down:before {
  content: "\f13a";
}

.fa-html5:before {
  content: "\f13b";
}

.fa-css3:before {
  content: "\f13c";
}

.fa-anchor:before {
  content: "\f13d";
}

.fa-unlock-alt:before {
  content: "\f13e";
}

.fa-bullseye:before {
  content: "\f140";
}

.fa-ellipsis-h:before {
  content: "\f141";
}

.fa-ellipsis-v:before {
  content: "\f142";
}

.fa-rss-square:before {
  content: "\f143";
}

.fa-play-circle:before {
  content: "\f144";
}

.fa-ticket:before {
  content: "\f145";
}

.fa-minus-square:before {
  content: "\f146";
}

.fa-minus-square-o:before {
  content: "\f147";
}

.fa-level-up:before {
  content: "\f148";
}

.fa-level-down:before {
  content: "\f149";
}

.fa-check-square:before {
  content: "\f14a";
}

.fa-pencil-square:before {
  content: "\f14b";
}

.fa-external-link-square:before {
  content: "\f14c";
}

.fa-share-square:before {
  content: "\f14d";
}

.fa-compass:before {
  content: "\f14e";
}

.fa-toggle-down:before,
.fa-caret-square-o-down:before {
  content: "\f150";
}

.fa-toggle-up:before,
.fa-caret-square-o-up:before {
  content: "\f151";
}

.fa-toggle-right:before,
.fa-caret-square-o-right:before {
  content: "\f152";
}

.fa-euro:before,
.fa-eur:before {
  content: "\f153";
}

.fa-gbp:before {
  content: "\f154";
}

.fa-dollar:before,
.fa-usd:before {
  content: "\f155";
}

.fa-rupee:before,
.fa-inr:before {
  content: "\f156";
}

.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
  content: "\f157";
}

.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
  content: "\f158";
}

.fa-won:before,
.fa-krw:before {
  content: "\f159";
}

.fa-bitcoin:before,
.fa-btc:before {
  content: "\f15a";
}

.fa-file:before {
  content: "\f15b";
}

.fa-file-text:before {
  content: "\f15c";
}

.fa-sort-alpha-asc:before {
  content: "\f15d";
}

.fa-sort-alpha-desc:before {
  content: "\f15e";
}

.fa-sort-amount-asc:before {
  content: "\f160";
}

.fa-sort-amount-desc:before {
  content: "\f161";
}

.fa-sort-numeric-asc:before {
  content: "\f162";
}

.fa-sort-numeric-desc:before {
  content: "\f163";
}

.fa-thumbs-up:before {
  content: "\f164";
}

.fa-thumbs-down:before {
  content: "\f165";
}

.fa-youtube-square:before {
  content: "\f166";
}

.fa-youtube:before {
  content: "\f167";
}

.fa-xing:before {
  content: "\f168";
}

.fa-xing-square:before {
  content: "\f169";
}

.fa-youtube-play:before {
  content: "\f16a";
}

.fa-dropbox:before {
  content: "\f16b";
}

.fa-stack-overflow:before {
  content: "\f16c";
}

.fa-instagram:before {
  content: "\f16d";
}

.fa-flickr:before {
  content: "\f16e";
}

.fa-adn:before {
  content: "\f170";
}

.fa-bitbucket:before {
  content: "\f171";
}

.fa-bitbucket-square:before {
  content: "\f172";
}

.fa-tumblr:before {
  content: "\f173";
}

.fa-tumblr-square:before {
  content: "\f174";
}

.fa-long-arrow-down:before {
  content: "\f175";
}

.fa-long-arrow-up:before {
  content: "\f176";
}

.fa-long-arrow-left:before {
  content: "\f177";
}

.fa-long-arrow-right:before {
  content: "\f178";
}

.fa-apple:before {
  content: "\f179";
}

.fa-windows:before {
  content: "\f17a";
}

.fa-android:before {
  content: "\f17b";
}

.fa-linux:before {
  content: "\f17c";
}

.fa-dribbble:before {
  content: "\f17d";
}

.fa-skype:before {
  content: "\f17e";
}

.fa-foursquare:before {
  content: "\f180";
}

.fa-trello:before {
  content: "\f181";
}

.fa-female:before {
  content: "\f182";
}

.fa-male:before {
  content: "\f183";
}

.fa-gittip:before,
.fa-gratipay:before {
  content: "\f184";
}

.fa-sun-o:before {
  content: "\f185";
}

.fa-moon-o:before {
  content: "\f186";
}

.fa-archive:before {
  content: "\f187";
}

.fa-bug:before {
  content: "\f188";
}

.fa-vk:before {
  content: "\f189";
}

.fa-weibo:before {
  content: "\f18a";
}

.fa-renren:before {
  content: "\f18b";
}

.fa-pagelines:before {
  content: "\f18c";
}

.fa-stack-exchange:before {
  content: "\f18d";
}

.fa-arrow-circle-o-right:before {
  content: "\f18e";
}

.fa-arrow-circle-o-left:before {
  content: "\f190";
}

.fa-toggle-left:before,
.fa-caret-square-o-left:before {
  content: "\f191";
}

.fa-dot-circle-o:before {
  content: "\f192";
}

.fa-wheelchair:before {
  content: "\f193";
}

.fa-vimeo-square:before {
  content: "\f194";
}

.fa-turkish-lira:before,
.fa-try:before {
  content: "\f195";
}

.fa-plus-square-o:before {
  content: "\f196";
}

.fa-space-shuttle:before {
  content: "\f197";
}

.fa-slack:before {
  content: "\f198";
}

.fa-envelope-square:before {
  content: "\f199";
}

.fa-wordpress:before {
  content: "\f19a";
}

.fa-openid:before {
  content: "\f19b";
}

.fa-institution:before,
.fa-bank:before,
.fa-university:before {
  content: "\f19c";
}

.fa-mortar-board:before,
.fa-graduation-cap:before {
  content: "\f19d";
}

.fa-yahoo:before {
  content: "\f19e";
}

.fa-google:before {
  content: "\f1a0";
}

.fa-reddit:before {
  content: "\f1a1";
}

.fa-reddit-square:before {
  content: "\f1a2";
}

.fa-stumbleupon-circle:before {
  content: "\f1a3";
}

.fa-stumbleupon:before {
  content: "\f1a4";
}

.fa-delicious:before {
  content: "\f1a5";
}

.fa-digg:before {
  content: "\f1a6";
}

.fa-pied-piper:before {
  content: "\f1a7";
}

.fa-pied-piper-alt:before {
  content: "\f1a8";
}

.fa-drupal:before {
  content: "\f1a9";
}

.fa-joomla:before {
  content: "\f1aa";
}

.fa-language:before {
  content: "\f1ab";
}

.fa-fax:before {
  content: "\f1ac";
}

.fa-building:before {
  content: "\f1ad";
}

.fa-child:before {
  content: "\f1ae";
}

.fa-paw:before {
  content: "\f1b0";
}

.fa-spoon:before {
  content: "\f1b1";
}

.fa-cube:before {
  content: "\f1b2";
}

.fa-cubes:before {
  content: "\f1b3";
}

.fa-behance:before {
  content: "\f1b4";
}

.fa-behance-square:before {
  content: "\f1b5";
}

.fa-steam:before {
  content: "\f1b6";
}

.fa-steam-square:before {
  content: "\f1b7";
}

.fa-recycle:before {
  content: "\f1b8";
}

.fa-automobile:before,
.fa-car:before {
  content: "\f1b9";
}

.fa-cab:before,
.fa-taxi:before {
  content: "\f1ba";
}

.fa-tree:before {
  content: "\f1bb";
}

.fa-spotify:before {
  content: "\f1bc";
}

.fa-deviantart:before {
  content: "\f1bd";
}

.fa-soundcloud:before {
  content: "\f1be";
}

.fa-database:before {
  content: "\f1c0";
}

.fa-file-pdf-o:before {
  content: "\f1c1";
}

.fa-file-word-o:before {
  content: "\f1c2";
}

.fa-file-excel-o:before {
  content: "\f1c3";
}

.fa-file-powerpoint-o:before {
  content: "\f1c4";
}

.fa-file-photo-o:before,
.fa-file-picture-o:before,
.fa-file-image-o:before {
  content: "\f1c5";
}

.fa-file-zip-o:before,
.fa-file-archive-o:before {
  content: "\f1c6";
}

.fa-file-sound-o:before,
.fa-file-audio-o:before {
  content: "\f1c7";
}

.fa-file-movie-o:before,
.fa-file-video-o:before {
  content: "\f1c8";
}

.fa-file-code-o:before {
  content: "\f1c9";
}

.fa-vine:before {
  content: "\f1ca";
}

.fa-codepen:before {
  content: "\f1cb";
}

.fa-jsfiddle:before {
  content: "\f1cc";
}

.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-saver:before,
.fa-support:before,
.fa-life-ring:before {
  content: "\f1cd";
}

.fa-circle-o-notch:before {
  content: "\f1ce";
}

.fa-ra:before,
.fa-rebel:before {
  content: "\f1d0";
}

.fa-ge:before,
.fa-empire:before {
  content: "\f1d1";
}

.fa-git-square:before {
  content: "\f1d2";
}

.fa-git:before {
  content: "\f1d3";
}

.fa-y-combinator-square:before,
.fa-yc-square:before,
.fa-hacker-news:before {
  content: "\f1d4";
}

.fa-tencent-weibo:before {
  content: "\f1d5";
}

.fa-qq:before {
  content: "\f1d6";
}

.fa-wechat:before,
.fa-weixin:before {
  content: "\f1d7";
}

.fa-send:before,
.fa-paper-plane:before {
  content: "\f1d8";
}

.fa-send-o:before,
.fa-paper-plane-o:before {
  content: "\f1d9";
}

.fa-history:before {
  content: "\f1da";
}

.fa-circle-thin:before {
  content: "\f1db";
}

.fa-header:before {
  content: "\f1dc";
}

.fa-paragraph:before {
  content: "\f1dd";
}

.fa-sliders:before {
  content: "\f1de";
}

.fa-share-alt:before {
  content: "\f1e0";
}

.fa-share-alt-square:before {
  content: "\f1e1";
}

.fa-bomb:before {
  content: "\f1e2";
}

.fa-soccer-ball-o:before,
.fa-futbol-o:before {
  content: "\f1e3";
}

.fa-tty:before {
  content: "\f1e4";
}

.fa-binoculars:before {
  content: "\f1e5";
}

.fa-plug:before {
  content: "\f1e6";
}

.fa-slideshare:before {
  content: "\f1e7";
}

.fa-twitch:before {
  content: "\f1e8";
}

.fa-yelp:before {
  content: "\f1e9";
}

.fa-newspaper-o:before {
  content: "\f1ea";
}

.fa-wifi:before {
  content: "\f1eb";
}

.fa-calculator:before {
  content: "\f1ec";
}

.fa-paypal:before {
  content: "\f1ed";
}

.fa-google-wallet:before {
  content: "\f1ee";
}

.fa-cc-visa:before {
  content: "\f1f0";
}

.fa-cc-mastercard:before {
  content: "\f1f1";
}

.fa-cc-discover:before {
  content: "\f1f2";
}

.fa-cc-amex:before {
  content: "\f1f3";
}

.fa-cc-paypal:before {
  content: "\f1f4";
}

.fa-cc-stripe:before {
  content: "\f1f5";
}

.fa-bell-slash:before {
  content: "\f1f6";
}

.fa-bell-slash-o:before {
  content: "\f1f7";
}

.fa-trash:before {
  content: "\f1f8";
}

.fa-copyright:before {
  content: "\f1f9";
}

.fa-at:before {
  content: "\f1fa";
}

.fa-eyedropper:before {
  content: "\f1fb";
}

.fa-paint-brush:before {
  content: "\f1fc";
}

.fa-birthday-cake:before {
  content: "\f1fd";
}

.fa-area-chart:before {
  content: "\f1fe";
}

.fa-pie-chart:before {
  content: "\f200";
}

.fa-line-chart:before {
  content: "\f201";
}

.fa-lastfm:before {
  content: "\f202";
}

.fa-lastfm-square:before {
  content: "\f203";
}

.fa-toggle-off:before {
  content: "\f204";
}

.fa-toggle-on:before {
  content: "\f205";
}

.fa-bicycle:before {
  content: "\f206";
}

.fa-bus:before {
  content: "\f207";
}

.fa-ioxhost:before {
  content: "\f208";
}

.fa-angellist:before {
  content: "\f209";
}

.fa-cc:before {
  content: "\f20a";
}

.fa-shekel:before,
.fa-sheqel:before,
.fa-ils:before {
  content: "\f20b";
}

.fa-meanpath:before {
  content: "\f20c";
}

.fa-buysellads:before {
  content: "\f20d";
}

.fa-connectdevelop:before {
  content: "\f20e";
}

.fa-dashcube:before {
  content: "\f210";
}

.fa-forumbee:before {
  content: "\f211";
}

.fa-leanpub:before {
  content: "\f212";
}

.fa-sellsy:before {
  content: "\f213";
}

.fa-shirtsinbulk:before {
  content: "\f214";
}

.fa-simplybuilt:before {
  content: "\f215";
}

.fa-skyatlas:before {
  content: "\f216";
}

.fa-cart-plus:before {
  content: "\f217";
}

.fa-cart-arrow-down:before {
  content: "\f218";
}

.fa-diamond:before {
  content: "\f219";
}

.fa-ship:before {
  content: "\f21a";
}

.fa-user-secret:before {
  content: "\f21b";
}

.fa-motorcycle:before {
  content: "\f21c";
}

.fa-street-view:before {
  content: "\f21d";
}

.fa-heartbeat:before {
  content: "\f21e";
}

.fa-venus:before {
  content: "\f221";
}

.fa-mars:before {
  content: "\f222";
}

.fa-mercury:before {
  content: "\f223";
}

.fa-intersex:before,
.fa-transgender:before {
  content: "\f224";
}

.fa-transgender-alt:before {
  content: "\f225";
}

.fa-venus-double:before {
  content: "\f226";
}

.fa-mars-double:before {
  content: "\f227";
}

.fa-venus-mars:before {
  content: "\f228";
}

.fa-mars-stroke:before {
  content: "\f229";
}

.fa-mars-stroke-v:before {
  content: "\f22a";
}

.fa-mars-stroke-h:before {
  content: "\f22b";
}

.fa-neuter:before {
  content: "\f22c";
}

.fa-genderless:before {
  content: "\f22d";
}

.fa-facebook-official:before {
  content: "\f230";
}

.fa-pinterest-p:before {
  content: "\f231";
}

.fa-whatsapp:before {
  content: "\f232";
}

.fa-server:before {
  content: "\f233";
}

.fa-user-plus:before {
  content: "\f234";
}

.fa-user-times:before {
  content: "\f235";
}

.fa-hotel:before,
.fa-bed:before {
  content: "\f236";
}

.fa-viacoin:before {
  content: "\f237";
}

.fa-train:before {
  content: "\f238";
}

.fa-subway:before {
  content: "\f239";
}

.fa-medium:before {
  content: "\f23a";
}

.fa-yc:before,
.fa-y-combinator:before {
  content: "\f23b";
}

.fa-optin-monster:before {
  content: "\f23c";
}

.fa-opencart:before {
  content: "\f23d";
}

.fa-expeditedssl:before {
  content: "\f23e";
}

.fa-battery-4:before,
.fa-battery-full:before {
  content: "\f240";
}

.fa-battery-3:before,
.fa-battery-three-quarters:before {
  content: "\f241";
}

.fa-battery-2:before,
.fa-battery-half:before {
  content: "\f242";
}

.fa-battery-1:before,
.fa-battery-quarter:before {
  content: "\f243";
}

.fa-battery-0:before,
.fa-battery-empty:before {
  content: "\f244";
}

.fa-mouse-pointer:before {
  content: "\f245";
}

.fa-i-cursor:before {
  content: "\f246";
}

.fa-object-group:before {
  content: "\f247";
}

.fa-object-ungroup:before {
  content: "\f248";
}

.fa-sticky-note:before {
  content: "\f249";
}

.fa-sticky-note-o:before {
  content: "\f24a";
}

.fa-cc-jcb:before {
  content: "\f24b";
}

.fa-cc-diners-club:before {
  content: "\f24c";
}

.fa-clone:before {
  content: "\f24d";
}

.fa-balance-scale:before {
  content: "\f24e";
}

.fa-hourglass-o:before {
  content: "\f250";
}

.fa-hourglass-1:before,
.fa-hourglass-start:before {
  content: "\f251";
}

.fa-hourglass-2:before,
.fa-hourglass-half:before {
  content: "\f252";
}

.fa-hourglass-3:before,
.fa-hourglass-end:before {
  content: "\f253";
}

.fa-hourglass:before {
  content: "\f254";
}

.fa-hand-grab-o:before,
.fa-hand-rock-o:before {
  content: "\f255";
}

.fa-hand-stop-o:before,
.fa-hand-paper-o:before {
  content: "\f256";
}

.fa-hand-scissors-o:before {
  content: "\f257";
}

.fa-hand-lizard-o:before {
  content: "\f258";
}

.fa-hand-spock-o:before {
  content: "\f259";
}

.fa-hand-pointer-o:before {
  content: "\f25a";
}

.fa-hand-peace-o:before {
  content: "\f25b";
}

.fa-trademark:before {
  content: "\f25c";
}

.fa-registered:before {
  content: "\f25d";
}

.fa-creative-commons:before {
  content: "\f25e";
}

.fa-gg:before {
  content: "\f260";
}

.fa-gg-circle:before {
  content: "\f261";
}

.fa-tripadvisor:before {
  content: "\f262";
}

.fa-odnoklassniki:before {
  content: "\f263";
}

.fa-odnoklassniki-square:before {
  content: "\f264";
}

.fa-get-pocket:before {
  content: "\f265";
}

.fa-wikipedia-w:before {
  content: "\f266";
}

.fa-safari:before {
  content: "\f267";
}

.fa-chrome:before {
  content: "\f268";
}

.fa-firefox:before {
  content: "\f269";
}

.fa-opera:before {
  content: "\f26a";
}

.fa-internet-explorer:before {
  content: "\f26b";
}

.fa-tv:before,
.fa-television:before {
  content: "\f26c";
}

.fa-contao:before {
  content: "\f26d";
}

.fa-500px:before {
  content: "\f26e";
}

.fa-amazon:before {
  content: "\f270";
}

.fa-calendar-plus-o:before {
  content: "\f271";
}

.fa-calendar-minus-o:before {
  content: "\f272";
}

.fa-calendar-times-o:before {
  content: "\f273";
}

.fa-calendar-check-o:before {
  content: "\f274";
}

.fa-industry:before {
  content: "\f275";
}

.fa-map-pin:before {
  content: "\f276";
}

.fa-map-signs:before {
  content: "\f277";
}

.fa-map-o:before {
  content: "\f278";
}

.fa-map:before {
  content: "\f279";
}

.fa-commenting:before {
  content: "\f27a";
}

.fa-commenting-o:before {
  content: "\f27b";
}

.fa-houzz:before {
  content: "\f27c";
}

.fa-vimeo:before {
  content: "\f27d";
}

.fa-black-tie:before {
  content: "\f27e";
}

.fa-fonticons:before {
  content: "\f280";
}

.fa-reddit-alien:before {
  content: "\f281";
}

.fa-edge:before {
  content: "\f282";
}

.fa-credit-card-alt:before {
  content: "\f283";
}

.fa-codiepie:before {
  content: "\f284";
}

.fa-modx:before {
  content: "\f285";
}

.fa-fort-awesome:before {
  content: "\f286";
}

.fa-usb:before {
  content: "\f287";
}

.fa-product-hunt:before {
  content: "\f288";
}

.fa-mixcloud:before {
  content: "\f289";
}

.fa-scribd:before {
  content: "\f28a";
}

.fa-pause-circle:before {
  content: "\f28b";
}

.fa-pause-circle-o:before {
  content: "\f28c";
}

.fa-stop-circle:before {
  content: "\f28d";
}

.fa-stop-circle-o:before {
  content: "\f28e";
}

.fa-shopping-bag:before {
  content: "\f290";
}

.fa-shopping-basket:before {
  content: "\f291";
}

.fa-hashtag:before {
  content: "\f292";
}

.fa-bluetooth:before {
  content: "\f293";
}

.fa-bluetooth-b:before {
  content: "\f294";
}

.fa-percent:before {
  content: "\f295";
}

/* SITE SKIN VARIABLES */
/* WEB FONTFACE DECLARATIONS */
@font-face {
  font-family: "DIN";
  src: url("/fonts/DIN-Regular.eot");
  src: url("/fonts/DIN-Regular.eot?#iefix") format("embedded-opentype"), url("/fonts/DIN-Regular.woff2") format("woff2"), url("/fonts/DIN-Regular.woff") format("woff"), url("/fonts/DIN-Regular.ttf") format("truetype"), url("/fonts/DIN-Regular.svg#DIN-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "DIN";
  src: url("/fonts/DIN-Medium.eot");
  src: url("/fonts/DIN-Medium.eot?#iefix") format("embedded-opentype"), url("/fonts/DIN-Medium.woff2") format("woff2"), url("/fonts/DIN-Medium.woff") format("woff"), url("/fonts/DIN-Medium.ttf") format("truetype"), url("/fonts/DIN-Medium.svg#DIN-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "DIN";
  src: url("/fonts/DIN-Bold.eot");
  src: url("/fonts/DIN-Bold.eot?#iefix") format("embedded-opentype"), url("/fonts/DIN-Bold.woff2") format("woff2"), url("/fonts/DIN-Bold.woff") format("woff"), url("/fonts/DIN-Bold.ttf") format("truetype"), url("/fonts/DIN-Bold.svg#DIN-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "DIN";
  src: url("/fonts/DIN-Light.eot");
  src: url("/fonts/DIN-Light.eot?#iefix") format("embedded-opentype"), url("/fonts/DIN-Light.woff2") format("woff2"), url("/fonts/DIN-Light.woff") format("woff"), url("/fonts/DIN-Light.ttf") format("truetype"), url("/fonts/DIN-Light.svg#DIN-Light") format("svg");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "DIN";
  src: url("/fonts/DIN-Black.eot");
  src: url("/fonts/DIN-Black.eot?#iefix") format("embedded-opentype"), url("/fonts/DIN-Black.woff2") format("woff2"), url("/fonts/DIN-Black.woff") format("woff"), url("/fonts/DIN-Black.ttf") format("truetype"), url("/fonts/DIN-Black.svg#DIN-Black") format("svg");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: "Tahoma";
  src: url("/fonts/Tahoma.eot");
  src: url("/fonts/Tahoma.eot?#iefix") format("embedded-opentype"), url("/fonts/Tahoma.woff2") format("woff2"), url("/fonts/Tahoma.woff") format("woff"), url("/fonts/Tahoma.ttf") format("truetype"), url("/fonts/Tahoma.svg#Tahoma") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "icomoon";
  src: url("/fonts/icomoon/icomoon.eot?8z37ag");
  src: url("/fonts/icomoon/icomoon.eot?8z37ag#iefix") format("embedded-opentype"), url("/fonts/icomoon/icomoon.ttf?8z37ag") format("truetype"), url("/fonts/icomoon/icomoon.woff?8z37ag") format("woff"), url("/fonts/icomoon/icomoon.svg?8z37ag#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^=ico-], [class*=" ico-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ico-arrow-right:before {
  content: "\e901";
}

.ico-paintbrush:before {
  content: "\e90b";
}

.ico-camera:before {
  content: "\e900";
}

.ico-chat-bubbles:before {
  content: "\e90a";
}

.ico-couch:before {
  content: "\e902";
}

.ico-document:before {
  content: "\e903";
}

.ico-door:before {
  content: "\e904";
}

.ico-face:before {
  content: "\e905";
}

.ico-laptop:before {
  content: "\e906";
}

.ico-megaphone:before {
  content: "\e907";
}

.ico-moneyhand:before {
  content: "\e908";
}

.ico-notepad:before {
  content: "\e909";
}

/* ANIMATIONS */
/* MIXINS */
/* BOOTSTRAP GRID EXTENDS */
/* EXTENDS */
/*
 *	GLOBAL COMPONENT IMPORTS
*/
/* BUTTONS */
/* Forms ($forms) */
/* Page/Section Headings */
/* Sidebars */
/* Select Menus */
/* Panels ($panels) */
/* Carousels */
/* Lightbox */
/* Spinners */
/* Page Share Module */
/* Social Icon Modules */
/* InfoBub Module */
/* Hero Image Module */
/* Video Module (Responsive) */
/* SLIDE ARROWS */
.slide-arrows a {
  width: 61px;
  height: 61px;
}
.slide-arrows a.next {
  background-position: -63px 0;
}

/* Panels ($panels) */
.panel-default .panel-heading a {
  border: none;
}
.panel-default .panel-heading a .panel-title {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 900;
}
.panel-default .panel-heading a:after {
  top: 13px;
}
.panel-default .panel-body .list-item-title {
  font-weight: 700;
}
.panel-default .panel-body li {
  font-size: 21px;
}

@media (max-width: 767px) {
  .panel-default > .panel-heading a .panel-title {
    font-size: 20px;
  }
}
@media (max-width: 479px) {
  .panel-default > .panel-heading a .panel-title {
    font-size: 14px;
    padding: 8px 0;
  }
}
/* Carousels ($carousels) */
/* Range Slider */
/*
 *	LAYOUT IMPORTS
*/
/* BASE STYLES */
* {
  break-word: normal !important;
  -webkit-hyphens: none !important;
  -moz-hyphens: none !important;
  -ms-hyphens: none !important;
  hyphens: none !important;
}

body {
  font-size: 24.5px;
  font-family: "Roboto", Arial, sans-serif;
  -webkit-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: bottom;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  color: #545559;
}
h1 a, .h1 a,
h2 a, .h2 a,
h3 a, .h3 a,
h4 a, .h4 a,
h5 a, .h5 a,
h6 a, .h6 a {
  color: #545559;
}

a {
  color: #cc0001 !important;
}
a.light {
  color: #fff;
}

select:focus {
  outline: none;
}

.container-fluid {
  max-width: 1176px;
  width: 100%;
}

.pre-access.theme--light.v-application {
  background: unset;
}

.pre-access .v-application--wrap {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.pre-access .theme--light.v-application {
  background: unset;
}

.pre-access .login-wrapper {
  max-width: 480px;
}

.pre-access .create-account-wrapper {
  max-width: 800px;
}

.pre-access .card-bg.v-card.theme--light {
  text-align: center;
  padding: 50px 40px;
  background-color: rgba(255, 255, 255, 0.93);
}
.pre-access .card-bg.v-card.theme--light .v-card__title {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}
.pre-access .card-bg.v-card.theme--light .v-card--flat {
  background-color: unset;
}

.pre-access .logo {
  width: 240px;
}

.pre-access .utility-links a {
  margin: 0 10px;
}

.hero {
  padding: 0;
  border-bottom: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  position: relative;
  background-color: transparent;
}
.hero p {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  background: rgba(255, 255, 255, 0.6);
  text-align: center;
  text-transform: uppercase;
  line-height: 0.9;
  padding: 50px;
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 700;
  font-size: 42px;
  min-width: 550px;
}
.hero p span.emphasis {
  color: #ffffff;
  font-size: 53px;
  font-weight: 900;
}

.hero-image {
  height: 600px;
}
.hero-image.blog-hero {
  height: 450px;
}

.page-heading {
  text-align: center;
  margin-bottom: 50px;
  text-transform: uppercase;
}
.page-heading:before {
  background-color: #f0f0f0;
}
.page-heading:after {
  background-color: #ccc;
}

.section-body ul.contact-social {
  margin-bottom: 0;
}

.icon-group {
  margin-top: 100px;
}
.icon-group .icon-text {
  display: table;
  width: 100%;
  margin-bottom: 30px;
}
.icon-group .icon-text > .icon, .icon-group .icon-text > .text {
  display: table-cell;
  vertical-align: middle;
}
.icon-group .icon-text > .icon {
  width: 100px;
  padding-right: 25px;
}
.icon-group .icon-text > .icon > i {
  width: 100px;
  height: 100px;
  background-color: #ffffff;
  color: #fff;
  border-radius: 50%;
  position: relative;
  display: block;
  font-size: 70px;
}
.icon-group .icon-text > .icon > i:before {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}
.icon-group .icon-text > .icon > .ico-door:before {
  top: 62%;
  font-size: 80px;
}
.icon-group .icon-text > .icon > .ico-notepad:before {
  top: 63%;
  font-size: 74px;
}
.icon-group .icon-text > .text {
  line-height: 1.2;
}
.icon-group .icon-text > .text > p {
  margin-bottom: 0;
}
.icon-group .icon-text > .text .text-head {
  font-weight: 700;
}

.section-link {
  color: #333333;
  float: right;
  overflow: hidden;
  text-transform: uppercase;
  font-weight: 900;
  padding-right: 15px;
}
.section-link:before {
  content: "\f061";
  font-family: "FontAwesome";
  font-weight: 400;
  margin-right: 5px;
}
.section-link:hover, .section-link:active {
  color: #ffffff;
  text-decoration: none;
}

.image-blocks {
  display: table;
  width: 100%;
}
.image-blocks .image-block {
  padding: 0;
  display: table-cell;
  vertical-align: top;
  width: 50%;
  color: #fff;
  position: relative;
}
.image-blocks .image-block a {
  color: #fff;
  display: block;
}
.image-blocks .image-block a .image-wrapper {
  height: 0;
  width: 100%;
  padding-bottom: 100%;
  background-repeat: no-repeat;
  -webkit-background-size: 110% 110%;
  background-size: 110%;
  background-position: center center;
  -webkit-transition: -webkit-background-size 0.25s ease-out;
  transition: -webkit-background-size 0.25s ease-out;
  -o-transition: background-size 0.25s ease-out;
  transition: background-size 0.25s ease-out;
  transition: background-size 0.25s ease-out, -webkit-background-size 0.25s ease-out;
}
.image-blocks .image-block a:hover, .image-blocks .image-block a:active {
  text-decoration: none;
}
.image-blocks .image-block a:hover .image-wrapper, .image-blocks .image-block a:active .image-wrapper {
  -webkit-background-size: 115% 115%;
  background-size: 115%;
  background-position: center center;
}
.image-blocks .image-block:nth-child(odd) {
  background-color: #ffffff;
}
.image-blocks .image-block:nth-child(odd) .text .learn-more {
  color: #333333;
}
.image-blocks .image-block:nth-child(even) {
  background-color: #333333;
}
.image-blocks .image-block img {
  width: 100%;
  height: auto;
}
.image-blocks .image-block .banner {
  position: absolute;
  top: 25px;
  right: 0;
  background-color: #ffffff;
  color: #fff;
  padding: 5px 30px;
  text-transform: uppercase;
  font-weight: 900;
  line-height: 1;
}
.image-blocks .image-block .text {
  text-align: center;
  font-weight: 400;
  font-size: 28px;
  padding: 15px 25px;
}
.image-blocks .image-block .text .heading {
  text-transform: uppercase;
  font-weight: 900;
  font-size: 45px;
  margin-bottom: 0;
}
.image-blocks .image-block .text p:last-of-type {
  margin-bottom: 60px;
}
.image-blocks .image-block .text .learn-more {
  text-transform: uppercase;
  position: absolute;
  bottom: 15px;
  width: 100%;
  left: 0;
  text-align: center;
}
.image-blocks .image-block .text .learn-more:after {
  content: "\e901";
  font-family: "icomoon";
  margin-left: 5px;
}
.image-blocks .image-block .text .learn-more:hover, .image-blocks .image-block .text .learn-more:active {
  text-decoration: none;
  color: #fff;
}
.image-blocks .image-block.open-house a .image-wrapper {
  padding-bottom: 62.5%;
}

.image-with-text {
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: center center;
  height: 400px;
  text-align: center;
  position: relative;
}
.image-with-text.renter {
  height: 600px;
}
.image-with-text.full-testimonial {
  height: auto;
  padding: 25px 0;
}
.image-with-text.full-testimonial .text-wrapper {
  position: static;
  left: 0;
  top: 0;
  -webkit-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
  background: rgba(250, 250, 250, 0.8);
}
.image-with-text .text-wrapper {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  background: rgba(255, 255, 255, 0.7);
  padding: 25px 50px;
  -webkit-box-shadow: 0 0 5px hsla(0, 0%, 0%, 0.2);
  box-shadow: 0 0 5px hsla(0, 0%, 0%, 0.2);
}
.image-with-text .text-wrapper .text {
  font-weight: bold;
  color: #545559;
}
.image-with-text .text-wrapper .attribution {
  margin-bottom: 0;
}
.image-with-text.map-search-wrapper .text-wrapper {
  width: 50%;
  min-width: 280px;
  -webkit-transition: -webkit-transform 0.25s ease-out;
  transition: -webkit-transform 0.25s ease-out;
  -o-transition: -o-transform 0.25s ease-out;
  transition: transform 0.25s ease-out;
  transition: transform 0.25s ease-out, -webkit-transform 0.25s ease-out, -o-transform 0.25s ease-out;
}
.image-with-text.map-search-wrapper .text-wrapper p {
  margin-bottom: 0;
}
.image-with-text.map-search-wrapper .text-wrapper .text {
  color: #333333;
  text-transform: uppercase;
  font-weight: 400;
}
.image-with-text.map-search-wrapper .text-wrapper .text .heading {
  font-weight: 700;
}
.image-with-text.map-search-wrapper:hover .text-wrapper {
  -webkit-transform: translateX(-50%) translateY(-50%) scale(1.1);
  -ms-transform: translateX(-50%) translateY(-50%) scale(1.1);
  -o-transform: translateX(-50%) translateY(-50%) scale(1.1);
  transform: translateX(-50%) translateY(-50%) scale(1.1);
}
.image-with-text.map-search-wrapper:hover .text-wrapper .text {
  color: #333333;
}

.map-search {
  min-height: 500px;
  position: relative;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}

.returnToTop a {
  color: #fff;
  text-transform: lowercase;
}
.returnToTop a:after {
  color: #fff;
}

.search-overlay,
.contact-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 400;
  background-color: rgba(255, 255, 255, 0.6);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.125s ease-out;
  -o-transition: opacity 0.125s ease-out;
  transition: opacity 0.125s ease-out;
}
.search-overlay.active,
.contact-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

.search-modal,
.contact-modal {
  position: absolute;
  z-index: 410;
  top: 15%;
  left: 15%;
  right: 15%;
  bottom: 15%;
  background-color: #ffffff;
  color: #fff;
  padding: 25px 50px;
  text-align: center;
  overflow-y: auto;
}
.search-modal .close-button,
.contact-modal .close-button {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 40px;
  height: 40px;
  color: #fff;
  -webkit-transition: color 0.125s ease-out;
  -o-transition: color 0.125s ease-out;
  transition: color 0.125s ease-out;
}
.search-modal .close-button:hover, .search-modal .close-button:active,
.contact-modal .close-button:hover,
.contact-modal .close-button:active {
  text-decoration: none;
  color: #333333;
}
.search-modal .close-button:before,
.contact-modal .close-button:before {
  font-family: "FontAwesome";
  content: "\f00d";
}
.search-modal p,
.contact-modal p {
  margin-bottom: 50px;
}
.search-modal .request-form .input,
.contact-modal .request-form .input {
  width: 100%;
  float: none;
}
.search-modal .search-modal-close,
.search-modal .contact-modal-close,
.contact-modal .search-modal-close,
.contact-modal .contact-modal-close {
  position: absolute;
  z-index: 410;
  width: 32px;
  height: 32px;
  top: -16px;
  right: -16px;
  border-radius: 50%;
  text-align: center;
  background-color: #ffffff;
  color: #fff;
  text-decoration: none;
}
.search-modal .search-modal-close:hover, .search-modal .search-modal-close:active,
.search-modal .contact-modal-close:hover,
.search-modal .contact-modal-close:active,
.contact-modal .search-modal-close:hover,
.contact-modal .search-modal-close:active,
.contact-modal .contact-modal-close:hover,
.contact-modal .contact-modal-close:active {
  text-decoration: none;
}
.search-modal .search-modal-close:before,
.search-modal .contact-modal-close:before,
.contact-modal .search-modal-close:before,
.contact-modal .contact-modal-close:before {
  font-family: "FontAwesome";
  content: "\f00d";
  font-size: 1.33333em;
  line-height: 30px;
}

.responsive-embed {
  position: relative;
  height: 0;
  padding-bottom: 65%;
  margin-bottom: 50px;
  margin-left: 15px;
  margin-right: 15px;
}
.responsive-embed > iframe {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.section-social {
  text-align: center;
}

.large-social {
  color: #ffffff;
  font-family: "FontAwesome";
  -webkit-transition: color 0.125s ease-out;
  -o-transition: color 0.125s ease-out;
  transition: color 0.125s ease-out;
  margin-left: 50px;
  margin-right: 50px;
  font-size: 72px;
}
.large-social:hover, .large-social:active {
  text-decoration: none;
  color: #333333;
}
.large-social.large-social-facebook:before {
  content: "\f082";
}
.large-social.large-social-gplus:before {
  content: "\f0d4";
}
.large-social.large-social-linkedin:before {
  content: "\f08c";
}

.section-contact-link {
  background-color: #ffffff;
  text-align: center;
}
.section-contact-link h3 {
  font-family: "Roboto", Arial, sans-serif;
  font-weight: 200;
  color: #fff;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 25px;
}
.section-contact-link a {
  color: #fff;
}
.section-contact-link a:after {
  font-family: "FontAwesome";
  content: "\f003";
  color: #ffffff;
  background-color: #fff;
  font-size: 48px;
  padding: 15px;
  border-radius: 50%;
  -webkit-transition: background-color 0.125s ease-out;
  -o-transition: background-color 0.125s ease-out;
  transition: background-color 0.125s ease-out;
}
.section-contact-link a:hover, .section-contact-link a:active {
  text-decoration: none;
}
.section-contact-link a:hover:after, .section-contact-link a:active:after {
  background-color: #333333;
}

@media (min-width: 1300px) {
  .hero-image {
    height: 930px;
  }
}
@media (max-width: 989px) {
  .page-heading {
    font-size: 32px;
  }
  .map-search {
    min-height: 0;
    height: 0;
    padding-bottom: 75%;
  }
  .image-with-text {
    height: 0;
    padding-bottom: 50%;
  }
  .image-with-text.map-search-wrapper {
    height: auto;
    padding-bottom: 0;
  }
  .image-with-text.map-search-wrapper .text-wrapper {
    width: 100%;
  }
  .image-with-text.map-search-wrapper .text-wrapper .text {
    font-size: 28px;
  }
  .image-blocks .image-block .text .heading {
    font-size: 36px;
  }
  .image-blocks .image-block .text p {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .site-main p {
    font-size: 20px;
  }
  .container-fluid {
    padding: 0 10px;
  }
  .row {
    margin-left: 0px;
    margin-right: 0px;
  }
  .hero-image {
    height: 450px;
  }
  .hero-body {
    border-bottom: 0;
  }
  .hero p {
    font-size: 30px;
    min-width: 320px;
    padding: 25px;
  }
  .hero p span.emphasis {
    font-size: 44px;
  }
  .page-heading {
    font-size: 28px;
  }
  .image-with-text.testimonial {
    height: 450px;
  }
  .image-with-text.testimonial.renter {
    height: 600px;
  }
  .image-with-text.testimonial .text-wrapper .text {
    font-size: 20px;
  }
  .image-with-text.testimonial .text-wrapper .attribution {
    font-size: 20px;
  }
  .image-with-text.full-testimonial {
    height: auto;
  }
  .image-with-text.map-search-wrapper .text-wrapper {
    width: 90%;
  }
  .image-with-text.map-search-wrapper .text-wrapper .text {
    font-size: 28px;
  }
  .image-with-text.map-search-wrapper .text-wrapper .text p {
    font-size: 24px;
  }
  .image-blocks .image-block .text .heading {
    font-size: 28px;
  }
  .image-blocks .image-block .text .learn-more {
    font-size: 20px;
  }
  .icon-group .icon-text > .icon, .icon-group .icon-text > .text {
    display: block;
    text-align: center;
  }
  .icon-group .icon-text > .icon {
    margin: 20px auto 20px auto;
  }
  .icon-group .icon-text > .text .text-head {
    display: block;
  }
  .search-modal .btn,
  .contact-modal .btn {
    display: block;
    width: 100%;
    margin-bottom: 20px;
  }
  .search-modal p,
  .contact-modal p {
    font-size: 18px;
  }
  .large-social {
    margin-left: 15px;
    margin-right: 15px;
  }
}
@media (max-width: 479px) {
  .hero-image {
    height: 350px;
  }
  .page-heading {
    font-size: 24px;
  }
  .image-with-text.testimonial {
    height: 400px;
  }
  .image-with-text.testimonial .text-wrapper .text {
    font-size: 16px;
  }
  .image-with-text.testimonial .text-wrapper .attribution {
    font-size: 16px;
  }
  .image-with-text.full-testimonial {
    height: auto;
  }
  .image-with-text.map-search-wrapper .text-wrapper {
    width: 90%;
    padding: 25px;
  }
  .image-with-text.map-search-wrapper .text-wrapper .text {
    font-size: 20px;
  }
  .image-with-text.map-search-wrapper .text-wrapper .text p {
    font-size: 18px;
  }
  .image-blocks .image-block {
    width: 100%;
    float: none;
    display: block;
  }
  .search-modal,
  .contact-modal {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 15px 25px;
  }
}
/* Site Header ($site-header) */
.site-header {
  background-color: #ffffff;
  padding: 0;
  z-index: 200;
  position: relative;
  min-height: 74px;
}
.site-header .header-wrapper {
  padding: 10px 0;
}
.site-header:before, .site-header:after {
  bottom: 0;
}
.site-header:after {
  width: auto;
  left: 25%;
  right: 25%;
  background-color: #fff;
  -webkit-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
}
.site-header.stuck {
  position: fixed;
  top: 0;
  width: 100%;
}
.site-header .nav-primary {
  margin-top: 0;
}
.site-header .nav-primary ul.nav-list {
  padding-left: 0;
  list-style: none;
  margin-left: -5px;
}
.site-header .nav-primary ul.nav-list > li {
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px;
}
.site-header .nav-primary ul.nav-list {
  font-size: 16px;
  text-align: right;
  margin-right: 20px;
}
.site-header .nav-primary .list-inline {
  margin-top: 0;
}
.site-header .nav-utility {
  display: none;
}
.site-header .logo-wrapper a {
  width: auto;
  padding: 5px 20px;
}
.site-header .user-wrapper .user-header-wrapper {
  font-size: 14px;
  font-weight: bold;
}
.site-header .user-wrapper .brand-logo {
  width: auto;
  height: 100px;
  padding: 5px 0px;
}
.site-header .user-wrapper .portal-menu {
  background: #cc0001;
}
.site-header .user-wrapper .portal-menu a {
  color: white !important;
}

@media (max-width: 989px) {
  .nav-primary .list-inline > li > a {
    font-size: 18px;
  }
}
@media (max-width: 767px) {
  .site-header .logo-wrapper {
    width: auto;
    height: auto;
    margin: 0 auto;
    float: none;
    text-align: center;
  }
  .site-header .logo-wrapper .logo img {
    height: auto;
    margin: 0 auto;
  }
}
/* Site Footer ($site-footer) */
.site-footer {
  font-size: 17.5px;
  word-wrap: break-word;
  color: #cccccc;
  background-color: #fff;
  background-image: url("/images/pictogram.png");
  background-repeat: no-repeat;
  background-position: top center;
}
.site-footer .footer-nav-item {
  text-align: center;
}
.site-footer .footer-block {
  padding: 30px 0;
}
.site-footer .footer-block-border {
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  background-color: #545559;
}
.site-footer h2 {
  font-size: 17.5px;
  font-family: "Roboto", Arial, sans-serif;
  margin-top: 0;
  text-transform: lowercase;
  color: #cccccc;
}
.site-footer h2 a {
  color: inherit;
  text-transform: inherit;
}
.site-footer a {
  color: #cccccc;
  text-transform: capitalize;
}
.site-footer a:hover {
  color: #cccccc;
}
.site-footer address {
  display: inline;
}
.site-footer .contact-phone a,
.site-footer .contact-fax a,
.site-footer .contact-phone a strong,
.site-footer .contact-fax a strong {
  color: #333333;
}
.site-footer .contact-email a {
  color: #fff;
  font-size: 10.5px;
}
.site-footer .list-unstyled {
  text-align: center;
  font-size: 20px;
}
.site-footer .list-unstyled li {
  margin-right: 10px;
  display: inline;
}
.site-footer .list-unstyled:after {
  background-color: #aaa;
}
.site-footer .equal-housing-logo {
  float: right;
  width: 60px;
  margin-left: 25px;
}
.site-footer .site-disclaimer {
  width: auto;
  text-align: center;
}
.site-footer .idx-logo {
  width: 124px;
  float: left;
  margin-right: 25px;
}
.site-footer .kw-logo {
  overflow: hidden;
}
.site-footer .kw-logo img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.25;
  vertical-align: baseline;
  display: inline;
}
.site-footer .kw-logo p {
  display: inline;
  vertical-align: baseline;
  text-transform: uppercase;
  padding-left: 10px;
  padding-bottom: 2px;
  font-size: 14px;
}

@media (max-width: 989px) {
  .site-footer .footer-nav-item {
    margin: 8px 0;
  }
  .site-disclaimer p {
    clear: both;
  }
}
@media (max-width: 767px) {
  .subfooter .col-xs-6:nth-child(3) .footer-logo {
    margin-top: 15px;
  }
  .site-footer .kw-logo {
    text-align: center;
  }
  .site-footer .kw-logo img {
    display: block;
    margin: 0 auto;
    margin-bottom: 10px;
  }
  .site-footer .kw-logo p {
    display: block;
    font-size: 12px;
  }
  .site-footer .ugh {
    display: none;
  }
  .site-footer address {
    display: block;
  }
  .site-footer .list-unstyled li:nth-child(2) {
    display: block;
  }
}
/* TODO: reorganize this into a layout component & import it here */
/* User Header - General */
/* User Header - Project-specific */
.brand-logo {
  float: left;
}

.current-dealer {
  display: inline-block;
  font-size: 0.75em;
}

.current-dealer.single-dealer {
  background-color: #ffcccc;
  padding: 0.5em 1em;
  margin: 0px 0 0 0;
}

.current-dealer.multi-dealer {
  text-align: left;
  margin: 29px 0 0 0;
}

.current-dealer.multi-dealer .dealer-selector-label {
  font-size: 0.725em;
}

.current-dealer.multi-dealer select {
  display: inline-block;
  height: 3em;
  background-color: #ffcccc;
  padding: 0 1em;
}

.portal-menu {
  /* font-size: 18px; */
  font-size: 0.65em;
  background-color: #cc0001;
  padding: 0.25em 0.5em;
  margin-bottom: 0.75em;
  color: white;
  width: 100%;
}

.portal-menu-banner {
  background-color: #ffcccc;
  text-align: left;
  font-size: 0.65em;
  padding: 0.75em 0.5em;
  width: 100%;
}
.portal-menu-banner .dealer-contact {
  display: inline-block;
  padding-left: 1em;
  width: 30%;
  overflow-x: hidden;
  vertical-align: top;
  background-color: #ffdddd;
}
.portal-menu-banner .dealer-contact .dealer-contact.contact-sales {
  color: blue;
}
.portal-menu-banner .dealer-contact .dealer-contact.contact-parts {
  color: white;
}
.portal-menu-banner .dealer-contact .dealer-contact.contact-warranty {
  color: green;
}
.portal-menu-banner .dealer-contact .dealer-contact-label {
  font-size: 1em;
  font-weight: bold;
}
.portal-menu-banner .dealer-contact .dealer-contact-info {
  font-size: 0.9em;
  font-weight: bolder;
}
.portal-menu-banner .dealer-contact:first-child {
  padding-left: 1em;
}

.portal-menu-option {
  font-weight: bold;
}

.portal-menu-option-current {
  font-weight: bolder;
}

.portal-menu a {
  color: white !important;
}

.portal-menu a:visited {
  color: white;
}

div.application div.application--wrap {
  min-height: inherit;
}

.v-chip.alcom-color {
  background: #cc0001 !important;
}

.v-chip.dealer-color, .v-chip.no-color {
  background: #009688 !important;
}

.v-chip.column-dot {
  padding: 0 6px !important;
  height: 12px !important;
}

/*
 *	TYPOGRAPHY OVERRIDES (site-wide)
 *	Vuetify ships .subtitle-1 at a 1.75 line-height ratio (16px text on a 28px
 *	line), which is very airy for anything that wraps — noticeably so on mobile,
 *	where an instruction line breaking to two rows gets a large gap between them.
 *	Tightened to 1.3.
 *
 *	Unitless rather than 1.3rem on purpose: a ratio keeps its proportion if the
 *	font-size is overridden somewhere, whereas a fixed 1.3rem would stay 20.8px
 *	and turn cramped under larger text. Same result at the default 16px.
 */
.v-application .subtitle-1 {
  line-height: 1.3;
}

/*
 *	WARRANTY CLAIM WIZARD — SHELL
 *	Header echoes the portal's own red nav bar so the dialog reads as part of the
 *	app rather than a floating white box, and carries a progress indicator: this
 *	is a five-step flow that previously gave no sense of position or remaining work.
 */
.wiz-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background: #cc0001;
  color: #fff;
  padding: 14px 12px 12px 24px;
}
.wiz-head .wiz-title {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  line-height: 1.2;
  margin-bottom: 7px;
}
.wiz-head .wiz-steps {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 5px;
}
.wiz-head .wiz-seg {
  width: 20px;
  height: 3px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.32);
}
.wiz-head .wiz-seg--done {
  background: #fff;
}
.wiz-head .wiz-step-text {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.88);
  margin-left: 6px;
}
.wiz-head .wiz-close {
  margin: -4px 0px 0 0;
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -ms-flex: none;
  flex: none;
  /* A thin ring so the round hit area reads as a button against the red band. */
  border: 1px solid rgba(0, 0, 0, 0.35);
  /* Vuetify's hover wash on a `dark` icon button is white (currentColor); on red it
     washed the X out. Black, invisible at rest, 10% on hover. */
}
.wiz-head .wiz-close:before {
  background-color: #000 !important;
  opacity: 0 !important;
}
.wiz-head .wiz-close:hover:before {
  opacity: 0.1 !important;
}
.wiz-head {
  /* Headers without the step indicators (View Claim, the reason modal). The title's
     bottom margin and top alignment above exist to make room for .wiz-steps; with
     nothing under the title they just left it sitting high in the red band. */
}
.wiz-head.wiz-head--no-steps {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding-top: 12px;
  padding-bottom: 12px;
}
.wiz-head.wiz-head--no-steps .wiz-title {
  margin-bottom: 0;
}
.wiz-head.wiz-head--no-steps .wiz-close {
  margin-bottom: 0;
}

/* Claim dialog footer: one right-aligned group that wraps, instead of two cols="6"
   columns. On phones (Vuetify xs, <600px) the buttons stack full width with the
   primary action on top, so long labels like "Print / Save as PDF" never clip. */
.wiz-footer-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.wiz-footer-actions .v-btn {
  margin: 0 !important;
}
.wiz-footer-actions {
  /* One button shape per footer. Components bring their own square buttons (e.g. the
     black Contact Us from contact-drawer); round them when they land in a modal footer. */
}
.wiz-footer-actions .v-btn:not(.v-btn--icon):not(.v-btn--text) {
  border-radius: 28px;
}
.wiz-footer-actions {
  /* Ends the left-hand group (Print / Re-open / Reset); Close + Save sit on the right. */
}
.wiz-footer-actions .wiz-footer-left {
  margin-right: auto !important;
}
.wiz-footer-actions {
  /* Claim dialog Save: always visible, fades from grey to green once there's a change. */
}
.wiz-footer-actions .claim-save-btn {
  -webkit-transition: background-color 0.25s ease, color 0.25s ease, -webkit-box-shadow 0.25s ease;
  transition: background-color 0.25s ease, color 0.25s ease, -webkit-box-shadow 0.25s ease;
  -o-transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
  transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
  transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, -webkit-box-shadow 0.25s ease;
}
@media (max-width: 599px) {
  .wiz-footer-actions {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    /* Components that render their own wrapper (confirm-modal, contact-drawer,
       sales-goal-editor) need the wrapper stretched too, not just the button. */
  }
  .wiz-footer-actions > * {
    width: 100%;
  }
  .wiz-footer-actions .v-btn {
    width: 100%;
  }
}

/*
 *	PORTAL MODAL STANDARD (2026-09-14)
 *	Primary modals - anything opened from a table row, or a full form - use:
 *	  header  <div class="wiz-head wiz-head--no-steps"> title left, .wiz-close X right
 *	  body    <v-card-text class="wiz-body">   (v-dialog `scrollable`, so the header and
 *	          footer stay put and only the body scrolls)
 *	  footer  <v-card-actions class="wiz-body"><div class="wiz-footer-actions">
 *	          right-aligned rounded buttons; primary (green) far right, secondary grey,
 *	          rare / late-stage actions on the left via .wiz-footer-left
 *	Small confirmations (delete, remove attachment, unsaved changes) stay plain white
 *	cards with the same right-aligned rounded buttons.
 */
/* Header status pill (e.g. an order's production status) - translucent white so it
   sits on the red band without introducing another colour. */
.wiz-head-pill {
  display: inline-block;
  margin-left: 12px;
  padding: 2px 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.2);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  vertical-align: middle;
  white-space: nowrap;
}

.wiz-head .wiz-title-sub {
  font-weight: 400;
  opacity: 0.85;
}

/* Loading bars: ALCOM red everywhere. Templates set assorted colours (a Vuetify-docs
   deep-purple, a near-invisible #ffcccc), including inside framework modules this
   project doesn't own, so the colour is enforced here rather than per template.
   Only indeterminate bars exist in the portal, so this can't recolour a data bar. */
.v-progress-linear--active:has(.v-progress-linear__indeterminate) .v-progress-linear__background {
  background-color: #cc0001 !important;
  border-color: #cc0001 !important;
  opacity: 0.2 !important;
}
.v-progress-linear--active:has(.v-progress-linear__indeterminate) .v-progress-linear__indeterminate .long,
.v-progress-linear--active:has(.v-progress-linear__indeterminate) .v-progress-linear__indeterminate .short {
  background-color: #cc0001 !important;
  border-color: #cc0001 !important;
}

/*
 *	BUTTON STANDARD (2026-09-14)
 *	Every filled button in the portal - page, modal footer, table row - is a 34px pill
 *	with 15px side padding, whatever size prop or shape the template (or a framework
 *	module) asked for. Text, icon and fab buttons keep their own shapes; `tile` is the
 *	explicit opt-out. Table-row buttons are a notch smaller (13px) and get 9px of margin
 *	above and below, so they don't touch the row dividers.
 *
 *	Colour roles:
 *	  green        save / approve / send            (color="green")
 *	  black        create / navigate                (color="black" dark)
 *	  light grey   secondary - Cancel, Print ...    (color="grey lighten-1", restyled below)
 *	  red @ 60%    table row action                 (.table-action-btn)
 */
/* #portal-menu: the header is its own Vue instance without a <v-app>, so no .v-application.
   Date pickers are excluded: their selected day / month is a contained v-btn sized as a circle. */
.v-application .v-btn:not(.v-btn--flat):not(.v-btn--fab):not(.v-btn--tile):not(.v-picker .v-btn),
#portal-menu .v-btn:not(.v-btn--flat):not(.v-btn--fab):not(.v-btn--tile):not(.v-picker .v-btn) {
  height: 34px;
  padding: 0 15px;
  border-radius: 17px;
  font-size: 0.875rem;
}

/* Vuetify scopes its colour classes to .v-application, which the header doesn't have. */
#portal-menu .v-btn.black {
  background-color: #000 !important;
  border-color: #000 !important;
}

/* Table rows. Vuetify wraps several of these in a row/col grid whose 12px padding stacked
   on top of the margin; flatten that so the 9px is the actual gap. */
.v-application .v-data-table td .v-btn:not(.v-btn--flat):not(.v-btn--fab):not(.v-btn--tile):not(.v-picker .v-btn) {
  font-size: 0.8125rem;
  margin-top: 9px;
  margin-bottom: 9px;
}
.v-application .v-data-table td .row:has(.v-btn) {
  margin-top: 0;
  margin-bottom: 0;
}
.v-application .v-data-table td .row > [class*=col]:has(.v-btn) {
  padding-top: 0;
  padding-bottom: 0;
}

/* Secondary. Vuetify's grey lighten-1 with white text read as a disabled button. Disabled
   buttons don't get the colour class, so they keep Vuetify's own disabled look. */
.v-application .v-btn.grey.lighten-1:not(.v-btn--flat) {
  background-color: #e0e0e0 !important;
  border-color: #e0e0e0 !important;
  color: rgba(0, 0, 0, 0.87) !important;
}
.v-application .v-btn.grey.lighten-1:not(.v-btn--flat) .v-icon {
  color: inherit !important;
}

/* Create New User (framework user list, admin dashboard) - black, per the colour roles.
   The framework markup has no hook of its own; this col/button pair is unique to it. */
.v-application .v-card > .row > .col.text-right.mr-4 > .v-btn:only-child {
  background-color: #000 !important;
  color: #fff !important;
}

/* Table row actions (View, View Claim, Order, Edit ...): ALCOM red, knocked back so a
   column of them doesn't shout, full strength on hover. Deliberate exceptions keep their
   own colour: Emulate (blue) and Approve / Deny (green / red carry meaning there). */
.v-application .v-btn.table-action-btn,
.v-application .v-data-table .v-btn.v-btn--rounded.green:has(.mdi-account-edit) {
  background-color: rgba(204, 0, 1, 0.6) !important;
  border-color: transparent !important;
  color: #fff !important;
  -webkit-transition: background-color 0.15s ease;
  -o-transition: background-color 0.15s ease;
  transition: background-color 0.15s ease;
}
.v-application .v-btn.table-action-btn:before,
.v-application .v-data-table .v-btn.v-btn--rounded.green:has(.mdi-account-edit):before {
  display: none;
}
.v-application .v-btn.table-action-btn,
.v-application .v-data-table .v-btn.v-btn--rounded.green:has(.mdi-account-edit) { /* Vuetify's hover wash would fight the colour change */ }
.v-application .v-btn.table-action-btn:hover, .v-application .v-btn.table-action-btn:focus-visible,
.v-application .v-data-table .v-btn.v-btn--rounded.green:has(.mdi-account-edit):hover,
.v-application .v-data-table .v-btn.v-btn--rounded.green:has(.mdi-account-edit):focus-visible {
  background-color: #cc0001 !important;
}
.v-application .v-btn.table-action-btn .v-icon,
.v-application .v-data-table .v-btn.v-btn--rounded.green:has(.mdi-account-edit) .v-icon {
  color: #fff !important;
}

/* A toggle-style row action that is currently "on" (e.g. dealer included in a bulletin). */
.v-application .v-btn.table-action-btn.table-action-btn--on {
  background-color: #cc0001 !important;
}

/* A second row action that shouldn't be another red one (Sales Goals beside Edit on the
   dealers list): dark grey, black on hover - same 60% -> 100% behaviour as the red. */
.v-application .v-btn.table-action-btn.table-action-btn--dark {
  background-color: rgba(0, 0, 0, 0.6) !important;
}
.v-application .v-btn.table-action-btn.table-action-btn--dark:hover, .v-application .v-btn.table-action-btn.table-action-btn--dark:focus-visible {
  background-color: #000 !important;
}

/* Dashboard quotes list: VIEW is black (just look), VIEW/CONFIRM is green (action wanted). */
.v-application .v-btn.table-action-btn.table-action-btn--black {
  background-color: #212121 !important;
}
.v-application .v-btn.table-action-btn.table-action-btn--black:hover, .v-application .v-btn.table-action-btn.table-action-btn--black:focus-visible {
  background-color: #000 !important;
}

.v-application .v-btn.table-action-btn.table-action-btn--go {
  background-color: #4caf50 !important;
}
.v-application .v-btn.table-action-btn.table-action-btn--go:hover, .v-application .v-btn.table-action-btn.table-action-btn--go:focus-visible {
  background-color: #3d9140 !important;
}

/* Edit Dealer: the framework content-editor brings its own "name + SAVE" title row. The
   modal header already names the dealer and the footer has Save, so hide the duplicate. */
.dealer-edit-modal .v-card__text > .v-card > .v-card__title {
  display: none;
}

.dealer-edit-modal .v-card__text > .v-card {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

/*
 *	Framework-owned modals, restyled from here so no framework file changes.
 *
 *	Edit User (common/modules/users/list). Identified by its first-name field, since the
 *	framework markup carries no distinguishing class.
 */
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) > .v-form > .v-card,
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) > .v-card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  max-height: 90vh;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__title.headline {
  background: #cc0001 !important;
  color: #fff;
  padding: 14px 16px 14px 24px;
  font-size: 1.15rem !important;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  line-height: 1.2 !important;
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -ms-flex: none;
  flex: none;
  /* Framework puts the close icon first; move it to the right like every other modal. */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__title.headline > .v-icon {
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
  -ms-flex-order: 2;
  order: 2;
  margin-left: auto;
  color: #fff !important;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  -webkit-transition: background-color 0.15s ease;
  -o-transition: background-color 0.15s ease;
  transition: background-color 0.15s ease;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__title.headline > .v-icon:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__text {
  overflow-y: auto;
  padding-top: 20px !important;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) {
  /* The reset-password button now lives in the footer, not the form body. */
  /* "User is Active" switch in ALCOM green rather than Vuetify primary blue. */
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-input--switch.v-input--is-label-active .v-input--selection-controls__input,
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-input--switch.v-input--is-label-active .v-input--switch__thumb,
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-input--switch.v-input--is-label-active .v-input--switch__track {
  color: #4caf50 !important;
  caret-color: #4caf50 !important;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) {
  /* Footer: inset from the edge, Save on the far right, rounded like the other modals.
     Reset password sits on the left, separated by a spacer. */
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__actions {
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -ms-flex: none;
  flex: none;
  padding: 14px 24px !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__actions > .container {
  padding: 0;
  max-width: none;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__actions > .v-btn + .v-btn {
  margin-left: 8px;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__actions .v-btn {
  border-radius: 28px;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__actions {
  /* Cancel: the secondary grey from the button standard, not alarm red */
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__actions .v-btn.red {
  background-color: #e0e0e0 !important;
  color: rgba(0, 0, 0, 0.87) !important;
}
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) .v-card__actions .v-btn.green {
  background-color: #4caf50 !important;
}

/* Consistent gutters for every step; several steps previously ran their inputs
   right up to the dialog edges while others were indented. */
.wiz-body {
  padding: 20px 24px 8px !important;
}

/* Cancel Vuetify's `.theme--light.v-card > .v-card__text { color: rgba(0,0,0,.54) }`
   (VCard.sass) inside the claim / wizard modals, so body text inherits the card's normal
   colour instead of being washed out. Scoped to .wiz-body: other cards keep Vuetify's default. */
.theme--light.v-card > .v-card__text.wiz-body {
  color: inherit;
}

/* Modal footers reuse .wiz-body for its side gutters, but its 20px top / 8px bottom is
   tuned for content - on a button row it left them sitting low. Even 14px above and below. */
.v-card__actions.wiz-body {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

/* Separate the step content from the Back / Continue row; the buttons previously sat
   almost flush against the bottom panel. */
.wiz-actions {
  margin-top: 20px !important;
}

/* Review-step affordances. The summary is read-only so it reads as a check rather
   than a second copy of the form; each panel offers a way back to the step that
   owns that data. */
/* Small pill buttons in the dark panel headers (were underlined text links, easy to miss).
   Variants for comparison: default = translucent white; --light = light grey; --black. */
.wiz-edit-link {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
  color: #fff !important;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.5;
  text-transform: uppercase;
  text-decoration: none !important;
  -webkit-transition: background-color 0.15s ease;
  -o-transition: background-color 0.15s ease;
  transition: background-color 0.15s ease;
}

.wiz-edit-link:hover {
  background: rgba(255, 255, 255, 0.28);
}

.wiz-edit-link.wiz-edit-link--light {
  background: #e8e8e8;
  color: #212121 !important;
}

.wiz-edit-link.wiz-edit-link--light:hover {
  background: #fff;
}

.wiz-edit-link.wiz-edit-link--black {
  background: #000;
  color: #fff !important;
}

.wiz-edit-link.wiz-edit-link--black:hover {
  background: #111;
  -webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.wiz-edit-link.wiz-edit-link--red {
  background: #cc0001;
  color: #fff !important;
}

.wiz-edit-link.wiz-edit-link--red:hover {
  background: #e00001;
}

/* Scoped under .v-application deliberately. layout/_base.scss:677 sets
   `.site-main p { font-size: 20px }` inside @media(max-width: $breakpoint-sm) —
   specificity (0,1,1), which beats a bare class (0,1,0) and was forcing the review
   description to 20px on mobile only. Scoping here gives (0,2,0), the same trick
   Vuetify uses to protect its own typography classes from element-level rules. */
.v-application .wiz-review-text {
  /* 14px, the same as the other review values (was 13px, which read small). */
  font-size: 0.875rem;
  line-height: 1.5;
  white-space: pre-wrap; /* honour the line breaks the textarea now allows */
}

/* Two-column claim/trailer summary on the View Claim screen: side-by-side dl's
   read as one panel rather than two separate ones, so a hairline stands in for
   the gutter that no-gutters removed. Desktop only - once the columns stack on
   mobile there's nothing to divide. */
@media (min-width: 600px) {
  .wiz-review-col--right {
    border-left: 1px solid #f0efec;
  }
}
.wiz-review-dl {
  margin: 0;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1fr;
  grid-template-columns: auto 1fr;
}
.wiz-review-dl dt, .wiz-review-dl dd {
  margin: 0;
  padding: 10px 16px;
  border-bottom: 1px solid #f0efec;
  /* 14px, matching .wiz-review-text and Vuetify body copy, so every panel on
     the review screen reads at one size. */
  font-size: 0.875rem;
}
.wiz-review-dl dt {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #6a6a6a;
  background: #fcfcfb;
  white-space: nowrap;
}
.wiz-review-dl dt:last-of-type, .wiz-review-dl dd:last-of-type {
  border-bottom: 0;
}

/* Thumbnail grid — actual previews, generated from the File objects the uploader
   already holds, so no uploader component and no server round trip. */
.wiz-review-thumbs {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(110px, 1fr))[auto-fill];
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 10px;
}
.wiz-review-thumbs figure {
  margin: 0;
  border: 1px solid #e8e8e8;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}
.wiz-review-thumbs figcaption {
  font-size: 0.7rem;
  color: #6a6a6a;
  padding: 5px 7px;
  border-top: 1px solid #f0efec;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wiz-review-thumb-fallback {
  height: 90px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #f5f5f5;
}

/* Final submit. Styled exactly like every other CTA; the only addition is pinning
   Vuetify's ::before hover overlay to 0 so it renders at full strength while idle. */
.wiz-submit-btn.v-btn::before {
  opacity: 0 !important;
}

/* Quiet inline link. Used for the "this isn't my name" escape hatch under the
   submitter: the account name is usually right, so this should be discoverable
   without competing with the name itself for attention. */
.wiz-quiet-link {
  display: inline-block;
  margin-top: 4px;
  font-size: 0.875rem;
  font-style: italic;
  color: #999999 !important;
  text-decoration: underline;
}

.wiz-quiet-link:hover {
  color: #6a6a6a !important;
}

/* Wizard instruction text. Was Vuetify .caption (12px), too small for the intake. */
.v-application .wiz-hint {
  font-size: 0.875rem;
  line-height: 1.45;
  color: #616161;
}

.v-application .wiz-hint--small {
  font-size: 0.8125rem;
}

/* The one-line lead at the top of a wizard step ("Review and submit your claim.",
   "Enter your estimates below."): 16px, weight 500. */
.v-application .wiz-lead {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  color: #424242;
}

/* "Submitted by <name>" once the account holder is identified: green check, readable name. */
.wiz-submitter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1rem;
  font-weight: 600;
}
.wiz-submitter .v-icon {
  color: #43a047 !important;
  font-size: 22px !important;
  margin-right: 8px;
}

.wiz-section-title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6a6a6a;
  margin-bottom: 10px;
}

.wiz-panel {
  /* Subtle elevation, no border — matches the VIN method cards and the rest of
     the portal. A hairline border here read as a different component family. */
  border-radius: 4px;
  background: #fff;
  overflow: hidden;
  -webkit-box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
}
.wiz-panel .wiz-panel-head {
  background: #333333;
  color: #fff;
  padding: 10px 15px;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.wiz-panel .wiz-panel-head .v-icon {
  color: #fff !important;
  margin-right: 9px;
  font-size: 18px !important;
}
.wiz-panel .wiz-panel-body {
  padding: 16px;
}
.wiz-panel {
  /* The embedded uploader renders its own <v-card-title>. We pass an empty title
     (the panel header above already names the section), so collapse it — but keep
     it styled, since it still shows "Drop File Here" while dragging. */
}
.wiz-panel .v-card__title {
  padding: 0;
  min-height: 0;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.3;
}
.wiz-panel .v-card__title:empty {
  display: none;
}
.wiz-panel {
  /* The photo uploader is a framework component that renders its own <v-card>
     (elevation, radius, padding) — nested inside this panel that reads as a
     double-shadowed "panel within a panel". Flatten it so the uploader's
     controls sit directly in this panel's body instead. */
}
.wiz-panel .v-card#app {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  border-radius: 0;
  background: transparent;
}
.wiz-panel .v-card#app > .v-card__text {
  padding: 0;
}

/*
 *	WARRANTY CLAIM WIZARD — VIN STEP
 *	The two VIN-entry methods were previously two identical white cards with
 *	plain text headings, which read as one undifferentiated block. Solid colour
 *	headers let the eye separate "scan" from "type" immediately.
 */
.vin-method-card {
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  border-radius: 4px;
  overflow: hidden;
  /* Both headers are the first child of a rounded card; inherit its top radius so
     scan and manual match. Previously only the scan card appeared rounded. */
}
.vin-method-card .vin-method-head {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 11px 15px;
  color: #fff;
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  line-height: 1.2;
}
.vin-method-card .vin-method-head .v-icon {
  color: #fff !important;
  margin-right: 9px;
}
.vin-method-card .vin-method-head--scan {
  background: #cc0001;
}
.vin-method-card .vin-method-head--manual {
  background: #333333;
}
.vin-method-card .vin-method-body {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 14px 16px 18px;
}

/* Trailer confirmation — shown once a VIN resolves, in place of the two cards. */
.vin-confirm {
  border-radius: 4px;
  overflow: hidden;
  -webkit-box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
}
.vin-confirm .vin-confirm-head {
  background: #f0f8f1;
  border-bottom: 1px solid #c3e2c5;
  padding: 12px 16px;
}
.vin-confirm .vin-confirm-title {
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.3;
}
.vin-confirm .vin-confirm-sub {
  font-size: 0.875rem;
  color: #6a6a6a;
}
.vin-confirm dl {
  margin: 0;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1fr;
  grid-template-columns: auto 1fr;
}
.vin-confirm dt, .vin-confirm dd {
  margin: 0;
  padding: 10px 16px;
  border-bottom: 1px solid #f0efec;
  font-size: 1rem; /* the trailer details are the point of this panel - read them at a glance */
}
.vin-confirm dt {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #6a6a6a;
  background: #fcfcfb;
  white-space: nowrap;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.vin-confirm {
  /* VIN and invoice read as stamped identifiers, and monospace makes it far
     easier to eyeball a 17-character string digit by digit. */
}
.vin-confirm dd.vin-mono {
  font-family: "SF Mono", "Roboto Mono", Consolas, monospace;
  letter-spacing: 0.05em;
  font-weight: 600;
}
.vin-confirm dt:last-of-type, .vin-confirm dd:last-of-type {
  border-bottom: 0;
}
.vin-confirm .vin-confirm-foot {
  padding: 10px 16px;
  background: #fcfcfb;
  border-top: 1px solid #f0efec;
  font-size: 0.875rem;
  color: #6a6a6a;
}

.vin-confirm.vin-confirm--unmatched .vin-confirm-head {
  background: #ffdddd;
  border-bottom-color: #f0b6b6;
}

/* Link buttons (v-btn with href - the main nav, etc.): Bootstrap 3's a:focus rule outranks
   Vuetify's .v-btn { outline: 0 } and drew Chrome's thick blue focus ring inside the button
   on every click, on top of Vuetify's own white focus wash. Mouse clicks keep just the wash;
   keyboard focus gets a thin ring in the button's text colour (white on the red nav). */
a.v-btn:focus {
  outline: none;
}

a.v-btn:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -4px;
}

/*
 *	VUETIFY DATA TABLE OVERRIDES
 *	Migrated 2026-08-17 from hand-edits made directly to the compiled
 *	css/global.css, where they were being destroyed on every Gulp run.
 *	Edit these here — never in css/global.css.
 */
.v-application .green {
  color: white !important;
}

.v-data-table .v-data-table__mobile-row__cell {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 0;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-width: 200px;
}
.v-data-table .v-data-table-header {
  vertical-align: top;
}
.v-data-table .v-data-table__mobile-row:nth-child(2) {
  border-top: 1px solid #efefef !important;
}
.v-data-table {
  /* No zebra striping on phone cards (it was light red, and on the claims list it
     competed with the Status / Approved tints). Rows are white with a hairline between
     them - see the max-width: 600px block below. */
}
.v-data-table .v-data-table__mobile-row:last-child {
  border-bottom: 5px solid transparent !important;
  min-height: 36px;
}
.v-data-table .v-data-footer {
  -webkit-flex-wrap: nowrap !important;
  -ms-flex-wrap: nowrap !important;
  flex-wrap: nowrap !important;
}

/*
 *	Claims list: soft tints for Status and Approved.
 *	Kept deliberately faint so they cue rather than dominate. Red and teal are left out
 *	on purpose - in this list they already mean ALCOM vs dealer (MSG chips, attachment
 *	borders). Frequency drives intensity: on prod nearly every open claim is Pending and
 *	~99.8% of claims are unapproved, so Pending and "No" get the quietest tints and the
 *	rarer states that need eyes (Open, Yes) stand out a little more.
 *	Uses :has() (already relied on for the mobile card stripes); browsers without it just
 *	show the plain cell. The selector is prefixed to outrank the mobile zebra striping.
 */
.v-data-table .v-data-table__wrapper td:has(.claim-tint--status-1) {
  background-color: #e8f0fb !important;
}
.v-data-table .v-data-table__wrapper .claim-tint--status-1 {
  color: #1e4f8a;
}
.v-data-table .v-data-table__wrapper td:has(.claim-tint--status-2) {
  background-color: #fdf4e3 !important;
}
.v-data-table .v-data-table__wrapper .claim-tint--status-2 {
  color: #7a5300;
}
.v-data-table .v-data-table__wrapper td:has(.claim-tint--status-3) {
  background-color: #efefef !important;
}
.v-data-table .v-data-table__wrapper .claim-tint--status-3 {
  color: #5f5f5f;
}
.v-data-table .v-data-table__wrapper td:has(.claim-tint--approved-yes) {
  background-color: #e6f3e8 !important;
}
.v-data-table .v-data-table__wrapper .claim-tint--approved-yes {
  color: #2a6b33;
}
.v-data-table .v-data-table__wrapper td:has(.claim-tint--approved-no) {
  background-color: #f7f6f4 !important;
}
.v-data-table .v-data-table__wrapper .claim-tint--approved-no {
  color: #8a8a8a;
}
.v-data-table .v-data-table__wrapper {
  /* Frame the tinted cells with the table's own row-divider line (Vuetify light theme
     uses thin rgba(0,0,0,.12)) so adjacent tints - e.g. an Open (blue) next to a Yes
     (green) - read as separate cells. Status gets the left edge, Approved both, which
     leaves a single line between them. Desktop only: mobile rows are already cards. */
}
.v-data-table .v-data-table__wrapper td:not(.v-data-table__mobile-row):has(.claim-tint) {
  border-left: thin solid rgba(0, 0, 0, 0.12);
}
.v-data-table .v-data-table__wrapper td:not(.v-data-table__mobile-row):has(.claim-tint--approved-yes),
.v-data-table .v-data-table__wrapper td:not(.v-data-table__mobile-row):has(.claim-tint--approved-no) {
  border-right: thin solid rgba(0, 0, 0, 0.12);
}

.claim-tint {
  font-weight: 500;
}

/* Claim window: the same status tint as the list, so a colour means the same thing in
   both places. The fill goes on .v-input__slot, which wraps both the selected text and
   the dropdown arrow, so it reads as one continuous shape; the underline is dropped
   because a filled, rounded field with an arrow already reads as a dropdown. */
.claim-status-field {
  /* v-text-field's default top padding/margin (room for a floating label this field
     doesn't use) pushed the pill below the STATUS label beside it. */
}
.claim-status-field.v-text-field {
  padding-top: 0 !important;
  margin-top: -6px !important;
}
.claim-status-field .v-input__slot {
  padding: 0 4px 0 12px !important;
  border-radius: 4px;
}
.claim-status-field .v-input__slot:before, .claim-status-field .v-input__slot:after {
  display: none !important;
}
.claim-status-field .v-select__selection {
  font-weight: 500;
  margin: 0;
}

/* Read-only status (claim not editable): same tint as a compact badge. */
/* Claim-modal notice (e.g. "no actual costs recorded" when closing). Replaces a solid orange
   v-alert: neutral panel, thin amber accent, dark text - informative without shouting. */
.v-application .claim-notice {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 14px;
  background: #fafafa;
  border: 1px solid #e0e0e0;
  border-left: 3px solid #f0a020;
  border-radius: 4px;
  font-size: 0.875rem;
  line-height: 1.45;
  color: rgba(0, 0, 0, 0.78);
}
.v-application .claim-notice .claim-notice__icon {
  color: #e08e0b !important;
  margin-top: 2px;
}

.claim-status-badge {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 4px;
  font-weight: 500;
}

.claim-status-field.claim-tint-bg--status-1 .v-input__slot,
.claim-status-badge.claim-tint-bg--status-1 {
  background-color: #e8f0fb !important;
}

.claim-status-field.claim-tint-bg--status-1 .v-select__selection,
.claim-status-field.claim-tint-bg--status-1 .v-input__icon .v-icon,
.claim-status-badge.claim-tint-bg--status-1 {
  color: #1e4f8a !important;
}

.claim-status-field.claim-tint-bg--status-2 .v-input__slot,
.claim-status-badge.claim-tint-bg--status-2 {
  background-color: #fdf4e3 !important;
}

.claim-status-field.claim-tint-bg--status-2 .v-select__selection,
.claim-status-field.claim-tint-bg--status-2 .v-input__icon .v-icon,
.claim-status-badge.claim-tint-bg--status-2 {
  color: #7a5300 !important;
}

.claim-status-field.claim-tint-bg--status-3 .v-input__slot,
.claim-status-badge.claim-tint-bg--status-3 {
  background-color: #efefef !important;
}

.claim-status-field.claim-tint-bg--status-3 .v-select__selection,
.claim-status-field.claim-tint-bg--status-3 .v-input__icon .v-icon,
.claim-status-badge.claim-tint-bg--status-3 {
  color: #5f5f5f !important;
}

.claim-status-field.claim-tint-bg--approved-yes .v-input__slot,
.claim-status-badge.claim-tint-bg--approved-yes {
  background-color: #e6f3e8 !important;
}

.claim-status-field.claim-tint-bg--approved-yes .v-select__selection,
.claim-status-field.claim-tint-bg--approved-yes .v-input__icon .v-icon,
.claim-status-badge.claim-tint-bg--approved-yes {
  color: #2a6b33 !important;
}

.claim-status-field.claim-tint-bg--approved-no .v-input__slot,
.claim-status-badge.claim-tint-bg--approved-no {
  background-color: #f7f6f4 !important;
}

.claim-status-field.claim-tint-bg--approved-no .v-select__selection,
.claim-status-field.claim-tint-bg--approved-no .v-input__icon .v-icon,
.claim-status-badge.claim-tint-bg--approved-no {
  color: #8a8a8a !important;
}

.v-application--is-ltr .v-data-footer .v-data-footer__pagination {
  margin: 0 0 0 24px !important;
}

@media (max-width: 600px) {
  .v-data-table .v-data-table__mobile-row:first-child {
    display: none;
  }
  .v-data-table {
    /*
     *	Stacked claims read as separate cards.
     *	Vuetify's mobile view still renders real table semantics (tr = table-row),
     *	and margins do not apply to table rows — which is why consecutive claims sat
     *	flush against each other with the status stripe running unbroken down the
     *	whole list. Dropping the table display roles for table/tbody/tr in mobile
     *	only lets each row become a block we can space, round and elevate.
     */
  }
  .v-data-table .v-data-table__wrapper > table,
  .v-data-table .v-data-table__wrapper > table > tbody,
  .v-data-table .v-data-table__wrapper > table > tbody > tr {
    display: block;
    width: 100%;
  }
  .v-data-table .v-data-table__wrapper > table > tbody > tr {
    margin-bottom: 16px;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    -webkit-box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
    border-left: 4px solid transparent;
  }
  .v-data-table .v-data-table__wrapper > table > tbody > tr:last-child {
    margin-bottom: 4px;
  }
  .v-data-table {
    /* Status stripe now terminates with each card instead of running the full list. */
  }
  .v-data-table tbody tr:has(.v-chip.alcom-color) {
    border-left-color: #cc0001;
  }
  .v-data-table tbody tr:has(.v-chip.dealer-color),
  .v-data-table tbody tr:has(.v-chip.no-color) {
    border-left-color: #009688;
  }
  .v-data-table {
    /* White rows with a very light divider between them. */
  }
  .v-data-table .v-data-table__mobile-row {
    border: 0 !important;
    border-bottom: 1px solid #eeeeee !important;
    background-color: #fff;
  }
  .v-data-table {
    /* Tapping a card fired Vuetify's row :hover grey (sticky on touch screens). */
  }
  .v-data-table .v-data-table__wrapper > table > tbody > tr:hover:not(.v-data-table__expanded__content) {
    background: #fff !important;
  }
  .v-data-table {
    /*
     *	Action rows (Edit / Emulate, Approve / Deny / Spam, the dealer icons, View Claim).
     *	Every mobile cell is capped at ~200px with overflow hidden (for long values that
     *	ellipsize), which clipped these buttons or crushed their text to the edges. A row
     *	holding buttons drops its "Actions" label and gives the buttons the full card width.
     */
  }
  .v-data-table .v-data-table__mobile-row:has(.v-btn) .v-data-table__mobile-row__header {
    display: none;
  }
  .v-data-table .v-data-table__mobile-row:has(.v-btn) .v-data-table__mobile-row__cell {
    max-width: none;
    min-width: 0;
    width: 100%;
    overflow: visible;
    text-align: right;
  }
  .v-data-table .v-data-table__mobile-row:has(.v-btn) .v-data-table__mobile-row__cell > .row {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
  }
  .v-data-table .v-data-table__mobile-row:has(.v-btn) .v-data-table__mobile-row__cell > .row > .col {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0;
    -ms-flex: 1 1 0px;
    flex: 1 1 0;
    max-width: none;
    padding: 0;
  }
  .v-data-table .v-data-table__mobile-row:has(.v-btn) {
    /* Columns holding ordinary (non-block) buttons shrink to the button, so they sit
       at the right edge instead of in a half-width column (parts Order / Reorder). */
  }
  .v-data-table .v-data-table__mobile-row:has(.v-btn) .v-data-table__mobile-row__cell > .row > [class*=col]:not(:has(.v-btn--block)) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    padding: 0;
  }
  .v-data-table .v-data-table__mobile-row:has(.v-btn) .v-btn:not(.v-btn--icon) {
    padding: 0 12px;
  }
  .v-data-table .v-data-table__mobile-row:last-child {
    border-bottom: 0 !important;
  }
  .v-data-table {
    /* VIN as a black header band: separates each card at a glance and gives
       the field dealers scan for first the most visual weight. */
  }
  .v-data-table .v-data-table__mobile-row:nth-child(2) {
    background-color: #000 !important;
  }
  .v-data-table .v-data-table__mobile-row:nth-child(2) .v-data-table__mobile-row__header,
  .v-data-table .v-data-table__mobile-row:nth-child(2) .v-data-table__mobile-row__cell {
    color: #fff !important;
  }
}
/* Sales Goals modal on phones: the delete icon gets its own line under the dates;
   pull it up into the dates' empty hint space so each goal stays compact. */
@media (max-width: 599px) {
  .sales-goal-delete {
    margin-top: -28px;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}
/*
 *	PAGE LAYOUT STANDARD (2026-09-14)
 *	Every portal page uses the same frame, so a page reads the same wherever you land:
 *	  <div class="portal-page">                     20px side gutter (16px on phones)
 *	    <div class="portal-page-head">
 *	      <h1 class="portal-page-title">Title</h1>   24px / weight 900
 *	      <div class="portal-page-actions">...</div> filters, search, primary button - right
 *	    </div>
 *	    ...content / table...
 *	Tables inside a page run their row lines from gutter to gutter, with the first and last
 *	columns' text flush to the lines so it lines up with the heading above.
 *	Vertical rhythm: 24px from the red bar to the heading, 16px from the heading to content.
 */
.portal-page {
  padding: 24px 20px 28px;
  background: #fff;
}
@media (max-width: 599px) {
  .portal-page {
    padding: 16px 16px 20px;
  }
}

/* Pages built from a single <v-card>: no floating shadowed slab spanning the window. */
.v-card.portal-page {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  border-radius: 0;
}

/* A white app background for list pages, so short content doesn't end in a grey void. */
.v-application.portal-app {
  background: #fff !important;
}

.portal-page-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 12px 24px;
  margin-bottom: 16px;
  min-height: 40px;
}

.v-application .portal-page-title,
.portal-page-title {
  margin: 0;
  font-family: Roboto, sans-serif;
  font-size: 1.5rem;
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: 0;
  color: rgba(0, 0, 0, 0.87);
}

.portal-page-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  gap: 12px 20px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 0;
  /* Search / select fields in a head row: a sensible width, no reserved message line. */
}
.portal-page-actions > .v-input {
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 320px;
  -ms-flex: 0 1 320px;
  flex: 0 1 320px;
  min-width: 200px;
  margin-top: 0;
  padding-top: 0;
}

@media (max-width: 599px) {
  .portal-page-actions {
    -webkit-box-pack: stretch;
    -webkit-justify-content: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch;
  }
  .portal-page-actions > .v-input {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
  }
}
/* Filter row under a page head: fixed-width selects, a search that takes the rest. */
.portal-filters {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
  gap: 12px 20px;
  margin-bottom: 12px;
}
.portal-filters > .v-input {
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 280px;
  -ms-flex: 0 1 280px;
  flex: 0 1 280px;
  min-width: 200px;
  margin-top: 0;
  padding-top: 0;
}
.portal-filters > .v-input.portal-filter--grow {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 280px;
  -ms-flex: 1 1 280px;
  flex: 1 1 280px;
}
@media (max-width: 599px) {
  .portal-filters > .v-input, .portal-filters > .v-input.portal-filter--grow {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
  }
}

/* A labelled primary button in a page head keeps its natural width (components such as the
   claim wizard ask for `block`, which is right for phones only). */
@media (min-width: 600px) {
  .portal-page-actions .v-btn.v-btn--block {
    min-width: 0 !important;
    width: auto;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
  }
}
@media (max-width: 599px) {
  .portal-page-actions > * {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 100%;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
  }
}
.v-application .portal-section-title,
.portal-section-title {
  margin: 0;
  font-family: Roboto, sans-serif;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
  color: rgba(0, 0, 0, 0.87);
}

/* Dashboard: the orders list follows the panels directly - one gap, not two paddings. */
.portal-page.portal-dashboard-orders {
  padding-top: 4px;
}

.portal-page .v-data-table > .v-data-table__wrapper > table > thead > tr > th:first-child,
.portal-page .v-data-table > .v-data-table__wrapper > table > tbody > tr > td:first-child:not(.v-data-table__mobile-row) {
  padding-left: 0;
}
.portal-page .v-data-table > .v-data-table__wrapper > table > thead > tr > th:last-child,
.portal-page .v-data-table > .v-data-table__wrapper > table > tbody > tr > td:last-child:not(.v-data-table__mobile-row) {
  padding-right: 0;
}
.portal-page .v-data-table {
  /* The pagination footer's own right padding would sit it inside the gutter. */
}
.portal-page .v-data-table .v-data-footer {
  padding-right: 0;
  margin-right: 0;
}

/* Empty / unavailable states inside a page (e.g. no stock, no downloads). */
.portal-empty {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 8px;
  padding: 48px 20px;
  text-align: center;
  color: rgba(0, 0, 0, 0.6);
}
.portal-empty .v-icon {
  font-size: 48px !important;
  color: rgba(0, 0, 0, 0.25) !important;
}
.portal-empty .portal-empty-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.75);
}
.portal-empty .portal-empty-text {
  font-size: 0.875rem;
  max-width: 460px;
}

/*
 *	DEALER DASHBOARD
 *	Three equal columns of panels; every panel in the row shares one height (the left
 *	column's second panel stretches to make up the difference). One column below 960px.
 */
.dash-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(0, 1fr))[3];
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
@media (max-width: 959px) {
  .dash-grid {
    -ms-grid-columns: minmax(0, 1fr);
    grid-template-columns: minmax(0, 1fr);
  }
}

.dash-stack {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 20px;
}
.dash-stack > .dash-card {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
}
.dash-stack > .dash-card:last-child {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

/* Plant Orders summary. Clicking a row filters the orders list below. */
.dash-card .dash-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9375rem;
  font-variant-numeric: tabular-nums;
}
.dash-card .dash-table th {
  padding: 0 8px 8px;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.55);
  text-align: left;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.dash-card .dash-table td {
  padding: 9px 8px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  white-space: nowrap;
}
.dash-card .dash-table tr:last-child td {
  border-bottom: 0;
}
.dash-card .dash-table th:first-child, .dash-card .dash-table td:first-child {
  padding-left: 10px;
}
.dash-card .dash-table th:last-child, .dash-card .dash-table td:last-child {
  padding-right: 10px;
}
.dash-card .dash-table .dash-num {
  text-align: right;
}
.dash-card .dash-table td.dash-num:last-child {
  font-weight: 500;
}
.dash-card .dash-table .dash-empty {
  color: rgba(0, 0, 0, 0.3);
}
.dash-card .dash-table tbody tr.widget-clickable {
  -webkit-transition: background-color 0.12s ease;
  -o-transition: background-color 0.12s ease;
  transition: background-color 0.12s ease;
}
.dash-card .dash-table tbody tr.widget-clickable:nth-child(odd) {
  background-color: #fdf3f3;
}
.dash-card .dash-table tbody tr.widget-clickable:hover {
  background-color: #f8dede !important;
}

/*
 *	CONTACT US MODAL (contact-drawer / contact-card)
 */
.contact-drawer-body.wiz-body {
  padding-bottom: 24px !important;
}

.contact-drawer-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(0, 1fr))[3];
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
@media (max-width: 959px) {
  .contact-drawer-grid {
    -ms-grid-columns: minmax(0, 1fr);
    grid-template-columns: minmax(0, 1fr);
  }
}
.contact-drawer-grid.contact-drawer-grid--single {
  -ms-grid-columns: minmax(0, 1fr);
  grid-template-columns: minmax(0, 1fr);
}

.contact-card.wiz-panel {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100%;
}
.contact-card.wiz-panel .contact-card-tabs {
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -ms-flex: none;
  flex: none;
}
.contact-card.wiz-panel .v-tab .v-icon {
  color: inherit;
}
.contact-card.wiz-panel {
  /* The tab area fills the card, so a short card's buttons still sit at the bottom edge. */
}
.contact-card.wiz-panel .contact-card-body.v-tabs-items {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}
.contact-card.wiz-panel .contact-card-body.v-tabs-items > .v-window__container {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}
.contact-card.wiz-panel .contact-card-body.v-tabs-items .v-window-item {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}
.contact-card.wiz-panel .contact-card-body.v-tabs-items .v-window-item > .contact-card-info {
  height: 100%;
}

.contact-card-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 20px 22px 22px;
}
.contact-card-info > .v-form {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

.contact-card-name {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 12px;
}

.contact-card-details {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto 1fr;
  grid-template-columns: auto 1fr;
  gap: 6px 14px;
  margin: 0;
  font-size: 0.9375rem;
}
.contact-card-details dt {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.5);
  line-height: 1.9;
}
.contact-card-details dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}
.contact-card-details a {
  color: rgba(0, 0, 0, 0.87) !important;
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.contact-card-details a:hover {
  color: #cc0001 !important;
  border-bottom-color: currentColor;
}

.contact-card-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: auto;
  padding-top: 20px;
}
.contact-card-actions.contact-card-actions--end {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.contact-card-sent {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  font-weight: 500;
}

/*
 *	VUETIFY THEME COLOURS (site-wide)
 *	Every page builds its own `new Vuetify()` with the default theme, so focused fields, tabs,
 *	date pickers and checkboxes were Material blue. Vuetify injects its theme stylesheet at
 *	runtime (after this file), so these selectors carry extra weight to win.
 *	  primary (focus, active controls) -> near-black: reads as "selected" without being
 *	                                      mistaken for an error, which red would be
 *	  accent  (picked date / month)    -> ALCOM red
 */
html body .v-application .primary {
  background-color: #212121 !important;
  border-color: #212121 !important;
}
html body .v-application .primary--text {
  color: #212121 !important;
  caret-color: #212121 !important;
}
html body .v-application .accent {
  background-color: #cc0001 !important;
  border-color: #cc0001 !important;
}
html body .v-application .accent--text {
  color: #cc0001 !important;
  caret-color: #cc0001 !important;
}

/*
 *	DEALER ADMINISTRATION - bulletin panels
 */
.dealer-panels.v-expansion-panels {
  margin-bottom: 20px;
  gap: 12px;
}
.dealer-panels.v-expansion-panels .dealer-panel.v-expansion-panel {
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 6px !important;
  margin-top: 0 !important;
  background: #fff;
}
.dealer-panels.v-expansion-panels .dealer-panel.v-expansion-panel:before {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.dealer-panels.v-expansion-panels .dealer-panel.v-expansion-panel:after {
  display: none;
}
.dealer-panels.v-expansion-panels .dealer-panel.v-expansion-panel--active {
  border-color: rgba(0, 0, 0, 0.2);
}
.dealer-panels.v-expansion-panels .dealer-panel-head.v-expansion-panel-header {
  min-height: 56px;
  padding: 12px 20px;
  background: #fafafa;
  border-radius: 6px;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 2px 16px;
}
.dealer-panels.v-expansion-panels .v-expansion-panel--active > .dealer-panel-head {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 6px 6px 0 0;
}
.dealer-panels.v-expansion-panels .dealer-panel-title {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px;
  font-size: 1rem;
  font-weight: 700;
}
.dealer-panels.v-expansion-panels .dealer-panel-title .v-icon {
  color: #cc0001;
  font-size: 22px;
}
.dealer-panels.v-expansion-panels .dealer-panel-sub {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  font-size: 0.8125rem;
  color: rgba(0, 0, 0, 0.55);
}
.dealer-panels.v-expansion-panels .v-expansion-panel-content__wrap {
  padding: 16px 20px 20px;
}

/*
 *	ADMIN: PORTAL USERS (framework user-list, fitted to the page standard from here)
 */
.portal-users > .v-application {
  background: #fff !important;
}
.portal-users .v-application > .v-application--wrap {
  min-height: 0;
}
.portal-users .v-application--wrap > .v-card {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
.portal-users {
  /* Status select + pending chip + search: one filter row, no card-title padding. */
}
.portal-users .v-application--wrap > .v-card > .v-card__title {
  padding: 0 0 8px;
  gap: 12px 20px;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
}
.portal-users .v-application--wrap > .v-card > .v-card__title > .v-input {
  -webkit-box-flex: 0;
  -webkit-flex: 0 1 280px;
  -ms-flex: 0 1 280px;
  flex: 0 1 280px;
}
.portal-users .v-application--wrap > .v-card > .v-card__title > .v-input:last-child {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 280px;
  -ms-flex: 1 1 280px;
  flex: 1 1 280px;
}
.portal-users .v-application--wrap > .v-card > .v-card__title .v-input__prepend-outer {
  display: none;
}
.portal-users .v-application--wrap > .v-card > .v-card__title { /* the framework passes a non-existent "dollar" icon */ }
.portal-users {
  /* The Create New User row sits flush right with the table below it. */
}
.portal-users .v-application--wrap > .v-card > .row {
  margin: 0 0 4px;
}
.portal-users .v-application--wrap > .v-card > .row > .col.text-right.mr-4 {
  margin-right: 0 !important;
  padding: 8px 0;
}

/* Edit / Create User modal: capped width instead of spanning a large monitor edge to edge.
   Its two-column body already stacks below 960px (Vuetify md). */
.v-dialog:has(input[name=nameFirst]):has(.v-card__title.headline) {
  max-width: 1000px;
}

/* Footer copyright bar (shell/footer.tpl reuses .portal-menu): same 20px gutter as the pages. */
.portal-menu:not(.portal-nav) {
  padding: 10px 20px;
}
@media (max-width: 599px) {
  .portal-menu:not(.portal-nav) {
    padding: 10px 16px;
  }
}

/*
 *	DEALER ADMINISTRATION - bulletin composer modal
 */
.bulletin-panel + .bulletin-panel {
  margin-top: 16px;
}

.bulletin-audience .v-label {
  font-size: 0.9375rem;
}

.bulletin-note {
  font-size: 0.875rem;
  color: rgba(0, 0, 0, 0.6);
  margin: 10px 0 0;
}

.bulletin-chosen-head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 4px 12px;
  margin-top: 14px;
}

.bulletin-chosen-count {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.55);
}

.bulletin-chosen-actions {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 4px;
  margin-right: -8px;
}

.v-application .bulletin-chosen-actions .v-btn {
  padding: 0 8px;
}

.bulletin-chips {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
  max-height: 168px;
  overflow-y: auto;
}

.bulletin-link-fields,
.bulletin-date-fields {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(0, 1fr))[2];
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 16px;
  margin-top: 14px;
}
@media (max-width: 599px) {
  .bulletin-link-fields,
  .bulletin-date-fields {
    -ms-grid-columns: minmax(0, 1fr);
    grid-template-columns: minmax(0, 1fr);
  }
}

/* The month/date pickers reserve a message line the other fields don't. */
.bulletin-date-fields .v-text-field__details {
  display: none;
}

.bulletin-date-fields .v-input__slot {
  margin-bottom: 0;
}

/* l8-date-picker renders an empty <div class="v-menu"> beside its field. It is invisible but
   still takes a grid cell, which pushed the two date fields onto separate rows. */
.bulletin-date-fields > .v-menu {
  display: none;
}

/* Vuetify centres the radio's 24px control against a shorter label box, which reads as the
   circle sitting low next to the text. */
.bulletin-audience .v-radio .v-input--selection-controls__input {
  margin-top: -2px;
}

.bulletin-more {
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  font-size: 0.8125rem;
  color: rgba(0, 0, 0, 0.6);
}

/* Portal Users: the pending-users count is a call to action, not a neutral chip. */
.portal-users .v-card__title .v-chip {
  background-color: #4caf50 !important;
  color: #fff !important;
  font-weight: 600;
}

/*
 *	GREEN CTA HOVER (site-wide)
 *	Light green (green lighten-2: Start a New Claim, Continue, Submit Claim, Approve...) is the
 *	resting state; hover goes to full-strength green, like the table actions go from 60% to
 *	100% red. Vuetify's own hover laid a white wash over the button, which made it paler and
 *	lower-contrast on hover - the opposite of "more active".
 */
.v-application .v-btn.green.lighten-2:not(.v-btn--disabled):not(.v-btn--flat) {
  -webkit-transition: background-color 0.15s ease;
  -o-transition: background-color 0.15s ease;
  transition: background-color 0.15s ease;
}
.v-application .v-btn.green.lighten-2:not(.v-btn--disabled):not(.v-btn--flat):before {
  display: none;
}
.v-application .v-btn.green.lighten-2:not(.v-btn--disabled):not(.v-btn--flat):hover, .v-application .v-btn.green.lighten-2:not(.v-btn--disabled):not(.v-btn--flat):focus-visible {
  background-color: #4caf50 !important;
  border-color: #4caf50 !important;
}

/* Claim submitted confirmation (ticket-wizard). */
.claim-submitted-body.v-card__text {
  padding: 28px 28px 8px !important;
  text-align: center;
  color: rgba(0, 0, 0, 0.87) !important;
}

.claim-submitted .claim-submitted-icon.v-icon {
  font-size: 56px;
  color: #4caf50;
}

.claim-submitted-title {
  font-size: 1.25rem;
  font-weight: 700;
  margin-top: 6px;
}

.claim-submitted-facts {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 4px 16px;
  margin-top: 10px;
  font-size: 0.9375rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.claim-submitted-text {
  font-size: 0.875rem;
  color: rgba(0, 0, 0, 0.6);
  margin: 12px 0 0;
}

.claim-submitted-actions.v-card__actions {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 16px 28px 24px !important;
}

/* Upload buttons that stand in for file inputs (VIN photo, claim photos). */
.v-application .v-btn.upload-btn .v-icon {
  font-size: 20px;
}

/* Same secondary grey whether or not the template asked for grey lighten-1. */
.v-application .v-btn.upload-btn:not(.v-btn--disabled):not(.v-btn--flat) {
  background-color: #e0e0e0 !important;
  color: rgba(0, 0, 0, 0.87) !important;
}
.v-application .v-btn.upload-btn:not(.v-btn--disabled):not(.v-btn--flat) .v-icon {
  color: inherit !important;
}
/*# sourceMappingURL=//ryan.local/alcom/public/maps/global.css.map */