/*============================================================================
  Shopify Timber v2.0.0 | github.com/shopify/timber
  Copyright 2014 Shopify Inc.
  Author Carson Shold @cshold
  Built with Sass - http://sass-lang.com/

  Some things to know about this file:
    - Sass is compiled on Shopify's server so you don't need to convert it to CSS yourself
    - The output CSS is compressed and comments are removed
    - This file merges your stylesheets into one master at assets/timber.scss.liquid
==============================================================================*/

/*================ Variables, theme settings, and Sass mixins ================*/
/*================ Global | Sass Mixins ================*/


body {
  
  overflow-x: hidden; /* Hide horizontal scrollbar */
}







@mixin clearfix() {
  &:after {
    content: "";
    display: table;
    clear: both; }
  *zoom: 1;
}

@mixin prefix($property, $value) {
  -webkit-#{$property}: #{$value};
  -moz-#{$property}: #{$value};
  -ms-#{$property}: #{$value};
  -o-#{$property}: #{$value};
  #{$property}: #{$value};
}

/*============================================================================
  Prefix mixin for generating vendor prefixes.
  Based on https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/addons/_prefixer.scss
  Usage:
    // Input:
    .element {
      @include prefix(transform, scale(1), ms webkit spec);
    }
    // Output:
    .element {
      -ms-transform: scale(1);
      -webkit-transform: scale(1);
      transform: scale(1);
    }
==============================================================================*/
@mixin prefixFlex($property, $value, $prefixes) {
  @each $prefix in $prefixes {
    @if $prefix == webkit {
      -webkit-#{$property}: $value;
    } @else if $prefix == moz {
      -moz-#{$property}: $value;
    } @else if $prefix == ms {
      -ms-#{$property}: $value;
    } @else if $prefix == o {
      -o-#{$property}: $value;
    } @else if $prefix == spec {
      #{$property}: $value;
    } @else  {
      @warn 'Unrecognized prefix: #{$prefix}';
    }
  }
}

@mixin transition($transition: 0.1s all) {
  @include prefix('transition', #{$transition});
}

@mixin transform($transform: 0.1s all) {
  @include prefix('transform', #{$transform});
}



@mixin backface($visibility: hidden) {
  @include prefix('backface-visibility', #{$visibility});
}

@mixin visuallyHidden {
  clip: rect(0 0 0 0);
  clip: rect(0, 0, 0, 0);
  overflow: hidden;
  position: absolute;
  height: 1px;
  width: 1px;
}

@mixin box-sizing($box-sizing: border-box) {
  -webkit-box-sizing: #{$box-sizing};
  -moz-box-sizing: #{$box-sizing};
  box-sizing: #{$box-sizing};
}

@function em($target, $context: $baseFontSize) {
  @if $target == 0 {
    @return 0;
  }
  @return $target / $context + 0em;
}

@function color-control($color) {
  @if (lightness( $color ) > 50) {
    @return #000;
  }
  @else {
    @return #fff;
  }
}

/*============================================================================
  Dependency-free breakpoint mixin
    - http://blog.grayghostvisuals.com/sass/sass-media-query-mixin/
==============================================================================*/
$min: min-width;
$max: max-width;
@mixin at-query ($constraint, $viewport1, $viewport2:null) {
  @if $constraint == $min {
    @media screen and ($min: $viewport1) {
      @content;
    }
  } @else if $constraint == $max {
    @media screen and ($max: $viewport1) {
      @content;
    }
  } @else {
    @media screen and ($min: $viewport1) and ($max: $viewport2) {
      @content;
    }
  }
}

/*============================================================================
  Accent text
==============================================================================*/

@mixin accentFontStack {
  font-size: em($accentFontSize);
  font-family: $accentFontStack;
  font-weight: $accentFontWeight;
  font-style: normal;
  @if $typeAccentSpacing {
    letter-spacing: 0.1em;
  }
  @if $typeAccentTransform {
    text-transform: uppercase;
  }
}

/*============================================================================
  Flexbox prefix mixins from Bourbon
    https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/css3/_flex-box.scss
==============================================================================*/
@mixin display-flexbox() {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%; // necessary for ie10
}

@mixin flex-wrap($value: nowrap) {
  @include prefixFlex(flex-wrap, $value, webkit moz ms spec);
}

@mixin flex-direction($value) {
  @include prefixFlex(flex-direction, $value, webkit moz ms spec);
}

@mixin align-items($value: stretch) {
  $alt-value: $value;

  @if $value == 'flex-start' {
    $alt-value: start;
  } @else if $value == 'flex-end' {
    $alt-value: end;
  }

  // sass-lint:disable no-misspelled-properties
  -ms-flex-align: $alt-value;
  @include prefixFlex(align-items, $value, webkit moz ms o spec);
}

@mixin flex($value) {
  @include prefixFlex(flex, $value, webkit moz ms spec);
}

@mixin flex-basis($width: auto) {
  // sass-lint:disable no-misspelled-properties
  -ms-flex-preferred-size: $width;
  @include prefixFlex(flex-basis, $width, webkit moz spec);
}

@mixin align-self($align: auto) {
  // sass-lint:disable no-misspelled-properties
  -ms-flex-item-align: $align;
  @include prefixFlex(align-self, $align, webkit spec);
}

@mixin justify-content($justify: flex-start) {
  @include prefixFlex(justify-content, $justify, webkit ms spec);
}


  $siteWidth: 1030px;
  $slideHeight: 368px;


$gutter: 30px;
$gridGutter: 30px;
$gridGutterMobile: 22px;
$radius: 2px;

$section-spacing: 55px;
$section-spacing-small: 35px;

$small: 480px;
$medium: 768px;
$large: 769px;


$viewportIncrement: 1px;
$postSmall: $small + $viewportIncrement;
$preMedium: $medium - $viewportIncrement;
$preLarge: $large - $viewportIncrement;

/*================ The following are dependencies of csswizardry grid ================*/
$breakpoints: (
  'small' '(max-width: #{$small})',
  'medium' '(min-width: #{$postSmall}) and (max-width: #{$medium})',
  'medium-down' '(max-width: #{$medium})',
  
  'large' '(min-width: #{$large})',
  
  'post-large' '(min-width: #{$large})'
);
$breakpoint-has-widths: ('small', 'medium', 'medium-down', 'large', 'post-large', 'wide');
$breakpoint-has-push:  ('medium', 'medium-down', 'large', 'post-large', 'wide');
$breakpoint-has-pull:  ('medium', 'medium-down', 'large', 'post-large', 'wide');

/*================ Color variables ================*/
$colorPrimary: ;

// Button colors
$colorBtnPrimary: $colorPrimary;
$colorBtnPrimaryHover: darken($colorBtnPrimary, 10%);
$colorBtnPrimaryActive: darken($colorBtnPrimaryHover, 10%);
$colorBtnPrimaryText: ;

$colorBtnTertiary: ;
$colorBtnTertiaryHover: darken($colorPrimary, 10%);
$colorBtnTertiaryActive: darken($colorPrimary, 10%);
$colorBtnTertiaryText: $colorPrimary;

// Text link colors
$colorLink: blue;
$colorLinkHover: lighten(blue, 15%);

// Text colors
$colorTextBody: ;
$colorTopBarText: ;

// Backgrounds
$colorBody: ;
$colorHeader: transparent;
$colorTopBar: ;
$passwordBgImage: '//blueridgesignsupply.com/cdn/shop/t/211/assets/password-page-background.jpg?105581';

// Border colors
$colorBorder: ;

// Nav and dropdown link background
$colorNavText: ;

// Site Footer
$colorFooterBg: ;
$colorFooterText: ;
$colorFooterSocialLink: ;

// Helper colors
$disabledGrey: #f6f6f6;
$disabledBorder: darken($disabledGrey, 25%);
$errorRed: #d02e2e;
$errorRedBg: #fff6f6;
$successGreen: #56ad6a;
$successGreenBg: #ecfef0;

// Password page
$passwordPageUseBgImage: true;

/*================ Typography variables ================*/






// Body Font
$bodyFontStack: ;
$baseFontSize: ;

// Header Font
$headerFontStack: ;
$headerFontWeight: 700;
$headerBaseFontSize: ;

// Navigation and buttons
$accentFontStack: ;
$accentFontWeight: 400;
$accentFontSize: ;

// Header type settings

  $typeAccentSpacing: false;



  $typeAccentTransform: false;


/*================ Global | Normalize ================*/
*, input, :before, :after {
  @include box-sizing();
}

html, body {
  padding: 0;
  margin: 0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
  display: block;
}

audio, canvas, progress, video {
  display: inline-block;
  vertical-align: baseline;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}


/*================ Site-wide styles ================*/
/*================ Partials | Layout Styles ================*/
html {
  background-color: $colorFooterBg;
}

body {
  background-color: $colorBody;
}

.wrapper {
  @include clearfix();
  max-width: $siteWidth;
  margin: 0 auto;


}

.main-content {
  display: block;
  margin-top: $gutter * 2;
  padding-bottom: $gutter * 2;
}

hr {
  clear: both;
  border-top: solid $colorBorder;
  border-width: 1px 0 0;
  margin: $gutter 0;
  height: 0;

  &.hr--small {
    margin: ($gutter / 2) 0;
  }

  &.hr--clear {
    border-top-color: transparent;
  }

  .template-index .main-content .grid-uniform + &.hr--clear {
    display: none;
  }
}

/*================ Partials | Typography styles ================*/
body,
input,
textarea,
button,
select {
  font-size: $baseFontSize;
  line-height: 1.7;
  font-family: $bodyFontStack;
  color: $colorTextBody;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}

h1, h2, h3, h4, h5, h6 {
  font-family: $headerFontStack;
  font-weight: $headerFontWeight;
  margin: 0 0 ($gutter / 2);
  line-height: 1.4;

  a {
    text-decoration: none;
    font-weight: inherit;
    cursor:pointer;
  }
}

/*================ Use em() Sass function to declare font-size ================*/
h1 {
  font-size: em(36px);
}

h2 {
  font-size: em(28px);
}

h3 {
  font-size: em(24px);
}

h4 {
  font-size: em(18px);
}

h5 {
  font-size: em(16px);
}

h6 {
  font-size: em(16px);
}


.h1 { @extend h1; }
.h2 { @extend h2; }
.h3 { @extend h3; }
.h4 { @extend h4; }
.h5 { @extend h5; }
.h6 { @extend h6; }

p {
  margin: 0 0 ($gutter / 2) 0;

  img {
    margin: 0;
  }
}

em {
  font-style: italic;
}

b, strong {
  font-weight: bold;
}

small {
  font-size: 0.9em;
}

sup, sub {
  position: relative;
  font-size: 60%;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}

sub {
  bottom: -0.5em;
}

blockquote {
  font-size: 1.125em;
  line-height: 1.45;
  font-style: italic;
  margin: 0 0 $gutter;
  padding: ($gutter / 2) $gutter;
  border-left: 1px solid $colorBorder;

  p {
    margin-bottom: 0;

    & + cite {
      margin-top: $gutter / 2;
    }
  }

  cite {
    display: block;
    font-size: 0.75em;

    &:before {
      content: "\2014 \0020";
    }
  }
}

code, pre {
  background-color: #faf7f5;
  font-family: Consolas,monospace;
  font-size: 1em;
  border: 0 none;
  padding: 0 2px;
  color: #51ab62;
}

pre {
  overflow: auto;
  padding: $gutter / 2;
  margin: 0 0 $gutter;
}

/*================ Partials | Lists ================*/
ul, ol {
  margin: 0 0 $gutter;
  padding: 0;
}

ul { list-style: none outside; }
ol { list-style: decimal; }
ul ul, ul ol,
ol ol, ol ul { margin: 4px 0 5px 20px; }
li { margin-bottom: 0.25em; }

ol, ul.square, ul.disc { margin-left: 20px; }
ul.square { list-style: square outside; }
ul.disc { list-style: disc outside; }
ol.alpha { list-style: lower-alpha outside; }

.inline-list li {
  display: inline-block;
  margin-bottom: 0;
}

/*================ Partials | Tables ================*/
table {
  width: 100%;
  margin-bottom: 1em;
  border-collapse: collapse;
  border-spacing: 0;
}

.table-wrap {
  max-width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

th {
  font-weight: bold;
}

th, td {
  text-align: left;
  padding: $gutter / 2;
  border-bottom: 1px solid $colorBorder;
}
/*th, td a:hover {
  
  margin:0 auto;
  float: right; 

}*/
/*============================================================================
  #Grid Setup
    - Based on csswizardry grid, but with floated columns, a fixed gutter size, and BEM classes
    - Breakpoints defined above, under #Breakpoint and Grid Variables
    - Note the inclusion of .grid-uniform to take care of clearfixes on evenly sized grid items
==============================================================================*/
$responsive:         true;
$mobile-first:       true;
$use-silent-classes: false;
$push:               true;
$pull:               false;

/* Force clearfix on grids */
.grid,
.grid-uniform {
  @include clearfix;
}

/* Manual grid__item clearfix */
.grid__item.clear {
  clear: both;
}

$class-type: unquote(".");

@if $use-silent-classes == true {
  $class-type: unquote("%");
}

@mixin grid-media-query($media-query) {
  $breakpoint-found: false;

  @each $breakpoint in $breakpoints {
    $name: nth($breakpoint, 1);
    $declaration: nth($breakpoint, 2);

    @if $media-query == $name and $declaration {
      $breakpoint-found: true;

      @media only screen and #{$declaration} {
        @content;
      }
    }
  }

  @if $breakpoint-found == false {
    @warn "Breakpoint '#{$media-query}' does not exist";
  }
}

/*============================================================================
  Drop relative positioning into silent classes which can't take advantage of
  the `[class*="push--"]` and `[class*="pull--"]` selectors.
==============================================================================*/
@mixin silent-relative() {
  @if $use-silent-classes == true {
    position:relative;
  }
}

/*============================================================================
  Grid Setup
    1. Allow the grid system to be used on lists.
    2. Remove any margins and paddings that might affect the grid system.
    3. Apply a negative `margin-left` to negate the columns' gutters.
==============================================================================*/
#{$class-type}grid,
#{$class-type}grid-uniform {
  list-style: none;
  margin: 0;
  padding: 0;
  //margin-left: -$gridGutter;
}

#{$class-type}grid__item {
  float: left;
  min-height: 1px;
 // padding-left: $gridGutter;
  vertical-align: top;
  @if $mobile-first == true {
    width: 100%;
  }
  @include box-sizing();
}

/*============================================================================
  Reversed grids allow you to structure your source in the opposite
  order to how your rendered layout will appear.
==============================================================================*/
#{$class-type}grid--rev {
  @extend #{$class-type}grid;
  direction: rtl;
  text-align: left;

  > #{$class-type}grid__item {
    direction: ltr;
    text-align: left;
    float: right;
  }
}

/* Gutterless grids have all the properties of regular grids, minus any spacing. */
#{$class-type}grid--full {
  @extend #{$class-type}grid;
  margin-left: 0;

  > #{$class-type}grid__item {
    padding-left: 0;
  }
}

/*============================================================================
  WIDTHS
    - Create width classes, prefixed by the specified namespace.
==============================================================================*/
@mixin device-type($namespace:"") {
  /** Whole */
  #{$class-type}#{$namespace}one-whole       { width: 100%; }

  /* Halves */
  #{$class-type}#{$namespace}one-half        { width: 50%; }

  /* Thirds */
  #{$class-type}#{$namespace}one-third       { width: 33.333%; }
  #{$class-type}#{$namespace}two-thirds      { width: 66.666%; }

  /* Quarters */
  #{$class-type}#{$namespace}one-quarter     { width: 25%; }
  #{$class-type}#{$namespace}two-quarters    { width: 50%; }
  #{$class-type}#{$namespace}three-quarters  { width: 75%; }

  /* Fifths */
  #{$class-type}#{$namespace}one-fifth       { width: 20%;}
  #{$class-type}#{$namespace}two-fifths      { width: 40%; }
  #{$class-type}#{$namespace}three-fifths    { width: 60%; }
  #{$class-type}#{$namespace}four-fifths     { width: 80%; }

  /* Sixths */
  #{$class-type}#{$namespace}one-sixth       { width: 16.666%; }
  #{$class-type}#{$namespace}two-sixths      { width: 33.333%; }
  #{$class-type}#{$namespace}three-sixths    { width: 50%; }
  #{$class-type}#{$namespace}four-sixths     { width: 66.666%; }
  #{$class-type}#{$namespace}five-sixths     { width: 83.333%; }

  /* Eighths */
  #{$class-type}#{$namespace}one-eighth      { width: 12.5%; }
  #{$class-type}#{$namespace}two-eighths     { width: 25%; }
  #{$class-type}#{$namespace}three-eighths   { width: 37.5%; }
  #{$class-type}#{$namespace}four-eighths    { width: 50%; }
  #{$class-type}#{$namespace}five-eighths    { width: 62.5%; }
  #{$class-type}#{$namespace}six-eighths     { width: 75%; }
  #{$class-type}#{$namespace}seven-eighths   { width: 87.5%; }

  /* Tenths */
  #{$class-type}#{$namespace}one-tenth       { width: 10%; }
  #{$class-type}#{$namespace}two-tenths      { width: 20%; }
  #{$class-type}#{$namespace}three-tenths    { width: 30%; }
  #{$class-type}#{$namespace}four-tenths     { width: 40%; }
  #{$class-type}#{$namespace}five-tenths     { width: 50%; }
  #{$class-type}#{$namespace}six-tenths      { width: 60%; }
  #{$class-type}#{$namespace}seven-tenths    { width: 70%; }
  #{$class-type}#{$namespace}eight-tenths    { width: 80%; }
  #{$class-type}#{$namespace}nine-tenths     { width: 90%; }

  /* Twelfths */
  #{$class-type}#{$namespace}one-twelfth     { width: 8.333%; }
  #{$class-type}#{$namespace}two-twelfths    { width: 16.666%; }
  #{$class-type}#{$namespace}three-twelfths  { width: 25%; }
  #{$class-type}#{$namespace}four-twelfths   { width: 33.333%; }
  #{$class-type}#{$namespace}five-twelfths   { width: 41.666% }
  #{$class-type}#{$namespace}six-twelfths    { width: 50%; }
  #{$class-type}#{$namespace}seven-twelfths  { width: 58.333%; }
  #{$class-type}#{$namespace}eight-twelfths  { width: 66.666%; }
  #{$class-type}#{$namespace}nine-twelfths   { width: 75%; }
  #{$class-type}#{$namespace}ten-twelfths    { width: 83.333%; }
  #{$class-type}#{$namespace}eleven-twelfths { width: 91.666%; }
}

/*================ Clearfix helper on uniform grids ================*/
@mixin clearfix-helper($namespace:"") {
  .grid-uniform {
    #{$class-type}#{$namespace}one-half:nth-child(2n+1),
    #{$class-type}#{$namespace}one-third:nth-child(3n+1),
    #{$class-type}#{$namespace}one-quarter:nth-child(4n+1),
    #{$class-type}#{$namespace}one-fifth:nth-child(5n+1),
    #{$class-type}#{$namespace}one-sixth:nth-child(6n+1),
    #{$class-type}#{$namespace}two-sixths:nth-child(3n+1),
    #{$class-type}#{$namespace}three-sixths:nth-child(2n+1),
    #{$class-type}#{$namespace}two-eighths:nth-child(4n+1),
    #{$class-type}#{$namespace}four-eighths:nth-child(2n+1),
    #{$class-type}#{$namespace}five-tenths:nth-child(2n+1),
    #{$class-type}#{$namespace}one-twelfth:nth-child(12n+1),
    #{$class-type}#{$namespace}two-twelfths:nth-child(6n+1),
    #{$class-type}#{$namespace}three-twelfths:nth-child(4n+1),
    #{$class-type}#{$namespace}four-twelfths:nth-child(3n+1),
    #{$class-type}#{$namespace}six-twelfths:nth-child(2n+1)    { clear: both; }
  }
}

/*================ Helper show/hide classes around our breakpoints ================*/
@mixin device-helper($namespace:"") {
  #{$class-type}#{$namespace}show        { display: block!important; }
  #{$class-type}#{$namespace}hide        { display: none!important; }

  #{$class-type}#{$namespace}text-left   { text-align: left!important; }
  #{$class-type}#{$namespace}text-right  { text-align: right!important; }
  #{$class-type}#{$namespace}text-center { text-align: center!important; }

  #{$class-type}#{$namespace}left        { float: left!important; }
  #{$class-type}#{$namespace}right       { float: right!important; }
}

/*================ Our regular, non-responsive width and helper classes ================*/
@include device-type();
@include device-helper();

/*================ Our responsive classes, if we have enabled them ================*/
@if $responsive == true {
  @each $name in $breakpoint-has-widths {
    @include grid-media-query($name) {
      @include device-type('#{$name}--');
      @include device-helper('#{$name}--');
      @include clearfix-helper('#{$name}--');
    }
  }
}

/*============================================================================
  PUSH
    - Push classes, to move grid items over to the right by certain amounts
==============================================================================*/
@mixin push-setup($namespace: "") {
  /* Whole */
  #{$class-type}push--#{$namespace}one-whole       { left: 100%; @include silent-relative(); }

  /* Halves */
  #{$class-type}push--#{$namespace}one-half        { left: 50%; @include silent-relative(); }

  /* Thirds */
  #{$class-type}push--#{$namespace}one-third       { left: 33.333%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}two-thirds      { left: 66.666%; @include silent-relative(); }

  /* Quarters */
  #{$class-type}push--#{$namespace}one-quarter     { left: 25%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}two-quarters    { left: 50%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}three-quarters  { left: 75%; @include silent-relative(); }

  /* Fifths */
  #{$class-type}push--#{$namespace}one-fifth       { left: 20%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}two-fifths      { left: 40%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}three-fifths    { left: 60%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}four-fifths     { left: 80%; @include silent-relative(); }

  /* Sixths */
  #{$class-type}push--#{$namespace}one-sixth       { left: 16.666%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}two-sixths      { left: 33.333%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}three-sixths    { left: 50%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}four-sixths     { left: 66.666%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}five-sixths     { left: 83.333%; @include silent-relative(); }

  /* Eighths */
  #{$class-type}push--#{$namespace}one-eighth      { left: 12.5%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}two-eighths     { left: 25%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}three-eighths   { left: 37.5%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}four-eighths    { left: 50%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}five-eighths    { left: 62.5%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}six-eighths     { left: 75%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}seven-eighths   { left: 87.5%; @include silent-relative(); }

  /* Tenths */
  #{$class-type}push--#{$namespace}one-tenth       { left: 10%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}two-tenths      { left: 20%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}three-tenths    { left: 30%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}four-tenths     { left: 40%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}five-tenths     { left: 50%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}six-tenths      { left: 60%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}seven-tenths    { left: 70%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}eight-tenths    { left: 80%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}nine-tenths     { left: 90%; @include silent-relative(); }

  /* Twelfths */
  #{$class-type}push--#{$namespace}one-twelfth     { left: 8.333%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}two-twelfths    { left: 16.666%; @include silent-relative();  }
  #{$class-type}push--#{$namespace}three-twelfths  { left: 25%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}four-twelfths   { left: 33.333%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}five-twelfths   { left: 41.666%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}six-twelfths    { left: 50%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}seven-twelfths  { left: 58.333%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}eight-twelfths  { left: 66.666%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}nine-twelfths   { left: 75%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}ten-twelfths    { left: 83.333%; @include silent-relative(); }
  #{$class-type}push--#{$namespace}eleven-twelfths { left: 91.666%; @include silent-relative(); }
}

@if $push == true {
  [class*="push--"]{ position:relative; }

  @include push-setup();

  @if $responsive == true {
    @each $name in $breakpoint-has-push {
      @include grid-media-query($name) {
        @include push-setup('#{$name}--');
      }
    }
  }
}

/*============================================================================
  PULL
    - Pull classes, to move grid items back to the left by certain amounts
==============================================================================*/
@mixin pull-setup($namespace: "") {
  /* Whole */
  #{$class-type}pull--#{$namespace}one-whole       { right: 100%; @include silent-relative(); }

  /* Halves */
  #{$class-type}pull--#{$namespace}one-half        { right: 50%; @include silent-relative(); }

  /* Thirds */
  #{$class-type}pull--#{$namespace}one-third       { right: 33.333%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}two-thirds      { right: 66.666%; @include silent-relative(); }

  /* Quarters */
  #{$class-type}pull--#{$namespace}one-quarter     { right: 25%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}two-quarters    { right: 50%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}three-quarters  { right: 75%; @include silent-relative(); }

  /* Fifths */
  #{$class-type}pull--#{$namespace}one-fifth       { right: 20%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}two-fifths      { right: 40%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}three-fifths    { right: 60%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}four-fifths     { right: 80%; @include silent-relative(); }

  /* Sixths */
  #{$class-type}pull--#{$namespace}one-sixth       { right: 16.666%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}two-sixths      { right: 33.333%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}three-sixths    { right: 50%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}four-sixths     { right: 66.666%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}five-sixths     { right: 83.333%; @include silent-relative(); }

  /* Eighths */
  #{$class-type}pull--#{$namespace}one-eighth      { right: 12.5%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}two-eighths     { right: 25%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}three-eighths   { right: 37.5%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}four-eighths    { right: 50%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}five-eighths    { right: 62.5%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}six-eighths     { right: 75%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}seven-eighths   { right: 87.5%; @include silent-relative(); }

  /* Tenths */
  #{$class-type}pull--#{$namespace}one-tenth       { right: 10%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}two-tenths      { right: 20%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}three-tenths    { right: 30%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}four-tenths     { right: 40%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}five-tenths     { right: 50%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}six-tenths      { right: 60%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}seven-tenths    { right: 70%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}eight-tenths    { right: 80%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}nine-tenths     { right: 90%; @include silent-relative(); }

  /* Twelfths */
  #{$class-type}pull--#{$namespace}one-twelfth     { right: 8.333%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}two-twelfths    { right: 16.666%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}three-twelfths  { right: 25%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}four-twelfths   { right: 33.333%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}five-twelfths   { right: 41.666%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}six-twelfths    { right: 50%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}seven-twelfths  { right: 58.333%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}eight-twelfths  { right: 66.666%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}nine-twelfths   { right: 75%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}ten-twelfths    { right: 83.333%; @include silent-relative(); }
  #{$class-type}pull--#{$namespace}eleven-twelfths { right: 91.666%; @include silent-relative(); }
}

@if $pull == true {
  [class*="pull--"]{ position:relative; }

  @include pull-setup();

  @if $responsive == true {
    @each $name in $breakpoint-has-pull {
      @include grid-media-query($name) {
        @include pull-setup('#{$name}--');
      }
    }
  }
}

/*================ Partials | Helper Classes ================*/
.clearfix {
  &:after {
    content: "";
    display: table;
    clear: both; }
  *zoom: 1;
}

.display-table {
  display: table;
  table-layout: fixed;
  width: 100%;
}

.display-table-cell {
  display: table-cell;
  vertical-align: middle;
  float: none;
}

@include at-query ($min, $large) {
  .post-large--display-table {
    display: table;
    table-layout: fixed;
    width: 100%;
  }

  .post-large--display-table-cell {
    display: table-cell;
    vertical-align: middle;
    float: none;
  }
}

.visually-hidden {
  @include visuallyHidden();
}

.hide {
  display: none !important;
}

// Only show when JS is supported
.supports-js {
  .no-js & {
    display: none !important;
  }
}

/*============================================================================
  #OOCSS Media Object
    - http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/
==============================================================================*/
.media,
.media-flex {
  overflow: hidden;
  _overflow: visible;
  zoom: 1;
}

.media-img {
  float: left;
  margin-right: $gutter;
}

.media-img-right {
  float: right;
  margin-left: $gutter;
}

.media-img img,
.media-img-right img {
  display: block;
}

/*================ Partials | Links and Buttons ================*/
a,
.text-link {
  color: $colorLink;
  text-decoration: none;
  background: transparent;

  &:hover,
  &:focus {
    color: $colorLinkHover;
  }
}

button {
  overflow: visible;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

.btn {
  display: inline-block;
  padding: 12px;
  margin: 0;
  @include accentFontStack;
  line-height: 1.8;
  text-decoration: none;
  text-align: center;
  vertical-align: middle;
  min-height: 44px;
  white-space: nowrap;
  cursor: pointer;
  border: 1px solid transparent;
  @include prefix('user-select', 'none');
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: $radius;

  /*================ Set primary button colors - can override later ================*/
  background-color: $colorBtnPrimary;
  color: $colorBtnPrimaryText;

  &:hover {
    background-color: #000;
    color:#fff;
    font-family: "Source Sans Pro", sans-serif;
        font-weight: normal !important;
  }

  &:active,
  &:focus {
    background-color: $colorBtnPrimaryActive;
    color: $colorBtnPrimaryText;
 
   
  }

  &[disabled],
  &.disabled {
    cursor: default;
    color: $disabledBorder;
    background-color: $disabledGrey;
  }
}

.btn--secondary,
input.btn--secondary {
  @extend .btn;
  background-color: #b7dcff;
  color: black;
  border-color: $colorBtnPrimary;
  white-space: normal;

  &:hover {
    background-color: transparent;
    color: black;
    border-color: $colorBtnPrimaryHover;
  }

  &:active,
  &:focus {
    background-color: transparent;
    color: $colorBtnPrimaryActive;
  }

  &[disabled],
  &.disabled {
    background-color: $disabledGrey;
    border-color: $disabledGrey;
    color: $disabledBorder;
  }
}

.btn--large {
  padding: 12px 15px;
  font-size: em(16px);
}

.btn--wide {
  width: 50%;
  @include at-query($max, $medium) {
    width: 100%;
  }
}

.btn--full {
  width: 100%;
  padding: 8px 32px;
  font-size: em(18px);
  font-weight: 700;
  min-height: 60px;
  margin-top: 15px;
}

.product-single__quantity:not(.is-hidden) ~ .btn--full {
  margin-top: 0;
}

.btn--tertiary,
input.btn--tertiary {
  @extend .btn;
  margin: 0;
  background-color: $colorBtnTertiary;
  color: $colorBtnTertiaryText;
  border: 1px solid $colorBorder;

  &:hover {
    opacity: 1;
    background-color: $colorBtnTertiaryHover;
  }

  &:active,
  &:focus {
    background-color: $colorBtnTertiaryActive;
  }
}

select.btn--tertiary {
  padding: 6px 28px 6px 10px;
  font-size: 0.85em;

  &:hover,
  &:focus,
  &:active {
    background-color: $colorBtnTertiary;
    color: $colorBtnTertiaryText;
  }
}

.btn--search {
  min-height: auto;
  line-height: 1.5;
  background:black;
}

.btn--search:hover{background: #003E89;}

/*================ Force an input/button to look like a text link ================*/
.text-link {
  display: inline;
  border: 0 none;
  padding: 0;
  margin: 0;
}

/*================ Smart Payment Buttons ================*/
.shopify-payment-button {
  .shopify-payment-button__button--unbranded {
    margin-top: 10px;
    white-space: normal;
    @extend .btn;

    &:hover {
      background-color: $colorBtnPrimaryHover !important;
    }

    &:active,
    &:focus {
      background-color: $colorBtnPrimaryActive !important;
    }

    .product-form--full & {
      @extend .btn--full;
    }
  }

  .shopify-payment-button__button--branded {
    border-radius: $radius;
    overflow: hidden;

    .product-form--full & {
      min-height: 60px;
      margin-top: 15px;
    }
  }
}

.shopify-payment-button__button {
  margin-top: 10px;

  .product-form--wide & {
    @extend .btn--wide;
  }
}

.shopify-payment-button__more-options {
  margin-top: 10px !important;
  padding: 8px 0 6px 0;
  font-size: em(15px) !important;
  color: $colorLink;
  line-height: 1;

  &:hover,
  &:focus {
    text-decoration: none !important;
    color: $colorLinkHover;
  }

  .product-form--wide & {
    @extend .btn--wide;
  }
}

/*================ Partials | Images, SVG, and iframes ================*/
img {
  border: 0 none;
}

svg:not(:root) {
  overflow: hidden;
}

img.auto,
.grid__item img,
.grid__item iframe {
  max-width: 100%;
}

.video-wrapper {
  position: relative;
  overflow: hidden;
  max-width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  height: auto;

  iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}

.table-wrapper {
  max-width: 100%;
  overflow: auto;
}

/*================ Partials | Forms ================*/
form {
  margin-bottom: 15px;
}

input,
textarea,
button,
select {
  font-size: 1em;
}

button,
input[type="text"],
input[type="search"],
input[type="password"],
input[type="email"],
input[type="file"],
input[type="number"],
input[type="tel"],
input[type="submit"],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
}

input,
textarea,
select,
fieldset {
  border-radius: $radius;
  max-width: 100%;

  &.input-full {
    width: 100%;
  }
}

input,
select,
textarea {
  padding: 8px 10px;
  line-height: 1.42;
}

fieldset {
  border: 1px solid $colorBorder;
  padding: $gutter / 2;
}

legend {
  border: 0;
  padding: 0;
}

optgroup {
  font-weight: bold;
}

input {
  display: inline-block;
  width: auto;
}

button,
input[type="submit"] {
  cursor: pointer;
}

input[type="submit"] {
  @extend .btn;
}

/*================ Input width and border ================*/
input[type="text"],
input[type="search"],
input[type="password"],
input[type="email"],
input[type="file"],
input[type="number"],
input[type="tel"],
textarea,
select {
  border: 1px solid transparentize($colorTextBody, 0.85);
  width: 100%;
  max-width: 100%;
  display: block;
  margin: 0 0 1em;
  color: #333;
 

  &:focus {
    border: 1px solid transparentize($colorTextBody, 0.7);
  }

  &[disabled],
  &.disabled {
    cursor: default;
    background-color: $disabledGrey;
    border-color: $disabledBorder;
  }
}

textarea {
  min-height: 100px;
}

input[type="checkbox"],
input[type="radio"] {
  display: inline;
  margin: 0;
  padding: 0;


  
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-position: right center;
  background-image: url("/cdn/shop/files/ico-select.svg?v=1677496767&width=340");
  background-repeat: no-repeat;
  background-position: right 12px center;
  cursor: pointer;
  }

// Force option color (affects IE only)
option {
  color: #000;
  background-color: #fff;
}

select::-ms-expand {
  display: none;
}

/*================ Form labels ================*/
.hidden-label {
  @include visuallyHidden;
}

label,
legend {
  display: block;
  margin-bottom: 2px;

  &.inline {
    display: inline;
  }

  .form-horizontal &.label--hidden,
  &.label--hidden {
    height: 0;
    width: 0;
    margin-bottom: 0;
    overflow: hidden;

    .ie9 &,
    .lt-ie9 & {
      height: auto;
      width: auto;
      margin-bottom: 2px;
      overflow: visible;
    }
  }

  .form-horizontal &:not(.label--hidden) {
    font-size: 0.9em;
  }
}

/*================ We don't want the same label treatment for checkboxes/radios ================*/
input[type="checkbox"] + label,
input[type="radio"] + label {
  font-weight: normal;
 
}

label[for] {
  cursor: progress;
}

.label-hint {
  color: red;
}

/*================ Horizontal Form ================*/
form.form-horizontal,
.form-horizontal {
  margin-bottom: 0;

  input[type="text"],
  input[type="search"],
  input[type="password"],
  input[type="email"],
  input[type="file"],
  input[type="number"],
  input[type="tel"],
  textarea,
  select,
  label {
    display: inline-block;
    margin-bottom: 0;
    width: auto;
  }
}

@include at-query($min, $large) {
  .form-horizontal ~ .form-horizontal {
    padding-left: $gutter / 2;
  }
}

@include at-query($max, $medium) {
  .form-horizontal ~ .form-horizontal {
    margin-top: $gutter / 4;
  }
}

/*================ Error styles ================*/
input[type="text"],
input[type="search"],
input[type="password"],
input[type="email"],
input[type="file"],
input[type="number"],
input[type="tel"],
textarea {
  &.error {
    border-color: $errorRed;
    background-color: $errorRedBg;
    color: $errorRed;
  }
}

label.error {
  color: $errorRed;
}


/*================ Input Group ================*/
.input-group {
  position: relative;
  display: table;
  border-collapse: separate;

  .input-group-field:first-child,
  .input-group-btn:first-child,
  .input-group-btn:first-child > .btn,
  input[type="hidden"]:first-child + .input-group-field,
  input[type="hidden"]:first-child + .input-group-btn > .btn {
    border-radius: $radius 0 0 $radius;
  }

  .input-group-field:last-child,
  .input-group-btn:last-child > .btn {
   border-radius: 0 $radius $radius 0;
  }

  input {
    // Nasty Firefox hack for inputs http://davidwalsh.name/firefox-buttons
    &::-moz-focus-inner {
      border: 0;
      padding: 0;
      margin-top: -1px;
      margin-bottom: -1px;
    }
  }
}

.input-group-field,
.input-group-btn {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
}

.input-group .btn,
.input-group .input-group-field {
  height: 37px;
  line-height: 1.3;
  min-height: auto;
}

.input-group .input-group-field {
  width: 100%;
  margin-bottom: 0;
}

.input-group-btn {
  position: relative;
  white-space: nowrap;
  width: 1%;
  padding: 0;
}

/*================ Search bar ================*/
.search-bar {
  max-width: 50%;

  @include at-query ($max, $medium) {
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
  }
}

/*================ Partials | Icons ================*/
@font-face {
  font-family: "icons";
  src: url('//blueridgesignsupply.com/cdn/shop/t/211/assets/icons.eot?105581');
  src: url('//blueridgesignsupply.com/cdn/shop/t/211/assets/icons.eot?105581#iefix') format("embedded-opentype"),
    url('//blueridgesignsupply.com/cdn/shop/t/211/assets/icons.woff?105581') format("woff"),
    url('//blueridgesignsupply.com/cdn/shop/t/211/assets/icons.ttf?105581') format("truetype"),
    url('//blueridgesignsupply.com/cdn/shop/t/211/assets/icons.svg?105581#timber-icons') format("svg");
  font-weight: normal;
  font-style: normal;
}
$socialIconFontStack: "icons";

.icon-fallback-text .icon {
  display: none;

  .supports-fontface & {
    display: none;
  }
}

/*============================================================================
  A generic way to visually hide content while
  remaining accessible to screen readers (h5bp.com)
==============================================================================*/
.supports-fontface .icon-fallback-text .fallback-text {
  display: none;
  clip: rect(0 0 0 0);
  overflow: hidden;
  position: absolute;
  height: 1px;
  width: 1px;
}

.icon:before {
  display: none;
}

.supports-fontface .icon:before {
  display: inline;
  font-family: $socialIconFontStack;
  text-decoration: none;
  speak: none; // future fallback, limited in effect currently
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: relative;

}

/*================ Icon mapping ================*/
.icon-amazon_payments:before { content: "\e908"; }
.icon-american_express:before { content: "\41"; }
.icon-apple_pay:before { content: "\e907"; }
.icon-arrow-down:before { content: "\34"; }
.icon-bitcoin:before { content: "\42"; }
.icon-cart:before { content: "\5b"; }
.icon-cirrus:before { content: "\43"; }
.icon-dankort:before { content: "\64"; }
.icon-diners_club:before { content: "\63"; }
.icon-discover:before { content: "\44"; }
.icon-dogecoin:before { content: "\e900"; }
.icon-dwolla:before { content: "\e901"; }
.icon-facebook:before { content: "\66"; }
.icon-fancy:before { content: "\46"; }
.icon-forbrugsforeningen:before { content: "\e902"; }
.icon-google_pay:before { content: "\e90c"; }
.icon-google_plus:before { content: "\e905"; }
.icon-grid-view:before { content: "\e603"; }
.icon-hamburger:before { content: "\e600"; }
.icon-instagram:before { content: "\e903"; }
.icon-interac:before { content: "\49"; }
.icon-jcb:before { content: "\4a"; }
.icon-klarna:before { content: "\e90a"; }
.icon-list-view:before { content: "\e604"; }
.icon-litecoin:before { content: "\e904"; }
.icon-maestro:before { content: "\6d"; }
.icon-master:before { content: "\4d"; }
.icon-minus:before { content: "\e602"; }
.icon-paypal:before { content: "\50"; }
.icon-pin:before { content: "\e909"; }
.icon-pinterest:before { content: "\70"; }
.icon-plus:before { content: "\e605"; }
.icon-rss:before { content: "\72"; }
.icon-search:before { content: "\73"; }
.icon-shopify_pay:before { content: "\e90b"; }
.icon-snapchat:before { content: "\e906"; }
.icon-tumblr:before { content: "\74"; }
.icon-twitter:before { content: "\54"; }
.icon-vimeo:before { content: "\76"; }
.icon-visa:before { content: "\56"; }
.icon-x:before { content: "\78"; }
.icon-youtube:before { content: "\79"; }

.payment-icons {
  @include prefix("user-select", "none");
  cursor: default;

  li {
    margin: 0 ($gutter / 4) ($gutter / 4);
    color: $colorFooterSocialLink;
    cursor: default;
  }

  .icon {
    font-size: 30px;
    line-height: 30px;
  }

  .icon-shopify_pay {
    font-size: 25px;
    line-height: 25px;
  }

  .fallback-text {
    text-transform: capitalize;
  }
}

.social-icons li {
  margin: 0 ($gutter / 3) ($gutter / 2);
  vertical-align: middle;

  @include at-query ($min, $postSmall) {
    margin-left: 0;
  }

  .icon {
    font-size: 22px;
    line-height: 22px;
  }

  a {
    color: $colorFooterSocialLink;

    &:hover {
      color: darken($colorFooterSocialLink, 10%);
    }
  }
}


/*================ Module-specific styles ================*/
/*================ Module | Breadcrumbs and Tag Sorting ================*/
.breadcrumb,
.tags {
  background:white;
  font-family: $accentFontStack;
  color: #808080;

  a {
    color: #808080;

    &:hover,
    &:focus,
    &:active {
      color: #000;
    }
  }
}

.breadcrumb {
  margin-bottom: $gutter / 2.5;
  color: #808080;
  font-size: .75em;
   background:white;

  a,
  span {
    display: inline;
    padding-right: 5px;
    margin-right: 5px;

    &:first-child {
      padding-left: 0;
    }
  }
}

.breadcrumb__sep {
  font-size: 1.4em;
  line-height: 1;
}

.tags {
  color: $colorPrimary;

  a {
    display: inline-block;
    padding: 5px 7px 5px 0;
    margin-right: 12px;
  }
}

.tag--active a {
  color: $colorPrimary;
}

/*================ Module | Footer ================*/
.site-footer {
  background-color: $colorFooterBg;
  padding-top: $gutter;
  padding-bottom: 20px;
  color: $colorFooterText;

  form {
    margin-bottom: 0;
  }

  @include at-query($min, $medium) {
    input {
      max-width: 250px;
    }   
  }

  .text-center input {
    margin-left: auto;
    margin-right: auto;
  }

  p {
    margin-bottom: 10px;
  }

  ul {
    margin-bottom: 0;
  }

  @include at-query ($min, $large) {
    padding-top: $gutter;
  }

  @include at-query ($max, $medium) {
    .grid__item {
      margin-bottom: $gutter;

      &:last-child {
        margin-bottom: 0;
      }
    }
  }
}

.site-footer .rte p {
  font-size: 1em;
}

.site-footer__links {
  a {
    color: $colorFooterText;

    &:hover,
    &:active {
      color: $colorLink;
    }
  }

  &.inline-list li {
    padding: 0 10px;
  }

}

/*================ Module | Notes and Form Feedback ================*/
.note,
.errors {
  border-radius: $radius;
  padding: 6px 12px;
  margin-bottom: $gutter / 2;
  border: 1px solid transparent;
  font-size: 0.9em;
  text-align: left;

  ul,
  ol {
    margin-top: 0;
    margin-bottom: 0;
  }

  li:last-child {
    margin-bottom: 0;
  }

  p {
    margin-bottom: 0;
  }
}

.note {
  border-color: $colorBorder;
}

.errors {
  ul {
    list-style: disc outside;
    margin-left: 20px;
  }
}

.form-success {
  color: $successGreen;
  background-color: $successGreenBg;
  border-color: $successGreen;

  a {
    color: $successGreen;
    text-decoration: underline;

    &:hover {
      text-decoration: none;
    }
  }
}

.form-error,
.errors {
  color: $errorRed;
  background-color: $errorRedBg;
  border-color: $errorRed;

  a {
    color: $errorRed;
    text-decoration: underline;

    &:hover {
      text-decoration: none;
    }
  }
}

/*================ Module | Pagination ================*/
.pagination {
  margin-bottom: 1em;
}

.pagination-custom {
  display: inline-block;
  padding-left: 0;
  margin: 0;
  border-radius: $radius;
}

.pagination-custom > li {
  display: inline;
}

.pagination-custom > li > a,
.pagination-custom > li > span {
  position: relative;
  float: left;
  padding: 5px 10px;
  margin-left: -1px;
  line-height: 1.42;
  text-decoration: none;
}

.pagination-custom > li:first-child > a,
.pagination-custom > li:first-child > span {
  margin-left: 0;
}

.pagination-custom > .active > a,
.pagination-custom > .active > span,
.pagination-custom > .active > a:hover,
.pagination-custom > .active > span:hover,
.pagination-custom > .active > a:focus,
.pagination-custom > .active > span:focus {
  z-index: 2;
  cursor: default;
  color: $colorTextBody;
}

.pagination-custom > .disabled > span,
.pagination-custom > .disabled > a,
.pagination-custom > .disabled > a:hover,
.pagination-custom > .disabled > a:focus {
  color: $colorTextBody;
  cursor: not-allowed;
}

.pagination-custom-lg > li > a,
.pagination-custom-lg > li > span {
  padding: 10px 16px;
  font-size: em(18px);
}

.pagination-custom-sm > li > a,
.pagination-custom-sm > li > span {
  padding: 5px 10px;
  font-size: em(12px);
}

/*================ Module | Rich Text Editor ================*/
.rte {

  // Add some top margin to headers from the rich text editor
  h1, h2, h3, h4, h5, h6 {
    margin-top: 2em;

    &:first-child {
      margin-top: 0;
    }
  }

  > div {
    margin-bottom: $gutter / 2;
  }

  ul, ol {
    margin-left: 35px;
  }

  ul {
    @extend ul.disc;

    ul {
    list-style: circle outside;

      ul {
        @extend ul.square;
      }
    }
  }

  li {
    margin-bottom: 0.4em;
  }

  img {
    max-width: 100%;
    height: auto;
  }

  table {
    table-layout: fixed;
  }
}

/*================ Module | Section Headers ================*/
.section-header {
  text-align: left;
  margin-bottom: $gutter / 2;
}

.section-header--small {
  margin-bottom: 0;
}

.section-header--medium {
  margin-bottom: $gutter / 4;
}

.section-header--large {
  margin-bottom: $gutter;
}

.section-header--breadcrumb {
  margin-bottom: $gutter / 2;
}

.section-header__title {
  color: $colorNavText;
}

.section-header__title--left,
.section-header__link--right {
  padding-bottom: $gutter / 2.5;
  margin-bottom: 0;
}

.section-header__link--right {
  margin-top: $gutter / 2;
}

@include at-query ($min, $large) {
  .section-header {
    display: table;
    width: 100%;
    text-align: left;
  }

  .section-header__title--left {
  
    vertical-align: middle;

    h1, h2, h3, h4,
    .h1, .h2, .h3, .h4 {
      margin-bottom: 0;
    
    }
  }

  .section-header__link--right {
   
    vertical-align: middle;
    text-align: right;
    width: 550px;
    margin-top: 0;

    @include at-query ($max, $medium) {
      margin-bottom: $gutter;
    }
  }
}

.section-header__link--right {

  .form-horizontal {
    display: inline-block;
  }

  .form-horizontal,
  .collection-view {
    vertical-align: middle;
  }

  select,
  option {
    color: $colorTextBody;
    border-color: transparentize($colorTextBody, 0.85);
  }

  @include at-query ($min, $postSmall) {
    label + select,
    .collection-view {
      margin-left: $gutter / 2;
    }

    label:not(.label--hidden) + select {
      margin-left: $gutter / 6;
    }
  }

  @include at-query ($min, $large) {
    select {
      max-width: 200px;
    }
  }
}

@include at-query ($max, $medium) {
  .template-collection {
    .section-header__link--right {
      display: block;
      width: 100%;
      margin-top: 0;

      .form-horizontal {
        width: 100%;

        select {
          width: 100%;
          margin-left: 0;
        }
      }
    }
  }
}

.view-more {
  clear: both;
  display: block;
  font-size: 0.85em;
  text-align: center;
  margin-top: $gutter / 2;

  @include at-query($min, $large) {
    display: none;
  }
}

/*================ Module | Site Header ================*/
.site-header {
  padding: 40px 0;
  background-color: $colorHeader;

  @include at-query ($min, $large) {
    padding: $gutter 0;

    .post-large--display-table {
      min-height: 86px;
    }
  }

  @include at-query ($min, $large) {
    .grid {
      display: table;
      table-layout: fixed;
      width: 100%;

      > .grid__item {
        float: none;
        display: table-cell;
        vertical-align: middle;
      }
    }
  }
}

.site-header__logo {
  text-align: center;
  margin: 0 auto;
  max-width: 100%;

  a {
    color: $colorNavText;
    margin: 0 auto;
  }

  a,
  a:hover,
  a:focus {
    text-decoration: none;
  }

  a, img {
    display: block;
  }

  img {
    margin: 0 auto;
  }
}

.logo__image-wrapper {
  display: block;
  max-width: 100%;
  position: relative;
}

.logo__image {
  width: 100%;
  display: block;

  .supports-js & {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
  }

  .no-js & {
    @include visuallyHidden();
  }
}

.site-header--text-links {
  margin-bottom: 0;
}

/*================ Module | Site Nav and Dropdowns ================*/
.site-nav {
  @include accentFontStack;
  cursor: default;
  margin: 0 auto;
  text-align: center;

  li {
    margin: 0;
    display: block;
    position: relative;
  }

  & > li {
    position: relative;
    display: inline-block;

    &:first-child > a {
      padding-left: 0;
    }

    &:first-child .site-nav__dropdown {
      left: - $gutter / 2;
    }

    &:last-child > a {
      padding-right: 0;
    }
  }
}

.site-nav__link {
  display: block;
  text-decoration: none;
  white-space: nowrap;
  color: $colorNavText;
  background-color: $colorBody;
  font-weight: normal;
  padding: 7px 20px 7px 15px;

  &:hover,
  &:active,
  &:focus {
    color: blue;
  }

  .site-nav--active > & {
    font-weight: bold;
  }

  .icon-arrow-down {
    font-size: 0.7em;
    color: $colorNavText;

    .site-nav--has-dropdown-grandchild & {
      display: inline-block;
      line-height: 1;
      @include transform(rotate(-90deg));
    }
  }
  .site-nav__dropdown-grandchild & {
    white-space: normal;
  }
}

/*================ Dropdowns ================*/
.site-nav__dropdown {
  text-transform: none;
  opacity: 0;
  position: absolute;
  left: 0;
  margin: 0;
  text-align: left;
  z-index: 20;
  font-size: 0.85em;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
  pointer-events: none;

  .supports-no-touch .site-nav--has-dropdown:hover &,
  .site-nav--has-dropdown.nav-hover &,
  .nav-focus + &,
  .show-dropdown > & {
    opacity: 1;
    pointer-events: initial;
  }

  &.nav-outside {
    left: auto;
    right: 0;
  }
}

.site-nav__dropdown-grandchild {
  position: absolute;
  top: 0;
  left: 100%;
  width: 100%;
  margin: 0;
  z-index: 20;
  opacity: 0;
  pointer-events: none;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);

  .supports-no-touch .site-nav--has-dropdown-grandchild:hover &,
  .site-nav--has-dropdown-grandchild.nav-hover &,
  .nav-focus + &,
  .show-dropdown > & {
    opacity: 1;
    pointer-events: initial;
  }

  &.nav-outside {
    left: -100%;
  }
}

/*================ Search bar in header ================*/
.nav-search {
  position: relative;
  padding: 7px 0;

  @include at-query ($max, $medium) {
    padding: 0 0 ($gutter / 2);
    margin: 0 auto;
    text-align: center;
  }

  .input-group,
  .input-group-field {
    margin-bottom: 0;
  }
}

/*================ Header message (theme setting) ================*/
.header-message {
  text-align: center;
  margin: ($gutter / 2) 0 0;
 

  @include at-query($min, $large) {
    margin-bottom: $gutter / 2;
  }
}


/*================ View-specific styles ================*/
/*================ Templates | Blog and Comments ================*/
.comment {
  margin-bottom: $gutter;

  & + & {
    border-top: 1px solid $colorBorder;
    padding-top: $gutter;
  }
}

.meta-sep {
  position: relative;
  top: -1px;
  padding: 0 5px;
  font-size: 0.7em;
}

.blog-date {
  margin-top: -0.5em;
}

aside h4 ~ h4 {
  margin-top: 1.5 * $gutter;
}

aside time em {
  font-size: 0.8em;
}

@include at-query($max, $medium) {
  article {
    margin-bottom: $gutter;
  }
}

.article__image-wrapper {
  width: 100%;
  margin: 0 auto;

  &.supports-js {
    position: relative;
  }
}

.article__image {
  display: block;
  margin-bottom: 0.75 * $gutter;
  margin: 0 auto;

  .article__image-wrapper.supports-js & {
    position: absolute;
    top: 0;
    width: 100%
  }
}

/*================ Templates | Cart Page ================*/
.cart__row {
  position: relative;


  &:first-child {
    margin-top: 0;
  }

  &:first-child {
    padding-top: 0;
    border-top: 0 none;
  }

  .js-qty {
    margin: 0;
  }
}

.cart__row--table-large {
  .grid__item {
    word-wrap: break-word;
  }
}

@include at-query ($min, $large) {
  .cart__row--table-large {
    display: table;
    table-layout: fixed;
    width: 100%;

    .grid__item {
      display: table-cell;
      vertical-align: middle;
    }
  }
}

.cart__image-wrapper {
  width: 100%;
  margin: 0 auto;

  &.supports-js {
    position: relative;
  }
}

.cart__image {
  display: block;
  margin: 0 auto;

  .supports-js & {
    position: absolute;
    top: 0;
    width: 100%;
  }

  &.lazyload {
    opacity: 0;
  }
}

.cart__subtotal,
.cart-additional-savings__price {
  margin: 0 0 0 ($gutter / 3);
  display: inline;
}

.cart__mini-labels {
  display: block;
  margin: ($gutter / 3) 0;
  font-size: em(12px);

  @include at-query ($min, $large) {
    display: none;
  }
}

input.cart__quantity-selector {
  width: 100px;
  margin: 0 auto;
}

.cart__remove {
  display: block;
}

.cart__note-add.is-hidden {
  display: none;
}

/*================ cart note was toggled display none for some reason 08282019 ================*/

.cart__note {
  display: none;

  &.is-active {
    display: block;
  }
}

.cart-item__discount,
.cart-additional-savings__savings,
.cart-subtotal__savings {
  display: block;
}

.cart .btn {
  margin-bottom: 4px;
}

.cart__additional_checkout {
  margin: ($gutter / 2) 0 0;

  input {
    padding: 0;
  }

  & > *:not(script) {
    padding: 5px 0 0 5px;
    vertical-align: top;
    line-height: 1;

    &:first-child,
    &:empty {
      padding-left: 0px;
    }
  }
}

.cart__continue-btn {
  .cart--no-cookies & {
    display: none;
  }
}

.cart--empty-message {
  .cart--no-cookies & {
    display: none;
  }
}

.cart--cookie-message {
  display: none;

  .cart--no-cookies & {
    display: block;
  }
}

/*================ Templates | Product Page ================*/
.product-single__variants {
  display: none;

  .no-js & {
    display: block;
  }
}

.product-single__photos {
  margin-bottom: $gutter;
}

.product-single__photos,
.product-single__thumbnails {
  a, img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
  }
}

.product-single__image-wrapper {
  margin: 0 auto;
  position: relative;
  width: 100%;
}

.product-single__image {
  width: 100%;
  top: 0;
  left: 0;

  &.lazyload {
    opacity: 0;
 
  }
}

.zoom-lightbox {
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
}

.image-zoom {
  cursor: move;
}

.product-single__thumbnails li {
  margin-bottom: $gutter;
}

.product-single__prices {
  font-family: $headerFontStack;
  margin-bottom: 20px;
}

.product-single__price {
  color: $colorPrimary;
  font-size: 1.4 * $baseFontSize;
  font-weight: $headerFontWeight;
}

.product-single__sale-price {
  opacity: 0.7;
  margin-left: 6px;
  font-size: 1.27 * $baseFontSize;
  font-weight: $headerFontWeight;
}

.product-single__quantity {
  margin-bottom: $gutter / 2;

  &.is-hidden {
    display: none !important;
  }

  .quantity-selector {
    display: inline-block;
   
  }
}

@include at-query($min, $large) {
  .single-option-selector,
  .quantity-selector {
    width: auto !important;
  }
}

.tabs {
  margin: $gutter 0;
}

.tab-switch__nav {
  padding: 0;
  list-style: none;
  border-top: 1px solid $colorBorder;
  border-bottom: 1px solid $colorBorder;
  margin: $gutter 0;

  li {
    display: inline-block;
    padding: $gutter / 2;
    margin-bottom: 0;
  }

  li:first-child {
    border-right: 1px solid $colorBorder;
  }
}

.tab-switch__trigger {
  display: block;
  color: $colorTextBody;
  font-weight: normal;
  margin: 0;

  &:hover,
  &:active {
    font-weight: normal;
  }

  &.is-active {
    font-weight: bold;
    color: $colorTextBody;
  }
}

.tab-switch__content {
  display: block;

  &.is-hidden {
    display: none;
  }
}

/*================ Snippet | Product Grid Item ================*/

.product__img-wrapper {
  width: 100%;
  margin: 0 auto;

  &.supports-js {
    position: relative;
  }
}

.product__img {
  display: block;
  margin: 0 auto;

  .product__img-wrapper.supports-js & {
    position: relative;
    top: 0;
    width: 50%
  }
}


/*================ custom code ================*/

/*================make buttons round 20px border-radius================*/

.btn, .btn--secondary, input.btn--secondary, .btn--tertiary, input.btn--tertiary, 
.shopify-payment-button .shopify-payment-button__button--unbranded, input[type="submit"] 
{
  border-radius:10px; padding-right:10px; padding-left:10px; padding-top:5px; padding-bottom:5px; font-size:14px; 
  
  
}




.section-header__link--right select, .section-header__link--right option {
    color: #000;
  background:#fff;
  border: .25px;
    border-color: rgba(0,0,0,0.10);
  font-size: 11px;
  border-radius:2px;
}











/* ===============================================
// Reveal module
// =============================================== */

/*.reveal .hidden { display: block !important; visibility: visible !important;}
.product:hover .reveal img { opacity: 1;
 


}
.reveal { position: relative; }
.reveal .hidden { 
  position: absolute; 
  z-index: -1;
  top: 0; 
  width: 95%; 
  height: 95%;  
  opacity:1;
  -webkit-transition: all .4s ease-in-out;
  -moz-transition:  all .4s ease-in-out;
  -o-transition:  all .4s ease-in-out;
  transition:  all .4s ease-in-out;
    
 
}
.reveal:hover .hidden { 
  z-index: 100000;
  opacity: 1;
     -webkit-transform:scale(1.2);
  -moz-transform:scale(1.2);
  -o-transformn:scale(1.2);
  transform:scale(1.2);
 overflow:visible;
 

  
 

}
.reveal .caption {
  position: absolute;
  top: 0;  
  display: 100%;
  height:100%;
  background-color: rgba(255, 255, 255, 1);
  
  font: 13px/1.6 sans-serif;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 1px;
  text-align: center;
  text-rendering: optimizeLegibility;
    border-radius: 15px;
  
}
.reveal .hidden .caption .centered {
  display: none;
  vertical-align: middle;
    border-radius: 15px;
}

@media (min-width: 480px) and (max-width: 979px) {
  .reveal .caption { 
    font-size: 8px; 
  }
  
 
}


*/


 

.product-single__price {color: #003366;}




/* style.css */
body.busy-cursor {
  cursor: progress;
}

.template-index    main.wrapper { 
        max-width:100%;
        padding:0;
        }
/* .template-index    main.wrapper>* {
        max-width: 1300px;
        margin-left: auto;
        margin-right: auto;
        padding-left:30px;
        padding-right:30px;
  
    } */
#shopify-section-slideshow {
        max-width: 100%;
        width: 100%;
        padding:0;


    }




.front-hover:active {cursor:wait; opacity: 0.1; 
    }
/* a:active {

  cursor:wait; opacity: 0.1;} */





/*hover animation



.img-hover{
    width: 350px;

    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
}
 
.transition {

    -webkit-transform: scale(1.1); 
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.front-hover
{
    width: 300px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;

}

.front-transition

{
    -webkit-transform: scale(1.05); 
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
}

*/














////////////// /*format category images for responsive*////////////// 

#responsive-wrapper{ margin: 0 auto;width: 85%;}

#test-response{
 width:22%; padding: 5px; float: left;
  
}

#test-response-medium{
  width: 18%;
padding:1px;  overflow: hidden; margin-left: 2%;float: left;
  
}
#test-response-large{
  width: 16.66%;
padding:1px;  overflow: hidden; margin: 0 auto;float: left;
  
}




.response-toggle {display:block;}
.response-toggle:active{background: white url("/cdn/shop/files/loading-3.gif?28031") ; background-size: 300px 100px;background-repeat: no-repeat;
  background-position: center; }

  
.template-collection .section-header__link--right {display:none;}
  
.template-collection .section-header__link--right .form-horizontal select{display:none;}
.form-horizontal label:not(.label--hidden){display:none;}







.response-replace1{display:none;} 
.response-replace2{display:none;}  




.mobile_dodisplay {display: none;}



////////////// /START RESPONSIVE//////////////    


////////////// /Tablets//////////////   





@media (min-width:574px) and (max-width: 706px) {

////////////// /*hide h1*//////////////  
 .section-header__title--left {display:none;}
#shopify-section-1552683848923{display:none;}
 #shopify-section-slideshow {display: none;}
.flexslider .slides img {display:none;}
 #flexslider--slider {display: none;}
 .mobile_nodisplay {display: none;}

#shopify-section-1562763352147 {display: none;}
   .mobile_dodisplay {display: block; max-width: 500px; }
  
//////////*  #responsive-collection-wrapper{display: flex;} .responsive-collection-title { flex: 0 0 30%;overflow: hidden;font-size: 20px; padding: 10px;} .responsive-collection-description { flex: 1; overflow: hidden;font-size: 15px;  padding: 10px; float: right;} 


 
.responsive-collection-title { text-align:center;} 
  
.responsive-collection-description { font-size: 18px; padding: 10px; text-align: center;} 
  
//////////*hide sort and browse by*///////////
  

  
/////////*resize grid of categories*////////
  #responsive-wrapper{ margin: 0 auto;width: 100%;float: left;}
  
#test-response { 

		width:25%; padding: 5px;margin:0 auto; float: left;
  
	}
  
 #test-response-medium{

 width: 20%;margin:0 auto; float: left;
  
}  
  
  
#test-response-large{

 width: 22%;margin:0 auto; float: left;
  
}  
  
////////////// /*keep text white in links*////////////// 	  
 a:link{color:inherit}
a:active{color:inherit}
a:visited{color:inherit}
a:hover{color:inherit}  
  

.response-toggle {display:none;}
  .response-replace1{display:block; font-size:20px;text-align:center; border-radius: 15px;margin: 0 auto;}    
 .response-replace2{display:none;}  
  button {background:transparent; padding: 0px; }
  
#cnc-response-block-1{width: 100%; padding: 20px; text-align: center; margin:0 auto;}
#cnc-response-block-1a{ float: left;width: 100%; padding: 5px; margin-bottom: 5px; font-size:16px;margin:0 auto; }
#cnc-response-block-4{float: left; width: 65%; padding: 10px; text-align: center;}
#cnc-response-block-4a{float: right; width: 35%; padding: 10px; margin-bottom: 5px; } 

}



////////////// /*phones*////////////// 	


@media (min-width: 200px) and (max-width: 573px) {
  p{font-size: 12x;margin-bottom: 0px;}
  h3{text-align: center; font-size:10px;  color: black; font-weight:bold;}
 
  .mobile_collection_break{ float: none; width: 100%; clear: both;}
 
  #FeatureRowImageWrapper--1560439098106{display: none;}
  
    #shopify-section-slideshow {display: none;}
  
    #shopify-section-1552683848923 {display:none;}
  .section-header__title--left {display:none;}
 
 
    .flexslider .slides img {display:none;}
  #flexslider--slider {display: none;}
 #shopify-section-1562763352147 {display: none;}
  .mobile_nodisplay {display: none;}
#shopify-section-1562763352147 {display: none;}
////////////// /*format h2*//////////////    
  
  .responsive-collection-title {text-align:center;}  
  .responsive-collection-description { font-size: 15px; padding: 10px; text-align: center;}
  
.template-collection .section-header__link--right {display:none;}
  .template-collection .section-header__link--right .form-horizontal select{display:none;}
.form-horizontal label:not(.label--hidden){display:none;}
.response-toggle {display:none;}
  .response-replace2{ 
    display:block; 
    font-family:$accentFontStack; 
    font-size:17px;
    text-align:center; 
    color:white; 
    text-transform: uppercase;
    word-spacing: 4px;
    background:#003e89; 
    border: 3px solid white; 
    border-radius: 15px;
    padding: 5px; 
    width:225px; 
    height:50px;
    margin: 0 auto;
    -webkit-box-shadow: -1px 1px 3px 0px rgba(0,0,0,0.75);
-moz-box-shadow: -1px 1px 3px 0px rgba(0,0,0,0.75);
box-shadow: -1px 1px 3px 0px rgba(0,0,0,0.75); 
    margin-bottom: 10px; 
    
  }  
 .response-replace1{display:none;} 
  #test-response { 
		width:100%; margin:0 auto; padding:5px; float: none;
  
	}
  
   #test-response-large{
width:90%; margin:0 auto; padding:2px; float: none; 
  
}
  
  #test-response-medium{
width:100%; margin:0 auto; padding:2px; float: none; margin-bottom: 0px;
  
}
////////////// /*keep text white in links*////////////// 

#cnc-response-block-1{ width: 100%; padding: 20px; text-align: center; margin:0 auto;}
#cnc-response-block-1a{ float: left;width: 100%; padding: 5px; margin-bottom: 5px; font-size:16px;margin:0 auto; }
#cnc-response-block-4{ width: 100%; padding: 20px; text-align: center; margin:0 auto;}
#cnc-response-block-4a{ width: 100%; padding: 20px; text-align: center; margin:0 auto; } 


}


.grid-link__title {padding-right: 15px; font-size: 10px; width: 90%; }




@media (min-width: 570px) and (max-width: 1920px){

#mobile-toggle{display: none;}
    #desk-toggle{ display:block;}


}
@media (min-width: 200px) and (max-width: 570px) {

/* hide desktop: fullscreen to 900pxwide */

  #desk-toggle{ display: none;}



  
  
}


/* hide tablerows fullscreen to 900pxwide */
  @media (min-width:100px) and (max-width: 918px){

    .hide-td {display: none;}
  

}




/* Popup Box */

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 8888; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb( 182, 219, 254); /* Fallback color */
    background-color: rgba(182, 219, 254,0.75); /* Black w/ opacity */
  
}

/* Modal Content/Box */
.modal-content {
    background-color: rgba(254, 254, 254, .85);
    margin: 10vh auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #B6DBFE;
    width: 100%; /* Could be more or less, depending on screen size */
	height:100%;margin-bottom: 0px;}
@media (min-width: 1366px) {
  .modal-content {
    background-color: #fefefe;
    margin: 10vh auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 30%; /* Could be more or less, depending on screen size */
    }
}

/* The Close Button */
.close {
    background:#003e89;
width:97%;
  height: 60px;
  padding:10px;
  font-size:14px;
  border-radius:12px; 
  border: 3px solid white;
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
  color: white;
	
  text-transform: uppercase;
  font-family:$accentFontStack;
  word-spacing: 2px;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

/*button.button {
    background:#003e89;
width:97%;
  height: 60px;
  padding:5px;
  font-size:25px;
  border-radius:12px; border: 3px solid white;
  -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
  color: white;

  text-transform: uppercase;
  font-family:$accentFontStack;
  word-spacing: 2px;
  margin: 5px;


}

button.button:hover {
  border-bottom:#a99567 1px solid;
  color:red;
}
*/

p.mobilebtncontainer { 
  margin: 0 auto;  
  width: 100%;

	}





p.small{font-size: 18px;    font-style: italic;
 }
p.small2{margin-bottom:0px; font-size: 14px;}

//**RESPONSIVE TABLE BREAKS


.featured-images .grid__item {
    margin-bottom: 10px;
}





.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url('/cdn/shop/files/ajax-loader_1.gif?35884') center no-repeat #fff;
opacity:.75;
}


.site-header{margin-bottom:0px;padding-bottom: 0px;}
.section-header--large {margin-bottom: 10px;}


.top-level {width: 80%;
  font-size: 14px; 
  background: #003e89; 
  border-radius:12px;  
  height: 40px; 
  color: white;
  font-family:$accentFontStack;
  border: 3px solid white;
 

  margin-top: 0px;
 -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);}
.top-level:hover {width: 100%;  color: white;}


a.white{color: white;}
h1.section-header__title {display: none;}

/*================ START HOMEPAGE STYLES ================*/


/*================ HOMEPAGE LARGE BUTTON STYLING ================*/
.front-page-btn-style{
  width: 100%; 
  font-size: 20px; 
  background: rgba(0,62,137,1); 
  border-radius:12px;  
  height: 50px; 
  color: white;
  font-family: 'Roboto Condensed', sans-serif;
  border: 3px solid white;
  font-weight: 700;
  letter-spacing: 1.25px;
  -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
}

.containermessage {
  position:relative; 
  width:100%;
}

.overlaymessage {
position: absolute;
top:10%;
bottom: 0;
left: 6.5%;
right:0;
height:30%;
width: 87%;
opacity: 0;
transition: .5s ease;
z-index:1;
}

.containermessage:hover .overlaymessage {
opacity: 1;
}

.text { display: none;
color: black;
font-size: 16px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
text-align: center;
font-family: 'Roboto Condensed', sans-serif;
cursor: pointer;
width: 80%;
  height: 40px;
border: 1px solid gray;
background: #c0edff;
border-radius: 10px;
font-weight: bold;
  padding: 10px;
}

text:hover text:focus{ 
  display: none;
  font-weight: bold;
color: black;
border: 2px solid white;
background:rgba(0,62,137,1);
border-radius: 10px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.75);
}

.image {
display: block;
width: 100%;
height: auto; 
}

div.text{color: black;}

/*================ HIDE SEO DESCRIPTION ================*/
.hide-element {
    border: 0;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
/*================ HOME PAGE TRIGGER BUTTONS POSITIONING================*/
.container1 {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  width: 100%;
}
.container2 {

 
display: flex;
 flex-direction: column;
padding: 5px;
width: 100%;

 
}

.item1 {
  width: 25%;  
  padding: 10px;
  height:185px;
   
}

.item2 {
align-items: flex-start;
margin: auto; 
width: 100%;
}





/*================ CATEGORY OVERLAY POSITIONING================*/





.overlay {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(255,255,255);
  background-color: rgba(255,255,255, .98);
  overflow-y: hidden;
  transition: 0.5s;
}

.overlay-content {
  position: relative;
  top: 10%;
  width: 100%;
  text-align: center;
  margin-top: 10px;
}

.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 18px;
  color: black;
  display: block;
  transition: 0.3s;
}


.overlay .closebtn {
  position: absolute;
  top: -10px;
  right: 10px;
  font-size: 70px;
width: 80px;
}



/*================ CATEGORY wrappers by the row================*/

.containerxsmall{
 display: flex;
-webkit:flex;
flex-flow: row wrap;
justify-content: flex-start;
width: 50%;
margin: 0 auto;
padding-top: 0px;

}


.containersmall{
 display: flex;
-webkit:flex;
flex-flow: row wrap;
justify-content: flex-start;
width: 65%;
margin: 0 auto;
padding-top: 0px;

}


.containermedium{
 display: flex;
-webkit:flex;
flex-flow: row wrap;
justify-content: flex-start;
width: 80%;
margin: 0 auto;
padding-top: 0px;

}

.containerlarge{
 display: flex;
-webkit:flex;
flex-flow: row wrap;
justify-content: flex-start;
width: 80%;
margin: 0 auto;
padding-top: 0px;

}



.large-category-items {
 width: 16.65%;
  padding: 5px;
  transition: padding 0.2s ease;
}
.large-category-items:hover {

  padding: 0px;
 
}

.medium-category-items {
 width: 20%; 
  padding: 5px;
  transition: padding 0.2s ease;
}

.medium-category-items:hover {
 padding: 0px;

}

.small-category-items {
 width: 25%; 
  padding: 5px;
  transition: padding 0.2s ease;
}

.small-category-items:hover {
 padding: 0px;

}



.xsmall-category-items {
 width: 33%; 
   padding: 5px;
  transition: padding 0.2s ease;
}

.xsmall-category-items:hover {
  padding: 0px;

}

.container-home-btns {
 display: flex;
-webkit:flex;
  flex-flow: row wrap;
justify-content: flex-start;
width: 100%;
}

.sticky{position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 5px;
padding: 5px;
padding-top: 20px;
 z-index:1;
background: white;
}



@media (min-width: 250px) and (max-width:  500px) {
.overlaymessage {
  display: none;
}

  .overlay {overflow-y: auto;}
  .overlay a {font-size: 20px}
  .overlay .closebtn {
  font-size: 50px;
  top: 15x;
  right: 0px;

  }

.container2{ width:100%;}

.item1 {
  width: 50%;  
  padding: 0px;

}
.containerlarge {
width: 100%;
}.containermedium {
width: 100%;
}.containersmall {
width: 100%;
}.containerxsmall{
width: 100%;
}
.large-category-items {
 width: 50%; 
}
.medium-category-items {
 width: 50%; 
}
.small-category-items {
 width: 50%; 
}
.xsmall-category-items {
 width: 50%; 
}
.front-page-btn-style{
  width: 100%; 
  font-size: 12.5px; 
  background: rgba(0,62,137,1); 
  border-radius:12px;  
  height: 45px; 
  color: white;
  font-family: 'Roboto Condensed', sans-serif;
  border: 3px solid white;
  font-weight: 700;

  -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
 
}
}

@media (min-width: 200px) and (max-width:  359px) {

  
  .front-page-btn-style{
  width: 90%; 
  font-size: 11.5px; 
  background: rgba(0,62,137,1); 
  border-radius:12px;  
  height: 65px; 
  color: white;
  font-family: 'Roboto Condensed', sans-serif;
  border: 3px solid white;
  font-weight: 650;

  -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
   
 
}


}
.btn--wide, .product-form--wide .shopify-payment-button__button, .product-form--wide .shopify-payment-button__more-options{ width: 65%;}


.cancel-button {
  background:rgba(255,0,0, .75);
  color: white; 
  border-radius: 10px;
  padding: 5px; 
  width: 150px;

}

.cancel-button:hover {
  background:rgba(255,0,0, 1);
  



}


.img-hover{
opacity:.95;
  padding: 5px;
  transition: padding 0.2s ease;
 
}

.img-hover:hover{
opacity:1;
  padding: 0px;


}





/*================ CATEGORY OVERLAY POSITIONING================*/
.overlayh2{padding-top: 10px;}

.overlaysupplies {
  height: 0%;
  width:33%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(000,000,000);
  background-color: rgba(255,255,255,1);
  overflow-y: hidden;
  transition: 0.6s;
  

   
}






.overlay-content-supplies{
  
   position: relative;
  top: 2%;
  width: 80%;
  text-align: center;
  
float:left; 
  padding: 5px;
  margin-left:10%;
    margin-right:10%;

}






.suppliesoverlaybuttoncontainer {
  width: 50%;  
  padding: 5px;
float:left;
 
 
}



.container-home-btns-supplies {
 
 
 

 
 
}



.front-page-btn-style-supplies-overlay{
  width: 100%; 
  font-size: 12px; 
  background: rgba(0,62,137,1); 
  border-radius:10px;  
  height: 35px; 
  color: white;
  font-family: 'Roboto Condensed', sans-serif;
  border: 3px solid white;
  font-weight: 700;

  -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
}

@media (min-width: 200px) and (max-width:600px){
.overlayh2{ font-size: 20px; text-align: center;}
 
  .overlaysupplies {
  height: 0%;
  width:100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
    background-color: rgba(255,255,255,1);

  overflow-y: hidden;
  transition: 0.6s;
   
   
}
  
  .overlay-content-supplies{
  position: relative;
  top: 0%;
  width:100%;
  text-align: center;
  margin-top: 10px;
  margin: 0 auto;
 
}
  
.container-home-btns-supplies {
  
 display: flex;
-webkit:flex;
  flex-flow: row wrap;
justify-content: flex-start;
width: 90%;
  margin: 0 auto;
  
 
}  


  
  .front-page-btn-style-supplies-overlay{
  width: 100%; 
  font-size: 12px; 
  background: rgba(0,62,137,1); 
  border-radius:10px;  
  height: 35px; 
  color: white;
  font-family: 'Roboto Condensed', sans-serif;
  border: 3px solid white;
  font-weight: 700;

  -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
}
  
  
}

@media (min-width: 100px) and (max-width:300px){



 .overlaysupplies {

  
 
  background-color: white;
   
  width: 100%;

   
}

  
    .front-page-btn-style-supplies-overlay{
  width: 100%; 
  font-size: 14px; 
  background: rgba(0,62,137,1); 
  border-radius:8px;  
  height: 35px; 
  color: white;
  font-family: 'Roboto Condensed', sans-serif;
  border: 2px solid white;
  font-weight: 600;

  -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
}
  
  
  .suppliesoverlaybuttoncontainer {
  width: 100%;  
  padding: 5px;

 
 
}


}




/*================ Custom MAst scaling phone================*/



.custom-mast-container {
  margin-top:-10px;
 width: 100%; 
margin-bottom: 0px;
  
margin: 0 auto;
 float: left; 
  padding: 5px;
}

















.custom-mast-container-wrapper {
 
  background:rgba(255,255,255,0);  

max-width: 970px;


  margin: 0 auto; padding: 5px;
 

  
}

.custom-mast-container-wrapper a {color: white;}



.custom-mast-left-block-container{ 
width: 30%;
padding-top: 35px;
padding-left: 20px;
float: left;
height: 200px;
  background:rgba(255,255,255,0);
   height: 150px; 
}

.custom-mast-logo-block-container{
width:30%;
background: rgba(255,255,255,0);
padding: 5px;
height:  200px;
float: left;

}

.custom-mast-right-block-container{

background: white; 

width: 28%;
padding:10px;
float: right;
height: 200px;
 
-webkit-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.25);
-moz-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.25);
box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.25);


margin-bottom: 0px;




}


.custom-mast-nav-container{
background: white;
border-top:1px solid blue;

float: left; 
width:970px;
padding: 5px;
border-bottom:1px solid blue;  



                                                
}
.custom-nav-btn-container{

width: 16.65%;

   float: left; 

}


.nav-btn-style-custom{ 
  background: white; 
  width: 100%; 
  text-align: center;
cursor: pointer; 
font-size:16px;
 
padding: 5px; 
font-family: 'Lato', sans-serif; 
  border: 1px solid white;
}
.nav-btn-style-custom:hover{font-weight:700; }

.custom-nav-btn-container:hover{
font-weight:700; 

width: 16.65%;

float: left; 
  
}


a.forgot{color:black;}





input[type="submit"] { min-height: 25px;}

.mast-login-submit{opacity:.85;}
.mast-login-submit:hover {opacity:1;}
.cal-vinyl-brand-container{
display: flex;
-webkit:flex;
flex-flow: row wrap;
justify-content: flex-start;
width: 40%;
margin: 0 auto;
padding-top: 0px;
}


.cal-vinyl-brand-container-items {width: 50%;}




@media (min-width: 500px) and (max-width:724px){
  .custom-mast-nav-container{float: left;width: 100%; display: none; }
  .custom-mast-container-wrapper {padding: 5px;}
    .hide-me{
    display: none;
      margin-top: 0px;
  }
  


  .custom-mast-left-block-container{ 
    padding: 5px;
    width: 55%;
    float: left;
    margin-top: 10%;
  }
  
  .scale-logo-img { 
float: left;
    width: 100%; padding: 10px;

}  
     .custom-mast-logo-block-container{display: none; }
  .custom-mast-right-block-container{width: 45%;}
  .custom-mast-right-block-container-signed-in-customer{width: 45%;}
  
  
  .forgot{display: none;}
 input.mast-login-submit{ width: 100%;}
  
  
}
@media (min-width: 500px) and (max-width:940px){
.item2{width: 100%; padding: 0px; padding: 5px;height: 35px; margin-bottom: 10px;}
    .front-page-btn-style{width: 100%;padding: 0px; border-radius: 8px; height:35px;font-size: 14px;}
  span.mobile-button-string {display: none;}
    .item1{padding: 0px;}
  
  

}

@media (min-width:50px) and (max-width:600px){
    #homepage-double-slider-container2{display: none;}
  #double-container-right{display: none;}}

@media (min-width:200px) and (max-width:349px){
    #homepage-double-slider-container2{display: none;}
    #double-container-right{display: none;}
  .custom-mast-nav-container{float: left;width: 100%; display: none; }

 .custom-mast-container-wrapper {width: 100%;   margin: 0 auto; padding:5px;height:90px; float: left; }

.custom-mast-left-block-container{float: none;padding: 5px; height:90px;width: 75%; margin-top: 0px;margin-bottom: 5px;;margin: 0 auto; }
  .scale-logo-img { 
float: none;
    width: 100%; padding: 5px;margin-top: 0px; 

}  
   .custom-mast-right-block-container{display: none;
    width: 100%;
    float: none; 
    margin-left: 0px;
    margin: 0 auto; 
    margin-top: 2px;
  }
  
   .item1{padding:5px;}
  .item2{width: 100%; padding: 0px; padding: 5px;height: 35px;margin-right: 5px; margin-bottom: 1px;}
  .front-page-btn-style{width: 100%;padding: 0px; border-radius: 8px; height:35px;font-size: 14px;}
}



@media (min-width:350px) and (max-width:499px){
    #homepage-double-slider-container2{display: none;}
  
   #double-container-right{display: none;}

  span.mobile-button-string {display: none;}
  .item1{padding:5px;}
  .item2{width: 100%; padding: 0px; padding: 5px;height: 35px;margin-right: 5px; margin-bottom: 5px;}
  .front-page-btn-style{width: 100%;padding: 0px; border-radius: 8px; height:35px;font-size: 14px;}
     .custom-mast-container-wrapper {width: 65%;   margin: 0 auto; padding:5px;  height:120px;}

.custom-mast-left-block-container{float: none;padding: 5px; height:140px;width: 100%; margin-top: 0px;margin-bottom: 5px;;margin: 0 auto; }
  .scale-logo-img { 
float: none;
    width: 100%; padding: 5px;margin-top: 0px; 

}  
 
  
    .hide-me{
    display: none;
      margin-top: 0px;
  }
  
  .custom-mast-logo-block-container{ display: none; }
  .custom-mast-right-block-container{display: none;
    width:70%;
    height: 100px;
    float: none; 
    margin: 0 auto;
    margin-top: 30px;
  }
   .custom-mast-right-block-container-signed-in-customer{
     width:70%;
    height: 180px;
     float: none; 
     margin: 0 auto;
     margin-top: 30px;
      margin-bottom: 30px;
   }
  
  .forgot{display: none;}
 input.mast-login-submit{ width: 100%;}
  .custom-mast-nav-container{float: left;width: 100%; display: none; }
  .custom-nav-btn-container{float: none;width: 100%;text-align: center;display: none;}
  .custom-nav-btn-container:hover{float: none;text-align: center; font-weight: 400;display: none; }

    
  .toggle-custom-mobile-nav-none{display: none;}
  .toggle-custom-mobile-nav{display: block; width: 100%;display: none;}
  
  .site-header{padding: 0px;}
   .cal-vinyl-brand-container{width: 90%; margin: 0 auto;}
  .cal-vinyl-brand-container-items {width: 50%;}
}


@media (min-width: 100px) and (max-width:325px){
    #homepage-double-slider-container2{display: none;}
   #double-container-right{display: none;}
  .custom-mast-container-wrapper {width: 100%;}
  
   span.hide-me{
    display: none; height: 1px;
  
  }
  
  .custom-mast-left-block-container{ width: 200px; padding: 5px;}
.item1{width: 50%; padding: 0px; padding: 5px;height: 40px;}
    .container-home-btns{padding: 0px; float: none;}
  .item2{width: 100%;padding: 0px;margin-bottom: 0px;}
  
  .front-page-btn-style{width: 100%;padding: 0px; border-radius: 8px; height:30px;font-size: 10px;}
  
  
  .custom-mast-logo-block-container{display: none; }
  .custom-mast-right-block-container{display: none;
    width: 100%;
    float: none; 
    margin-left: 0px;
    margin: 0 auto; 
    margin-top: 2px;
  }
  
  .custom-mast-right-block-container-signed-in-customer {display: none;
    width: 100%;
    float: none; 
    margin-left: 0px;
    margin: 0 auto; 
    margin-top: 2px;
    margin-bottom: 10px;
    padding:5px;
 
    
  }
  
  .forgot{display: none;}
 input.mast-login-submit{ width: 100%;display: none;}
  
  .site-header{padding:0px;}
.sticky{ font-size: 11px; text-align: center;}

  .cal-vinyl-brand-container{width: 90%; margin: 0 auto;}
  .cal-vinyl-brand-container-items {width: 50%;}

  
}





input#CustomerEmail{background: white;}
div.header-bar{padding: 0px; margin-bottom: 0px; background: #ddd;}
.site-header{padding-top: 0px;}
a#customer_register_link{color: black;}

a.cart-page-link{color: black;}



@media (min-width: 100px) and (max-width:350px){
    #homepage-double-slider-container2{display: none;}
  #flexslider--1571508141205{display: none;}

 
span.mobile-button-string {display: none;}
  #double-container-right{display: none;}
  .front-page-btn-style{width: 100%;padding: 0px; border-radius: 8px; height:30px;font-size: 10px;}

}



.colorpicker-flex-container{
  display: flex;
  flex-wrap: wrap;
 width: 100%;
 justify-content: left;
}
.colorpicker-flex-container > div {
  
width: 50px; 
  height:50px;
  border-radius: 1px;
  
  -webkit-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
  cursor: pointer;
 
  margin: 3.5px;

  text-align: center;

  font-size: 8px;

}
.colorpicker-flex-container > div:active {
  
width: 50px; 
  height:50px;
  border-radius: 50px;

  
  -webkit-box-shadow: inset 1px 1px 2px 0px rgba(0,0,0,0.50);
-moz-box-shadow: inset 1px 1px 2px 0px rgba(0,0,0,0.50);
box-shadow: inset 1px 1px 2px 0px rgba(0,0,0,0.50);
  cursor: pointer;
 
  margin: 3.5px;



  font-size: 8px;

}




.color-picker-number{width:
  50px; height:50px; font-weight: bold; font-size:12px; opacity: 0;
  padding-top:30%; padding-right:3px;border-radius: 50px;}

.color-picker-number:hover{opacity: 1;}
/* .colorpicker-flex-container > div:hover{
  opacity: 1;
  border: 1px solid rgba(0,0,0,0.2);
  border-radius:50px;



} */


 .mobile-calendered-h3{text-align: center;}
.mobile-float-vinyl{width: 20%; float: left;margin-top: 0px;}


.right-vinyl-container{background:rgba(255,255,255,1); width: 40%; float:right;}
.left-vinyl-container {background:rgba(255,255,255,1); width: 60%;float: left;}

@media (min-width: 351px) and (max-width:515px){
.right-vinyl-container{ width: 100%; float:left; min-width: 200px;}
  .left-vinyl-container { width: 100%;float: none;min-width: 200px;}
  #homepage-double-slider-container2{display: none;}

}

@media (min-width: 100px) and (max-width:350px){
    #homepage-double-slider-container2{display: none;}
  .right-vinyl-container{background:rgba(255,255,255,1);border: 1px solid red; width: 100%;float:left; margin-top: 0px;min-width: 200px;}
  .left-vinyl-container {background:rgba(255,255,255,1); border: 1px solid red;width: 100%;float: none;min-width: 200px;}
 
  .mobile-calendered-header{ font-size: 14px; text-align:center;margin-top: 30px;}
  .mobile-calendered-h3 {background: rgba(255,255,255,0); color: black;}
  
  
  

}





.vinyl-minicollections-overlay{
  height: 0%;
  width:100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(000,000,000);
  background-color: rgba(255,255,255,1);
  overflow-y: hidden;
  transition: 0.6s;
  

   
}


.minicollections-content-overlay{ 
  position: relative;
  top: 2%;
  width: 80%;
  text-align: center;
  
float:left; 
  padding: 5px;
  margin-left:10%;
    margin-right:10%;

}


.container-minicollections-overlay{

display: flex;
  flex-wrap: wrap;
 width: 80%;
  margin: 0 auto;
 justify-content: center;


}


.container-minicollections-overlay > div {

  width:100%;
  padding: 5px;
  margin-bottom: 5px;
  text-align: center;
  line-height: 1.8;
  font-size: 12px;
  border: 1px solid red;
}


.choose-size-options-container{

display: flex;
  flex-wrap: wrap;
 width: 90%;
  margin: 0 auto;
 justify-content: center;
}
.choose-size-options-container > span{

  width:23%;
  height: 50px;
  padding: 5px;
  margin-bottom: 5px;
  text-align: center;
  line-height: 2;
  font-size: 11px;

}


.vinyl-size-picker{ float: left; width: 1000px; padding: 5px;}
a.grid-link{padding-bottom: 5px;}

 .mobile-product-title{color:black; font-weight: bold; font-size: 12px;padding-top: 10px;margin-bottom: 0px;}

 .mobile-vinyl-items-container{

display: flex;
  flex-wrap: wrap;
 width: 80%;
  margin: 0 auto;
 justify-content: center;

  
  }


@media (min-width: 726px) and (max-width:931px){

  .container-minicollections-overlay{width:100%;}
.container-minicollections-overlay > div {

  width:25%;
  padding: 10px;
  margin-bottom: 5px;
  text-align: center;
  line-height: 1.8;
  font-size: 12px;
  border: 1px solid red;padding: 5px;
}



}


@media (min-width: 100px) and (max-width:450px){
  .hide-mobile{display: none;}
   .minicollections-content-overlay{
 
    width: 100%; 
     margin: 0 auto;
    padding: 2px;
     overflow: scroll;
  }
  

.container-minicollections-overlay > div {

  width:50%;
  padding: 10px;
  margin-bottom: 5px;
  text-align: center;
  line-height: 1.8;
  font-size: 12px;
 padding: 5px;
}

  
  form.vinyl-form{border: 1px solid blue; margin-bottom: 0px;}
}


.dropbtn {
  background-color: #fff;
  color: black;
  padding: 5px;
  font-size: 16px;
  border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: rgba(255,255,255,1);
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-size:12px;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #b7dcff;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #fff;}

.default-text {
  width:674px;
  margin:auto 0;
  text-align:center;
   background:white;
 
}

div#a{
  margin:10px auto 0;
  text-align:center;
  width: 100%;
  background:white;
 

}

h3 {
  font-size: 2em;
}

.hide {
  display: none;

}

label[for]{
  cursor:default;
  font-size: 16px;
  font-weight: 600 ;

}

.swing-in-bottom-fwd {
	-webkit-animation: swing-in-bottom-fwd 0.9s cubic-bezier(0.175, 0.885, 0.320, 1.275) alternate both;
	        animation: swing-in-bottom-fwd 0.9s cubic-bezier(0.175, 0.885, 0.320, 1.275) alternate both;
}

/* ----------------------------------------------
 * Generated by Animista on 2019-11-18 12:46:11
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation swing-in-bottom-fwd
 * ----------------------------------------
 */
@-webkit-keyframes swing-in-bottom-fwd {
  0% {
    -webkit-transform: rotateX(100deg);
            transform: rotateX(100deg);
    -webkit-transform-origin: bottom;
            transform-origin: bottom;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0);
            transform: rotateX(0);
    -webkit-transform-origin: bottom;
            transform-origin: bottom;
    opacity: 1;
  }
}
@keyframes swing-in-bottom-fwd {
  0% {
    -webkit-transform: rotateX(100deg);
            transform: rotateX(100deg);
    -webkit-transform-origin: bottom;
            transform-origin: bottom;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0);
            transform: rotateX(0);
    -webkit-transform-origin: bottom;
            transform-origin: bottom;
    opacity: 1;
  }
}


.focus-in-expand-fwd {
	-webkit-animation: focus-in-expand-fwd 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940)  both;
	        animation: focus-in-expand-fwd 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940)  both;
}
/* ----------------------------------------------
 * Generated by Animista on 2019-11-18 13:8:17
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation focus-in-expand-fwd
 * ----------------------------------------
 */
@-webkit-keyframes focus-in-expand-fwd {
  0% {
    letter-spacing: -0.5em;
    -webkit-transform: translateZ(-800px);
            transform: translateZ(-800px);
    -webkit-filter: blur(12px);
            filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
}
@keyframes focus-in-expand-fwd {
  0% {
    letter-spacing: -0.5em;
    -webkit-transform: translateZ(-800px);
            transform: translateZ(-800px);
    -webkit-filter: blur(12px);
            filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0);
            transform: translateZ(0);
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
}


.shadow-inset-center {
	-webkit-animation: shadow-inset-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: shadow-inset-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}












 input[type='radio'] { transform: scale(1.25); }

input[type="number"] {
  -webkit-appearance: textfield;
     -moz-appearance: textfield;
          appearance: textfield;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none;
}


input[type="number"] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

.number-input {
  border: 2px solid #ddd;
  display: inline-flex;
}

.number-input,
.number-input * {
  box-sizing: border-box;
}

.number-input button {
  outline:none;
  -webkit-appearance: none;
  background-color: transparent;
  border: none;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  cursor: pointer;
  margin: 0;
  position: relative;
}

.number-input button:before,
.number-input button:after {
  display: inline-block;
  position: absolute;
  content: '';
  width: 1rem;
  height: 2px;
  background-color: #212121;
  transform: translate(-50%, -50%);
}
.number-input button.plus:after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.number-input input[type=number] {
  font-family: sans-serif;
  max-width: 5rem;
  padding: .5rem;
  border: solid #ddd;
  border-width: 0 2px;
  font-size: 2rem;
  height: 3rem;
  font-weight: bold;
  text-align: center;
}


/* ----------------------------------------------
 * length picker mobile
 * ---------------------------------------------- */


.size1-swing-div{width:80%;margin:0 auto;}
.single-box-left{float:left;width:100%;}
.single-box-left-1-variant{float:left;width:100%;}
.single-box-left-1-variant-form{border:1px solid green;width:100%;}
.single-box-left-1-variant-form-ul{border:1px solid red;}
.single-box-left-1-variant-form-image{float:left;width:150px;height:150px;}






.desktop-variant-image2{border:1px solid rgba(0,0,0,0.5); -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5);
box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5); width: 175px; border:1px solid rgba(0,0,0,0.5);float: left;margin-top: 0px; 
  padding:5px;height: 150px; border-radius:5px;}

.single-variant-li-1{border:1px solid red;float:left;width:30%;padding: 5px;}













.single-variant-form{width: 100%;margin-bottom:0px;  padding:10px; border:1px solid blue;}
.single-variant-add-button-list{border: 1px solid red;width:20%;float:left;border:3px solid blue;}
.size1-image{
  border:1px solid rgba(0,0,0,0.5); 
  -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5);
box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5); 
  width: 30%; 
  border:1px solid rgba(0,0,0,0.5);
  float: left;
  margin-top: 0px; 
  padding:5px;
  height: 130px; 
  border-radius:5px; 
}
.desktop-single-variant{width:50%; float: left;margin-top: 0px;border:3px solid blue;}


.mobile-length-options{display:none;}
 .length-options-show{display:block;}



.desktop-product-title{font-size:14px;font-weight: bold;}




@media (min-width: 100px) and (max-width:500px){
.desktop-product-title{text-align: center; font-weight:bold;}
  .size1-image{display:none;}
    .desktop-single-variant{width:100%; border: 1px solid blue;background: red;text-align:center;}




}
 
.desktop-variant-form {float:left;width: 100%;margin-bottom:0px;  padding:10px; }

@media (min-width: 100px) and (max-width:500px){

.desktop-variant-form  {float:left;width: 100%;margin-bottom:0px;  padding:10px;}}

.desktop-ul-1{float:left;width: 80%;text-align: center;}

@media (min-width: 100px) and (max-width:500px){

.desktop-ul-1{float:left;width: 100%;text-align: center;margin-bottom:0px; }}

.desktop-variant-image{border:1px solid rgba(0,0,0,0.5); -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5);
box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5); width: 20%; border:1px solid rgba(0,0,0,0.5);float: left;margin-top: 0px; 
  padding:5px;height: 130px; border-radius:5px;}



@media (min-width: 100px) and (max-width:500px){  .desktop-variant-image{display:none;}  }
.size1mobile{width:15%;float: left;margin-top: 0px;}
.desktop-li-1{width: 20%; float: left;margin-top: 0px;}
.desktop-li-2 {width:15%;float: left;margin-top: 0px;}
@media (min-width: 100px) and (max-width:500px){
.desktop-li-2 {width:25%;float: left;margin-top: 0px;}
.desktop-li-1{width: 25%; float: left;margin-top: 0px;}.size1mobile{width:100%;}}

.desktop-variant-title-1{font-size:12px; font-weight:bold; }
@media (min-width: 100px) and (max-width:500px){.desktop-variant-title-1{font-size:10px; font-weight:bold; }}

.desktop-variant-price-1{font-size:12px;}

@media (min-width: 100px) and (max-width:500px){ .desktop-variant-price-1{font-size:10px;}}

.desktop-variant-price-2{font-size:12px;}
@media (min-width: 100px) and (max-width:500px){ .desktop-variant-price-2{font-size:10px;}}
.desktop-ca{font-size:12px; font-weight: bold; -webkit-animation: color-change 1s infinite;
    -moz-animation: color-change 1.5s infinite;
    -o-animation: color-change 1.5s infinite;
    -ms-animation: color-change 1.5s infinite;
    animation: color-change 1.5s infinite;}

@-webkit-keyframes color-change {
    0% { color:#003e89; }
    50% { color: red; }
    100% { color:#003e89; }
}
@-moz-keyframes color-change {
    0% { color:#003e89; }
     50% { color: red; }
    100% { color:#003e89; }
}
@-ms-keyframes color-change {
     0% { color:#003e89; }
    50% { color: red; }
    100% { color:#003e89; }
}
@-o-keyframes color-change {
     0% { color:#003e89; }
    50% { color: red; }
    100% { color:#003e89; }
}
@keyframes color-change {
     0% { color:#003e89; }
   50% { color: red; }
    100% { color:#003e89; }
}


.desktop-ca-show{font-size:10px; font-weight: 900;}
@media (min-width: 100px) and (max-width:500px){
  .desktop-ca-show{display:none;}
.desktop-ca{font-size:10px; font-weight: bold;}}
.mobile-show-wholesale{display:none;}
@media (min-width: 100px) and (max-width:500px)
{ .desktop-ca{font-size:10px; font-weight: bold;}
.mobile-hide-wholesale{display:none;}
.mobile-show-wholesale{font-size:10px; font-weight: bold;}

}

.desktop-add-btn-li{width: 15%; float: left;margin-top: 0px;font-size:14px;}
@media (min-width: 100px) and (max-width:500px){ 
  .desktop-add-btn-li{width: 50%; float: left;margin-top: 0px;padding: 5px;font-size:10px;margin-bottom: 0px;}}

.desktop-add-label{text-align:center; font-weight: bold;}

@media (min-width: 100px) and (max-width:500px){ 
  .desktop-add-label{text-align:center; font-weight: bold;margin-bottom: 0px;}}
.list-item-add-to-cart-desktop{width: 15%; float: left;margin-top: 0px; padding:5px; }


.list-item-add-to-cart-desktop{width: 15%; float: left;margin-top: 0px; padding:5px; }
@media (min-width: 100px) and (max-width:500px){
  .list-item-add-to-cart-desktop{ width: 50%; float: left;margin-top: 12px; padding:5px;}
}


 .mobile-vinyl-header{font-size:16px; font-weight:bold;margin-bottom:5px;}


@media (min-width: 100px) and (max-width:500px){
.colorpicker-flex-container > div:active { 
width: 50px;
height:50px;}
.mobile-length-options{display:block;}
  .length-options-show{display:none;}
  input[type='radio'] { transform: scale(1.25); }  
  .mobile-vinyl-header{font-size:15px; font-weight:bold;text-align:center;margin-bottom:5px;}
  
  /* ------mobile add to cart for vinyl -- */
  .mobile-swing-div-add{padding:8px;font-size:8px;font-weight:bold;}
  
  .colorpicker-flex-container{
  display: flex;
  flex-wrap: wrap;
 background:rgba(255,255,255,1);
    width: 100%;
 justify-content: flex-start;
  }
  
.colorpicker-flex-container > div {
  background-color: #f1f1f1;
  width: 50px;
  height:50px;
  margin-bottom: 5px;
  text-align: center;
  line-height: 25px;
  font-size: 10px;
  border-radius:50px;
}
  
.colorpicker-flex-container > div:hover{
  opacity: 1;
  border: 1px solid rgba(0,0,0,0.2);
  border-radius:50px;
 -webkit-transition: border-radius  .9s ease-in-out; /* Safari prior 6.1 */
  transition: border-radius  .9s ease-in-out;}  
  .color-picker-number{
    opacity:1;
    width:100%;
    font-size:12px;
    padding-top:12px;
   
    text-align:center;
  }
  .mobile-swing-div{ width: 100%; margin-top:0px;  float:left;}
  


  
  .colorpicker-flex-container > div:active{cursor:waiting;}


 
  

}


.graphtec-mobile-toggle{display: none;}
.graphtec-desk-toggle{display: block;}

@media (min-width: 100px) and (max-width:400px){
  .graphtec-mobile-toggle{display: block;}
.graphtec-desk-toggle{display: none;}
  .graphtec-mobile-toggle>ul{ list-style-type: disc;font-size:10px;font-weight: bold;margin-bottom:0px;}
  div.filter-menu .pt-mobile-header{height: 0px;padding:0px;}  
  
  
}


div.collectionTitle {display:none;}


.foo{background:red;}
.bar{background:blue;}



.SKU-1423-UOM-1{background: white;border: 1px solid gray;  }
 
.SKU-1400-UOM-1{background: black;color:white; }

.SKU-1407-UOM-1{ background: #ffd401; } 
 
.SKU-1408-UOM-1{background: #fff800;} 

.SKU-1435-UOM-1{background: #fec200;} 

.SKU-1341-UOM-1{background: #000;color:white;} 

.SKU-1403-UOM-1{background: #5f050f;color: white;} 
 
.SKU-1404-UOM-1{background: #d9191a;color: white;} 
   
.SKU-1406-UOM-1{background: #ee5d13;} 
  
.SKU-1417-UOM-1{background: #400c60;color: white;} 
  
.SKU-1416-UOM-1{background: #f982b8;} 
  
.SKU-1420-UOM-1{background: #0b1e60;color: white;} 
  
.SKU-1412-UOM-1{background: #081028;color: white;} 
  
.SKU-1458-UOM-1{background: #163882;color: white;}
  
.SKU-1421-UOM-1{background: #258cd9;} 

.SKU-640-UOM-1{background: #98b0cd;} 

.SKU-1415-UOM-1{background: #4b959e;} 

.SKU-1409-UOM-1{background: #1e9659;color:white;} 
  
.SKU-1414-UOM-1{background: #2add2a;} 
  
.SKU-1624-UOM-1{background: #0f4c2c;color:white;} 

.SKU-1450-UOM-1{background: #301f15;color:white;} 
  
.SKU-1451-UOM-1{background: #9b851b;color:white;} 

.SKU-1424-UOM-1{background: #929393;color:white;}
  
.SKU-1455-UOM-1{background: #babdbf;} 

.SKU-651-010-1{background: white;border: 1px solid gray;}
.SKU-651-010M-1{background: white;border: 1px solid gray;}
.SKU-651-019-1{background: rgb(230, 167, 0);}

.SKU-651-020-1{background: rgb(251, 170, 0);}

.SKU-651-021-1{background: rgb(254, 197, 0);}

.SKU-651-022-1{background: rgb(242, 202, 0);}

.SKU-651-025-1{background: rgb(242, 226, 16);}

.SKU-651-026-1{background: rgb(94, 5, 14); color: white;}

.SKU-651-312-1{background: rgb(111, 0, 14); color: white;}

.SKU-651-030-1{background: rgb(144, 14, 22); color: white;}

.SKU-651-031-1{background: rgb(176, 0, 13); color: white;}

.SKU-651-032-1{background: rgb(201, 17, 0); color: white;}

.SKU-651-047-1{background: rgb(211, 49, 0); color: white;}

.SKU-651-034-1{background: rgb(223, 74, 6); color: white;}

.SKU-651-036-1{background: rgb(234, 103, 0); color: white;}

.SKU-651-035-1{background: #FF964F; color: white;}

.SKU-651-341-1{background: rgb(242, 98, 65); color: white;}

.SKU-651-404-1{background: rgb(65, 39, 115); color: white;}

.SKU-651-040-1{background: rgb(93, 44, 104); color: white;}

.SKU-651-043-1{background: rgb(119, 94, 160); color: white;}

.SKU-651-042-1{background: rgb(184, 147, 188); color: white;}

.SKU-651-041-1{background: rgb(194, 43, 107); color: white;}

.SKU-651-045-1{background: rgb(237, 132, 182); color: white;}

.SKU-651-562-1{background: rgb(19, 30, 58); color: white;}

.SKU-651-518-1{background: rgb(19, 19, 62); color: white;}

.SKU-651-050-1{background: rgb(27, 46, 93); color: white;}

.SKU-651-065-1{background: rgb(18, 34, 108); color: white;}

.SKU-651-049-1{background: rgb(21, 42, 120); color: white;}

.SKU-651-086-1{background: rgb(25, 48, 171); color: white;}

.SKU-651-067-1{background: rgb(0, 58, 121); color: white;}

.SKU-651-057-1{background: rgb(0, 64, 140); color: white;}

.SKU-651-051-1{background: rgb(0, 70, 132); color: white;;}

.SKU-651-098-1{background: rgb(0, 80, 162); color: white;}

.SKU-651-052-1{background: rgb(0, 93, 171); color: white;}

.SKU-651-084-1{background: rgb(0, 117, 187); color: white;}

.SKU-651-053-1{background: rgb(0, 137, 195); color: white;}

.SKU-651-056-1{background: rgb(61, 161, 210); color: white;}

.SKU-651-066-1{background: rgb(0, 129, 140); color: white;}

.SKU-651-054-1{background: rgb(0, 155, 151); color: white;}

.SKU-651-055-1{background: rgb(95, 205, 183); color: white;}

.SKU-651-060-1{background: rgb(0, 64, 40); color: white;}

.SKU-651-613-1{background: rgb(0, 82, 54); color: white;}

.SKU-651-061-1{background: rgb(0, 120, 75); color: white;}

.SKU-651-068-1{background: rgb(0, 122, 66); color: white;}

.SKU-651-062-1{background: rgb(0, 135, 60); color: white;}

.SKU-651-064-1{background: rgb(40, 153, 1); color: white;}

.SKU-651-063-1{background: rgb(106, 167, 45); color: white;}

.SKU-651-080-1{background: rgb(67, 47, 30); color: white;}

.SKU-651-083-1{background: rgb(175, 89, 31); color: white;}

.SKU-651-081-1{background: rgb(168, 136, 92); color: white;}

.SKU-651-082-1{background: rgb(206, 192, 159); color: white;}

.SKU-651-023-1{background: rgb(235, 212, 148); color: white;}

.SKU-651-070-1{background: rgb(13, 14, 17); color: white;}

.SKU-651-070M-1{background: rgb(13, 14, 17); color: white;}

.SKU-651-073-1{background: rgb(75, 76, 76); color: white;}

.SKU-651-071-1{background: rgb(117, 125, 124); color: white;}

.SKU-651-076-1{background: rgb(129, 134, 137); color: white;}

.SKU-651-074-1{background: rgb(138, 143, 139); color: white;}

.SKU-651-072-1{background: rgb(191, 194, 192); color: white;}

.SKU-651-090-1{background: rgb(104, 106, 109); color: white;}
.SKU-651-091-1{background: rgb(117, 98, 50); color: white;}
.SKU-651-092-1{background: rgb(107, 65, 29); color: white;}
.SKU-651-824-1{background: rgb(210, 151, 47); color: white;}
#SKU-1423-UOM-1{background: white;border: 1px solid gray;  }
 
#SKU-1400-UOM-1{background: black;color:white; }

#SKU-1407-UOM-1{ background: #ffd401; } 
 
#SKU-1408-UOM-1{background: #fff800;} 

#SKU-1435-UOM-1{background: #fec200;} 

#SKU-1341-UOM-1{background: #000;color:white;} 

#SKU-1403-UOM-1{background: #5f050f;color: white;} 
 
#SKU-1404-UOM-1{background: #d9191a;color: white;} 
   
#SKU-1406-UOM-1{background: #ee5d13;} 
  
#SKU-1417-UOM-1{background: #400c60;color: white;} 
  
#SKU-1416-UOM-1{background: #f982b8;} 
  
#SKU-1420-UOM-1{background: #0b1e60;color: white;} 
  
#SKU-1412-UOM-1{background: #081028;color: white;} 
  
#SKU-1458-UOM-1{background: #163882;color: white;}
  
#SKU-1421-UOM-1{background: #258cd9;} 

#SKU-640-UOM-1{background: #60b4f3;} 

#SKU-1415-UOM-1{background: #4b959e;} 

#SKU-1409-UOM-1{background: #1e9659;color:white;} 
  
#SKU-1414-UOM-1{background: #2add2a;} 
  
#SKU-1624-UOM-1{background: #0f4c2c;color:white;} 

#SKU-1450-UOM-1{background: #301f15;color:white;} 
  
#SKU-1451-UOM-1{background: #9b851b;color:white;} 

#SKU-1424-UOM-1{background: #929393;color:white;}
  
#SKU-1455-UOM-1{background: #babdbf;} 





#SKU-1614-UOM-1{background:black;color:white;}
.SKU-1614-UOM-1{background:black;color:white;}
#SKU-1613-UOM-1{background: white;border: 1px solid gray;color:black;}
.SKU-1613-UOM-1{background: white;border: 1px solid gray;color:black;}
#SKU-1615-UOM-1{background: #fff800;border: 1px solid gray;color:black;}
.SKU-1615-UOM-1{background: #fff800;border: 1px solid gray;color:black;}
#SKU-1616-UOM-1{background: #ee5d13;color:black;}
.SKU-1616-UOM-1{background: #ee5d13;color:black;}
#SKU-1604-UOM-1{background: #d41f18;color:white;}
.SKU-1604-UOM-1{background: #d41f18;color:white;}
#SKU-1605-UOM-1{background: #5f040e;color:white;}
.SKU-1605-UOM-1{background: #5f040e;color:white;}
#SKU-1620-UOM-1{background: #370d54;color:white;}
.SKU-1620-UOM-1{background: #370d54;color:white;}
#SKU-1622-UOM-1{background: #0c2979;color:white;}
.SKU-1622-UOM-1{background: #0c2979;color:white;}
#SKU-1621-UOM-1{background: #657dc5;color:white;}
.SKU-1621-UOM-1{background: #657dc5;color:white;}
#SKU-1623-UOM-1{background: #199d5c;color:white;}
.SKU-1623-UOM-1{background: #199d5c;color:white;}
#SKU-1624-UOM-1{background: #2a5b2d;color:white;}
.SKU-1624-UOM-1{background: #2a5b2d;color:white;}
#SKU-1612-UOM-1{background: #301f15;color:white;}
.SKU-1612-UOM-1{background: #301f15;color:white;}
#SKU-1606-UOM-1{background: #c31f5e;color:white;}
.SKU-1606-UOM-1{background: #c31f5e;color:white;}
#SKU-1666-UOM-1{background: #331800;color:white;}
.SKU-1666-UOM-1{background: #331800;color:white;}


#SKU-14241-chrome-1{background: rgb(114,113,113);background: linear-gradient(180deg, rgba(114,113,113,1) 0%, rgba(145,145,145,1) 20%, rgba(255,255,255,1) 37%, rgba(255,255,255,1) 50%, rgba(136,136,136,1) 79%, rgba(92,92,92,1) 100%);color:black;}
.SKU-14241-chrome-1{background: rgb(114,113,113);background: linear-gradient(180deg, rgba(114,113,113,1) 0%, rgba(145,145,145,1) 20%, rgba(255,255,255,1) 37%, rgba(255,255,255,1) 50%, rgba(136,136,136,1) 79%, rgba(92,92,92,1) 100%);color:black;}
#SKU-14241-brushed-chrome-30{background: rgb(175,177,177);background: linear-gradient(0deg, rgba(175,177,177,1) 0%, rgba(255,255,255,1) 80%, rgba(245,245,245,1) 100%);color:black;}
.SKU-14241-brushed-chrome-30{background: rgb(175,177,177);background: linear-gradient(0deg, rgba(175,177,177,1) 0%, rgba(255,255,255,1) 80%, rgba(245,245,245,1) 100%);color:black;}
#SKU-14241-diamond-plate{background: url("/cdn/shop/files/diamond_100x100.png?v=1575988463") no-repeat;background-size: 100px 100px;}
.SKU-14241-diamond-plate{background: url("/cdn/shop/files/diamond.png?v=1575988463") no-repeat;background-size: 300px 300px;}
#SKU-14245-florentine-gold{ background: url("/cdn/shop/files/flor_100x100.png?v=1575988072") no-repeat;background-size: 100px 100px;}
.SKU-14245-florentine-gold{background: url("/cdn/shop/files/flor.png?v=1575988072") no-repeat;background-size: 300px 300px;}

#SKU-14245-hammered-gold-leaf{ background: url("/cdn/shop/files/gold_hammer_100x100.png?v=1575989040.png?v=1575988072") no-repeat;background-size: 100px 100px;}
.SKU-14245-hammered-gold-leaf{background: url("/cdn/shop/files/gold_hammer.png?v=1575989040") no-repeat;background-size: 300px 300px;}
#SKU-14245-engine-turn-1{background: url("/cdn/shop/files/engine-turn_100x100.png?v=1575989339") no-repeat;background-size: 100px 100px;}
.SKU-14245-engine-turn-1{background: url("/cdn/shop/files/engine-turn.png?v=1575989339") center ;background-size: 300px 300px;}

#SKU-29241-fluorescent-green{background: rgb(83,251,63);background: radial-gradient(circle, rgba(83,251,63,1) 0%, rgba(126,254,40,1) 100%);}
.SKU-29241-fluorescent-green{background: rgb(83,251,63);background: radial-gradient(circle, rgba(83,251,63,1) 0%, rgba(126,254,40,1) 100%);}

#SKU-29241-fluorescent-orange{ background: rgb(251,167,63);background: radial-gradient(circle, rgba(251,167,63,1) 0%, rgba(247,82,3,1) 100%); }
.SKU-29241-fluorescent-orange{ background: rgb(251,167,63);background: radial-gradient(circle, rgba(251,167,63,1) 0%, rgba(247,82,3,1) 100%); }

#SKU-29241-fluorescent-pink{ background: rgb(251,63,218);background: radial-gradient(circle, rgba(251,63,218,1) 0%, rgba(232,40,141,1) 100%);}
.SKU-29241-fluorescent-pink{ background: rgb(251,63,218);background: radial-gradient(circle, rgba(251,63,218,1) 0%, rgba(232,40,141,1) 100%);}

#SKU-29241-fluorescent-red{ background: rgb(251,63,89);background: radial-gradient(circle, rgba(251,63,89,1) 0%, rgba(240,21,15,1) 100%); }
.SKU-29241-fluorescent-red{ background: rgb(251,63,89);background: radial-gradient(circle, rgba(251,63,89,1) 0%, rgba(240,21,15,1) 100%); }

#SKU-29241-fluorescent-yellow{ background: rgb(242,250,113);
background: radial-gradient(circle, rgba(242,250,113,1) 0%, rgba(222,250,7,1) 100%); }

.SKU-29241-fluorescent-yellow{ background: rgb(242,250,113);
background: radial-gradient(circle, rgba(242,250,113,1) 0%, rgba(222,250,7,1) 100%); }

#SKU-390-1{ background: rgb(0,0,0);background: linear-gradient(90deg, rgba(0,0,0,1) 17%, rgba(241,192,13,1) 50%, rgba(0,0,0,1) 83%); }
.SKU-390-1{ background: rgb(0,0,0);background: linear-gradient(90deg, rgba(0,0,0,1) 17%, rgba(241,192,13,1) 50%, rgba(0,0,0,1) 83%); }

#SKU-1652-1{background: rgb(12,65,113);
background: linear-gradient(90deg, rgba(12,65,113,1) 6%, rgba(137,174,211,1) 50%, rgba(12,65,113,1) 91%);}
.SKU-1652-1{background: rgb(12,65,113);
background: linear-gradient(90deg, rgba(12,65,113,1) 6%, rgba(137,174,211,1) 50%, rgba(12,65,113,1) 91%);}

#SKU-48010W-1{background: rgb(133,67,9);
background: linear-gradient(90deg, rgba(133,67,9,1) 7%, rgba(218,120,0,1) 50%, rgba(133,67,9,1) 87%);}
.SKU-48010W-1{background: rgb(133,67,9);
background: linear-gradient(90deg, rgba(133,67,9,1) 7%, rgba(218,120,0,1) 50%, rgba(133,67,9,1) 87%);}

#SKU-1651-1{background: rgb(232,28,29);
background: linear-gradient(90deg, rgba(232,28,29,1) 7%, rgba(245,150,47,1) 50%, rgba(232,28,29,1) 87%);}
.SKU-1651-1{background: rgb(232,28,29);
background: linear-gradient(90deg, rgba(232,28,29,1) 7%, rgba(245,150,47,1) 50%, rgba(232,28,29,1) 87%);}

#SKU-46241604-1{background: rgb(215,137,39);
background: linear-gradient(90deg, rgba(215,137,39,1) 7%, rgba(247,190,12,1) 50%, rgba(215,137,39,1) 87%);}
.SKU-46241604-1{background: rgb(215,137,39);
background: linear-gradient(90deg, rgba(215,137,39,1) 7%, rgba(247,190,12,1) 50%, rgba(215,137,39,1) 87%);}

#SKU-1650-1{background: rgb(225,222,219);
background: linear-gradient(90deg, rgba(225,222,219,1) 7%, rgba(255,255,255,1) 50%, rgba(225,222,219,1) 87%);}
.SKU-1650-1{background: rgb(225,222,219);
background: linear-gradient(90deg, rgba(225,222,219,1) 7%, rgba(255,255,255,1) 50%, rgba(225,222,219,1) 87%);}

#SKU-37241-1{background: rgb(237,234,233);
background: radial-gradient(circle, rgba(237,234,233,1) 0%, rgba(167,165,164,1) 100%);}
.SKU-37241-1{background: rgb(237,234,233);
background: radial-gradient(circle, rgba(237,234,233,1) 0%, rgba(167,165,164,1) 100%);}

#SKU-38241{background: rgb(237,234,233);
background: radial-gradient(circle, rgba(237,234,233,1) 0%, rgba(167,165,164,1) 100%);}
.SKU-38241{background: rgb(237,234,233);
background: radial-gradient(circle, rgba(237,234,233,1) 0%, rgba(167,165,164,1) 100%);}


#SKU-1696-1{background: rgb(181,26,24);
background: linear-gradient(110deg, rgba(181,26,24,.25) 0%, rgba(195,77,29,.25) 11%, rgba(233,235,42,.25) 22%, 
  rgba(174,237,48,.25) 30%, rgba(95,209,54,.25) 39%, rgba(46,235,18,.25) 53%, rgba(40,43,188,.25) 63%, 
  rgba(108,18,235,.25) 76%, rgba(220,23,187,.25) 90%, rgba(181,26,24,.25) 100%);}
.SKU-1696-1{background: rgb(181,26,24);
background: linear-gradient(110deg, rgba(181,26,24,.25) 0%, rgba(195,77,29,.25) 11%, rgba(233,235,42,.25) 22%, 
  rgba(174,237,48,.25) 30%, rgba(95,209,54,.25) 39%, rgba(46,235,18,.25) 53%, rgba(40,43,188,.25) 63%, 
  rgba(108,18,235,.25) 76%, rgba(220,23,187,.25) 90%, rgba(181,26,24,.25) 100%);}
#SKU-1710-1{ background: url("/cdn/shop/files/blackbling.png?v=1576260169") 
  no-repeat;background-size: 100px 100px;}
.SKU-1710-1{ background: url("/cdn/shop/files/blackbling.png?v=1576260169") 
  no-repeat;background-size: 300px 300px;}



#SKU-1694-1{ background: url("/cdn/shop/files/pinkbling.png?v=1576260677");background-size: 100px 100px;}


.SKU-1694-1{ background: url("/cdn/shop/files/pinkbling.png?v=1576260677");}


#SKU-1690-1{ background: url("/cdn/shop/files/gold.png?v=1576260965");background-size: 100px 100px;}
.SKU-1690-1{ background: url("/cdn/shop/files/gold.png?v=1576260965");}
#SKU-1692-1{ background: url("/cdn/shop/files/redbling.png?v=1576261232");background-size: 100px 100px;}
.SKU-1692-1{ background: url("/cdn/shop/files/redbling.png?v=1576261232");}
#SKU-1693-1{ background: url("/cdn/shop/files/bluebling.png?v=1576261403");background-size: 100px 100px;}
.SKU-1693-1{ background: url("/cdn/shop/files/bluebling.png?v=1576261403");}
#SKU-1691-1{ background: url("/cdn/shop/files/sliverbling.png?v=1576261232");background-size: 100px 100px;}
.SKU-1691-1{ background: url("/cdn/shop/files/sliverbling.png?v=1576261232");}
#SKU-1698-1{background: rgb(242,250,113);background: radial-gradient(circle, rgba(242,250,113,1) 0%, rgba(222,250,7,1) 100%); }
.SKU-1698-1{background: rgb(242,250,113);background: radial-gradient(circle, rgba(242,250,113,1) 0%, rgba(222,250,7,1) 100%); }
#SKU-1676-1 {background: rgb(83,251,63);background: radial-gradient(circle, rgba(83,251,63,1) 0%, rgba(126,254,40,1) 100%);}
.SKU-1676-1 {background: rgb(83,251,63);background: radial-gradient(circle, rgba(83,251,63,1) 0%, rgba(126,254,40,1) 100%);}

#SKU-1679-1 {background: rgb(251,167,63);background: radial-gradient(circle, rgba(251,167,63,1) 0%, rgba(247,82,3,1) 100%);}
.SKU-1679-1 {background: rgb(251,167,63);background: radial-gradient(circle, rgba(251,167,63,1) 0%, rgba(247,82,3,1) 100%);}

#SKU-1677-1 {background: rgb(251,63,218);background: radial-gradient(circle, rgba(251,63,218,1) 0%, rgba(232,40,141,1) 100%);}
.SKU-1677-1 {background: rgb(251,63,218);background: radial-gradient(circle, rgba(251,63,218,1) 0%, rgba(232,40,141,1) 100%);}

#SKU-1670-1{background: white;border: 1px solid gray; }
.SKU-1670-1{background: white;border: 1px solid gray; }
#SKU-1684-1{background:black;}
.SKU-1684-1{background:black;}
#SKU-1672-1{background: rgb(254, 197, 0);}
.SKU-1672-1{background: rgb(254, 197, 0);}
#SKU-1682-1{background: red;}
.SKU-1682-1{background:red;}
#SKU-1678-1{background: rgb(223, 74, 6);}
.SKU-1678-1{background:rgb(223, 74, 6);}
#SKU-1688-1{background: #27112e;}
.SKU-1688-1{background:#27112e;}



#SKU-1683-1{background:#bbbab8;}
.SKU-1683-1{background:#bbbab8;}
#SKU-1674-1{background:#2a5b2c;}
.SKU-1674-1{background:#2a5b2c;}

#SKU-1673-1{background:#010b40;}
.SKU-1673-1{background:#010b40;}


#SKU-1685-1{background:#54caf0;}
.SKU-1685-1{background:#54caf0;}

#SKU-1686-1{background:#1e9198;}
.SKU-1686-1{background:#1e9198;}

#SKU-1687-1{background: rgb(167,165,164);
background: linear-gradient(75deg, rgba(167,165,164,1) 0%, rgba(213,212,212,1) 52%, rgba(167,165,164,1) 100%);}
.SKU-1687-1{background: rgb(167,165,164);
background: linear-gradient(75deg, rgba(167,165,164,1) 0%, rgba(213,212,212,1) 52%, rgba(167,165,164,1) 100%);}


#SKU-1675-1{background: rgb(147,119,12);
background: linear-gradient(75deg, rgba(147,119,12,1) 16%, rgba(209,195,155,1) 52%, rgba(147,119,12,1) 79%);}
.SKU-1675-1{background: rgb(147,119,12);
background: linear-gradient(75deg, rgba(147,119,12,1) 0%, rgba(251,233,184,1) 52%, rgba(147,119,12,1) 100%);}


#SKU-359-1{background: rgb(181,26,24);
background: linear-gradient(110deg, rgba(181,26,24,.25) 0%, rgba(195,77,29,.25) 11%, rgba(233,235,42,.25) 22%, 
  rgba(174,237,48,.25) 30%, rgba(95,209,54,.25) 39%, rgba(46,235,18,.25) 53%, rgba(40,43,188,.25) 63%, 
  rgba(108,18,235,.25) 76%, rgba(220,23,187,.25) 90%, rgba(181,26,24,.25) 100%);}
.SKU-359-1{background: rgb(181,26,24);
background: linear-gradient(110deg, rgba(181,26,24,.25) 0%, rgba(195,77,29,.25) 11%, rgba(233,235,42,.25) 22%, 
  rgba(174,237,48,.25) 30%, rgba(95,209,54,.25) 39%, rgba(46,235,18,.25) 53%, rgba(40,43,188,.25) 63%, 
  rgba(108,18,235,.25) 76%, rgba(220,23,187,.25) 90%, rgba(181,26,24,.25) 100%);}

#SKU-363-1{background: rgb(181,26,24);
background: linear-gradient(110deg, rgba(181,26,24,.25) 0%, rgba(195,77,29,.25) 11%, rgba(233,235,42,.25) 22%, 
  rgba(174,237,48,.25) 30%, rgba(95,209,54,.25) 39%, rgba(46,235,18,.25) 53%, rgba(40,43,188,.25) 63%, 
  rgba(108,18,235,.25) 76%, rgba(220,23,187,.25) 90%, rgba(181,26,24,.25) 100%);}
.SKU-363-1{background: rgb(181,26,24);
background: linear-gradient(110deg, rgba(181,26,24,.25) 0%, rgba(195,77,29,.25) 11%, rgba(233,235,42,.25) 22%, 
  rgba(174,237,48,.25) 30%, rgba(95,209,54,.25) 39%, rgba(46,235,18,.25) 53%, rgba(40,43,188,.25) 63%, 
  rgba(108,18,235,.25) 76%, rgba(220,23,187,.25) 90%, rgba(181,26,24,.25) 100%);}


#SKU-364-1{background:#d57392;}
.SKU-364-1{background:#d57392;}
.truecut-logo-top{ 
  font-size:16px;
  background:white; 
  margin-bottom:0px;
  padding:0px;
  float:left;
}
.truecut-logo-top-right{
  font-weight:700;
  paddong:0px; 
  margin-bottom:0px;
  font-size:16px;
margin-left:0px;
  -webkit-text-fill-color: #60b4f3; /* Will override color (regardless of order) */
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: black;
}
.truecut-logo-bottom{font-size:6.5px;color:white;background:black;
  margin-top:0px;padding:2px;padding-left:9px;padding-right:9px;border-radius:5px;float: left;}

.description-true{font-weight:bold; list-style:disc;padding: 10px;}

.description-oracal{font-weight:bold; list-style:disc;padding: 10px;font-size: 14px; margin-bottom: 0px;margin-top:0px;}

@media (min-width: 100px) and (max-width:400px){
  .description-true{font-weight:bold; list-style:disc;padding: 10px; font-size: 12px;}
  .description-true a{color:blue;}
  .description-oracal {font-weight:bold; list-style:disc;padding: 10px; font-size: 12px;}
  
}







#overlayscreen2{  position: absolute;
  display: none;
   background: rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}
#text2{
  position: absolute;
  top: 30%;
  left: 50%;
  font-size: 50px;
  color: black;
  transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
}
#overlayscreen3{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}

#overlayscreen4{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}


#overlayscreen5{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}

#overlayscreen6{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}

#overlayscreen7{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}


#overlayscreen8{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}

#overlayscreen9{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}

#overlayscreen10{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}

#overlayscreen11{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}


#overlayscreen12{  position: absolute;
  display: none;
   background:  rgba(255,255,255,.75);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}

#cover {
    background: url("/cdn/shop/files/37.gif?v=1580129279") no-repeat scroll center center rgba(255,255,255,.5);
    position: absolute;
    height: 150%;
    width: 100%;
  z-index:1;
}




.infobtn{ border: 2px solid black; 
  background-color: white;
  color: black;
  padding: 7px 14px;
  font-size: 12px;
  font-weight: bold;
  border-radius:10px;
  cursor: help;
 margin-bottom:10px;
  width:160px;



}



.instruction-btn {
  border-color: #003e89;
  color: #003e89;margin-bottom:10px;
}

.instruction-btn:hover {
  background: #003e89;
  color: white;
}



ul#variants.desktop-ul-1{margin-bottom:0px;}
li.desktop-li-1{margin-bottom:0px;height: 100px;}


.logoutbtn{color:white;}
  

.logo-bar{ 
  height:100px;
  padding-top:10px;
  display: block; 
  width:100%; 
  font-family: 'Rubik', sans-serif;/*================ for nav toggle only all other roboto ================*/
 
}  

    
.logo-link-container{ 
  width:20%; 
  float:left;
  height:100px;
  text-align:left;
  padding-top:5px;
   
}
  
.search-bar-container { 
  width:30%; 
  float:left;
  height:100px;
  text-align:center;
  padding-top:0px;
 
}



.cart-container{ 
  float:left;
  height:100px;
  text-align:center;
  padding-top:20px;

}
  

  
 
div.dropdown-menu{
 min-width: 100%; /* Set width of the dropdown */
 background: white;
 display: none;
 position: absolute;
 z-index: 999;
 left: 0;
 margin-top:0px;
 padding-bottom:60px;
  }
  
a.sublink span.sublinks-a {
  line-height:1.2;
  padding:20px;
  text-decoration:none !important;
}

span.sublinks-a {
  font-size:18px;
  color:black;
  padding-bottom:10px;

  line-height:1.75;
}
  
span.sublinks-a:hover {
    font-size:18px;
    color: red;
    font-weight:bold;
text-decoration-color: red;
  }
  
.sidenav {
  font-family: 'Roboto Condensed', sans-serif;
  height:100%;
  width: 0;
  position: absolute;
  z-index:2;
  top: 0;
  left: 0;
  background-color: #003E89;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;

}

.sidenav a {
  
}

 
  .dropdown-btn:hover{
   color: white;
    background:#003E89;
    
}
.nav-stick{
  position:fixed; 
  top:2%; 
  left:0%; 
  background:none;
}


.sidenav .closebtndrop {
  position: absolute;
  top: 0;
  left: 15px;
  font-size: 36px;
  margin-left: 20px;
  color:#003E89;

  border:none;

}
.sidenav .closebtndrop:hover {
background: white;
  color:#003E89;



}
  
 
.dropdown-btn {
  font-family: 'Roboto Condensed', sans-serif; 
  background:white;

  padding: 8px 8px 8px 20px;
  text-decoration: none;
  font-size: 25px;
  color: #003E89;
  display: block;
  transition: 0.3s;
  display: block;

  width: 100%;
  text-align: left;
  cursor: pointer;
  outline: none;
  border:none;
 
}

/* On mouse-over */

.sidenav-link-secion{ 
 background:white;
 margin:1px;
 padding: 8px 8px 8px 20px;
 text-decoration: none;
 font-size: 25px;
 color: #003E89;
 display: block;
 transition: 0.3s;
 border:none;
 display: block;
 width: 100%;
 text-align: left;
 cursor: pointer;
 outline: none;
   border:none;
}
  

#main {
  transition: margin-left .5s;
   
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
  
/* Add an active class to the active dropdown button */
.active {
  background-color: white;
  color: #003E89;
  font-weight:bold;
  transition: 0.3s;
}
  .active:hover {
  color: #003E89;
}

/* Dropdown container (hidden by default). Optional: add a lighter background color and some left padding to change the design of the dropdown content */

  


  
.brss-hover-links:hover{
  background-color: #003E89;

  }




  
.brss-btn{
  width:80%;
  padding:5px;
  background-color: white; 
  color:#003E89;
  font-family: 'Roboto Condensed', sans-serif;
  border:1px solid #003E89;
 
  }
  
.brss-btn:hover{
  width:80%;
  padding:5px;
  background-color: white; 
  color:#003E89;
  font-weight:bold;
  font-family: 'Roboto Condensed', sans-serif;
  border:3px solid #003E89; 
  }
  
.dropdown {
    height: 50px;
  }
    
a.brss-a{
    color:white; 
    font-family: 'Roboto Condensed', sans-serif;
    display:inline-block;
    line-height: 2.5;
  }

.dropdown-container {
  display: none;
  padding-left: 0px;
  color: #003E89;
}
  

.dropdown-container2 {
  width:100%;
  display: none;
  background-color:#F5F5F5;
  padding-left: 40px;
  float:right;
  color: #003E89;
  border:none;

 
  
}

/* Style the sidenav links and the dropdown button */


  
.left-icon{

  padding-right:5px;
}

.square,.square2,
.square3,.square4,
.square5,.square6,
.square7, .square8,
.square9, .square10 {
 float:right;
 padding-right:15px;
  
}
  
.toggle-down {
  transform: rotate(0deg);
}


.toggle-up {
  transform: rotate(180deg);
}

   
.nav {
  display: flex;
  justify-content: center;
  background-color: #003E89;  
  height:50px;
  width:100%;
  
}
  
.drop {
  font-weight: bold;
  background-color: red; 
  height:50px;
}   
  
  
body { 
  margin: 0; 
} /* trick from css-tricks comments */

/* FIRST LEVEL */



a.sub-link-b{
  margin-top:0px;
  margin-bottom:0px;
  line-height:1;
  padding:0px;
  
  padding-left:40px;
}





.link-button{  
  width:100px;
  height:50px;
  background-color: orange;
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 18px;
  text-align:center;
  cursor:pointer;
  margin-bottom:0px;
  color:white;
}
  
     
.sub-header-style-h3{
  margin-bottom:0px;
  font-size:17px;
  font-family: 'Roboto Condensed', sans-serif;
  color:blue;
  text-align:left;
  text-transform: uppercase;
  font-weight:bold;
}
  



 * {

  font-family: 'Roboto Condensed', sans-serif;
}


  
.dropbtn0, .dropbtn2, .dropbutton1a,.dropbutton1b,
.dropbtn3, .dropbtn4, 
.dropbtn5, .dropbtn6, 
.dropbtn7, .dropbtn8, 
.dropbtn9, .dropbtn10{
 width:100%;  
} 
  

div.navbar.justify-content-center{padding: 0px 40px 0px 15px;}







.navbar {
  x-overflow: hidden;
  font-family: Arial, Helvetica, sans-serif;
  display: flex;
  justify-content: center;
  background-color: black;  
  height:auto;
  margin-top:0px; 
  width:100%;
  padding:0px;
  flex-wrap: nowrap !important;

}

div.dropdown1{
 
  text-align:center;
}

div.dropdown1a{
 
  text-align:center;
}



  
.dropdown,.dropdown1a,.dropdown1b,.dropdown2,
.dropdown3,.dropdown4,
.dropdown5,.dropdown6,
.dropdown7,.dropdown8,
.dropdown9, .dropbtn10{
  float: left;
  overflow: hidden; 

} 



.dropdown1:hover,.dropdown1a:hover,.dropdown1b:hover,.dropdown2:hover,
.dropdown3:hover,.dropdown4:hover, 
.dropdown5:hover,.dropdown6:hover,
.dropdown7:hover,.dropdown8:hover, 
.dropdown9:hover{
  background-color: #d6eaf5;
  border-radius: 0px;
  color:#000 !important;
}


.dropbtn0:hover{
  background-color: #d6eaf; border-radius: 0px;color:#fff;
}
.dropbtn1a:hover{
  background-color:  #d6eaf; border-radius:0px;color:#fff;
}

.dropdown1:hover .dropbtn0, .dropdown1a:hover .dropbtn1a, .dropdown1b:hover .dropbtn1b, .dropdown2:hover .dropbtn2, .dropdown3:hover .dropbtn3, .dropdown4:hover .dropbtn4, .dropdown5:hover .dropbtn5, .dropdown6:hover .dropbtn6, .dropdown7:hover .dropbtn7, .dropdown8:hover .dropbtn8, .dropdown9:hover .dropbtn9
{
color:#000;
  
}

.dropdown7a:hover{background-color: black;}
.dropdown-content1, .dropdown-content1a,.dropdown-content1b,.dropdown-content2,
.dropdown-content3,.dropdown-content4,
.dropdown-content5,.dropdown-content6, 
.dropdown-content7, .dropdown-content8, 
.dropdown-content9{
  /* hides sub-menu */
    visibility: hidden;
    transition: all 0.1s ease-in.1s;
  	position: absolute;
   	background-color: 	#FFFAFA;
  	width: 100%;
  	left: 0;
  	z-index:1;
  	padding-bottom:30px;
  	text-align:left;
}
.dropdown-content7 {
  	padding-bottom: 0px;
}


.dropdown-content1 .header,.dropdown-content1a .header ,.dropdown-content1b .header ,  .dropdown-content2 .header,
  .dropdown-content3 .header, .dropdown-content4 .header,
  .dropdown-content5 .header, .dropdown-content6 .header,
  .dropdown-content7 .header, .dropdown-content8 .header,
  .dropdown-content9 .header{
  padding-top:10px;
    background: #003E89;
  color: white;
 
   text-align:center;
    padding-bottom:2px;

  font-weight:bold;



    font-family: 'Roboto Condensed', sans-serif;
}
    
 

 


.header h2{font-size:17px;font-family: 'Roboto Condensed', sans-serif;}





.dropdown1:hover .dropdown-content1,
.dropdown1a:hover .dropdown-content1a,
.dropdown1b:hover .dropdown-content1b,
.dropdown2:hover .dropdown-content2,
.dropdown3:hover .dropdown-content3,
.dropdown4:hover .dropdown-content4,
.dropdown5:hover .dropdown-content5,
.dropdown6:hover .dropdown-content6,
.dropdown7:hover .dropdown-content7,
.dropdown8:hover .dropdown-content8,
.dropdown9:hover .dropdown-content9   
{
   visibility: visible;  /* shows sub-menu */ 
   background-color: white;
   z-index: 10;
}

h3.sub-header-style-h3.top_space {
    padding-top: 30px;
}


/******** BANNER SUPPLIES DROPDOW STAT____************** */

.hover-menu-drop-banner-wrap{
  width:80%;
   margin:0 auto;
  padding:10px;
}
.hover-menu-drop-banner-column{
width:20%;
float:left; 
  padding-left:10px;
}

span.sublinks-a {
  font-size:16px;
  color:black;padding-bottom:10px;
 line-height:1.75;
}
  
span.sublinks-a:hover {
    font-size:16px !important;
    color: red;
    font-weight:bold;
 
  } 




 @media (min-width: 800px) and (max-width:  1000px) {
   
 .hover-menu-drop-banner-wrap{
  width:90%;
   margin:0 auto;
  padding:10px;
}
.hover-menu-drop-banner-column{
width:20%;
float:left; 
  padding-left:10px;
}  
   
span.sublinks-a {
  font-size:16px;
  color:black;padding-bottom:10px;
  line-height:1.2;
}
  
span.sublinks-a:hover {
    font-size:16px;
    color: red;
    font-weight:bold;
  }   
   
   

 }


/******** END BANNER SUPPLIES DROPDOW STAT____************** */







.sub-header-style-h4{
  margin-bottom:0px;
  font-size:16px;
  color:#003E89;
  text-align:left;
  font-family: 'Roboto Condensed', sans-serif;
}

.see-more{ 
  background-color: #003E89;
  color:white;
  border:none;
  padding:5px;
  width:150px;
  margin-top:10px;
  font-family: 'Roboto Condensed', sans-serif;
}








.hover-menu-drop-6{
  width:25%;
  float:left; 
  padding-left:10px;
}
  
.hover-menu-wrap-6{
  width:75%;
  margin:0 auto;
  padding:10px;
}


.hover-menu-wrap-3{
 width:80%;
  margin:0 auto;
padding:15px; float:left; 

}


.hover-menu-drop-3{
  width:31%;
  padding:15px; 
  float:left; 
}



.hover-menu-drop-3-title{width:100%; float:left; text-align:center;}

.hover-menu-subwrap-3{width:100%; float:left; margin:0 auto;}
p.hover-menu-details-3{width:100%;  float:left; padding:10px; text-align:center;font-size:16px;}



.hover-menu-wrap-print{width:90%;margin:0 auto;padding:20px;}
.hover-menu-subwrap-print-left{width:60%;margin:0 auto;padding:20px;float:left;}

.print-service-category-box{width:22%;float:left; margin-right:10px;}
.print-service-category-box-wrapper{width:100%; float:left;}

.print-category-img{width:100%;margin:0 auto;}


.see-more-print{ 
  background-color: #003E89;
  color:white;
  border:none;
  padding:5px;
  width:90%;
  margin-top:10px;
  font-family: 'Roboto Condensed', sans-serif;
}
.see-more{ 
  background-color: #003E89;
  color:white;
  border:none;
  padding:5px;
  width:150px;
  margin-top:10px;
  font-family: 'Roboto Condensed', sans-serif;
}


span.sublinks-a-print {
  font-size:16px;
  color:#2B3856;
  padding-left:15px;
}





 @media (min-width: 900px) and (max-width:  1355px) {
     .see-more-print{
       width:90%;
       font-size:14px;
}
     
   
  
   .hover-menu-subwrap-print-left{width:60%;margin:0 auto;padding:10px;float:left;}
   
     .print-service-category-box{width:22%;float:left;}
   
    }


 @media (min-width: 200px) and (max-width:  500px) {
      span.sublinks-a {

  color: red;
}
      
    }
  
  
  
  @media (min-width: 501px) and (max-width:  700) {
       span.sublinks-a {

  color: green;
}
      
    }
  
  
  @media (min-width: 701px) and (max-width:  898px) {
     span.sublinks-a {

  color: blue;
}
      
    }
  
  
 @media (min-width: 800px) and (max-width:  1079px) { 

.brss-hover-links{min-width:9%;font-size:11px;}
   span.sublinks-a {
     font-size:12px;
     padding-left:0px;
   }
   
    span.sublinks-a:hover {
      font-size:12px;
      padding-left:0px;
    }
   .hover-menu-wrap-6{
     width:100%; 
     padding:10px;
   }
    .responsive-hide{
      display:none;
    }

 }


@media (min-width: 1080px) and (max-width:  1525px) {
 /* drop hover 1 */
    span.sublinks-a {
      font-size:16px;
      padding-left:0px;
    }
     span.sublinks-a:hover {
       font-size:16px;
       padding-left:0px;
     }
  
    .brss-hover-links{
      min-width:9%;
      font-size:12px;
     
    }
     
     .hover-menu-wrap-6{
       width:100%; 
       padding:10px;
     }
     .hover-menu-drop-6 { 
       padding-left:10px;
     }
     
     .responsive-hide{
       display:none;
     }

/* drop hover 2 */ 
     
      .hover-menu-wrap-3{
        width:100%; 
        padding:10px;
        float:left; 
      }
     .hover-menu-drop-3 { 
       padding-left:10px;  
       float:left; 
     }
  
     p.hover-menu-details-3{
       font-size:14px;
       width:80%;  
       float:none;
       margin:0 auto;
     }
     
    }
#sidebar {
    height: 100vh;
    background-color: #003E89;
}

#sidebar .list-group-item {
    border-radius: 0;
    background-color:#F5F5F5;
    color: #003E89;
    border-left: 0;
    border-right: 0;
    border-color: #003E89;
    white-space: nowrap;
    text-decoration: none;
}

/* highlight active menu */
#sidebar .list-group-item:not(.collapsed) {
 
 background-color:#F5F5F5;
    color: #003E89;
}

/* closed state */
#sidebar .list-group .list-group-item[aria-expanded="false"]::after {
  content: " \f0d7";
  font-family: FontAwesome;
  display: inline;
  text-align: right;
  padding-left: 5px;
}

/* open state */
#sidebar .list-group .list-group-item[aria-expanded="true"] {
  background-color: #F5F5F5;
  color:#003E89;
}
#sidebar .list-group .list-group-item[aria-expanded="true"]::after {
  content: " \f0da";
  font-family: FontAwesome;
  display: inline;
  text-align: right;
  padding-left: 5px;
}

/* level 1*/
#sidebar .list-group .collapse .list-group-item  {
  padding-left: 20px;
}

/* level 2*/
#sidebar .list-group .collapse > .collapse .list-group-item {
  padding-left: 30px;
}

/* level 3*/
#sidebar .list-group .collapse > .collapse > .collapse .list-group-item {
  padding-left: 40px;
}

@media (max-width:48em) {
    /* overlay sub levels on small screens */
    #sidebar .list-group .collapse.in, #sidebar .list-group .collapsing {
        position: absolute;
        z-index: 1;
        width: 190px;
    }
    #sidebar .list-group > .list-group-item {
        text-align: center;
        padding: .75rem .5rem;
        min-width: 39px;
    }
    /* hide caret icons of top level when collapsed */
    #sidebar .list-group > .list-group-item[aria-expanded="true"]::after,
    #sidebar .list-group > .list-group-item[aria-expanded="false"]::after {
        display:none;
    }
}

/* change transition animation to width when entire sidebar is toggled */
#sidebar.collapse {
  -webkit-transition-timing-function: ease;
       -o-transition-timing-function: ease;
          transition-timing-function: ease;
  -webkit-transition-duration: .2s;
       -o-transition-duration: .2s;
          transition-duration: .2s;

}

#sidebar.collapsing {
  opacity: 0.8;
  width: 0;
  -webkit-transition-timing-function: ease-in;
       -o-transition-timing-function: ease-in;
          transition-timing-function: ease-in;
  -webkit-transition-property: width;
       -o-transition-property: width;
          transition-property: width;

}





.boldbold{font-weight:bold;}


.input-group-btn .customsearch{border:none;}


.breadcrumb {background: white !important;}



span.sublinks-a {
    font-size: 18px;
    color: black;
    padding-bottom: 10px;
    padding-left: 0px;
    line-height: 1.75;
}




#SKU-577-576-575{background: black; color: white;}

#SKU-516-515{background:#D1AF43;}
#SKU-514-513{background:#BD6120;}
#SKU-572-571{background:#A5A5A5;}
#SKU-512-511{background:#C88B30;}
#SKU-103LPWQ-103LPWP-103LPWHP{border:none; background: url("/cdn/shop/files/Polar.png?v=1634137377");background-size: 50px 50px;}

#SKU-504-503-502{border:none; background: url("/cdn/shop/files/white.png?v=1634137330");background-size: 50px 50px;}

#SKU-522-521{background:#FED995;}
#SKU-524-523{background:#BF8641;}
#SKU-518-517{background:#62281D;}
#SKU-520-519{background:#2D110E;}
#SKU-574-573{background:#ACA698;}
#SKU-536-535{background:#A1BA3A;}
#SKU-538-537{background:#009448;}
#SKU-540-539{background:#00411F;}
#SKU-542-541{background:#042E18;}
#SKU-544-543{background:#55AE78;}
#SKU-546-545{background:#016F70;}
#SKU-548-547{background:#99D3BB;}
#SKU-554-553{background:#22A8C1;}
#SKU-552-551{background:#246F8F;}
#SKU-550-549{background:#004767;}
#SKU-556-555{background:#05225A;}
#SKU-569-570{background:#CA852A;}
#SKU-558-557{background:#0D0E2A;}
#SKU-315-316{background:#721C59;}
#SKU-564-563{background:#C62790;}
#SKU-566-565{background:#8B226D;}
#SKU-526-525{background:#F37F58;}
#SKU-568-567{background:#E86970;}
#SKU-510-509{background:#5F050F;}
#SKU-506-505{background:#CC1F25;}
#SKU-508-507{background:#AD1C21;}
#SKU-501-500{background:#D32526;}
#SKU-528-527{background:#E14924;}
#SKU-570-569{background:#CA852A;}
#SKU-534-533{background:#F89A1C;}
#SKU-532-531{background: url("/cdn/shop/files/yellow2.png?v=1634138187");background-size: 50px 50px;}
#SKU-507-508{background:#AD1C21;}
#SKU-530-529{background: url("/cdn/shop/files/yellow1.png?v=1634138130");background-size: 50px 50px;}
#SKU-103L-PW-Q-P-HP{background: white;border: 1px solid gray;}
 #SKU-570-569{background:#011B3E;}


#SKU-614-609{background:#007B4D;}
#SKU-554-553{background:#22A8C1;}
#SKU-556-555{background:#05225A;}










  .numbersizer {font-size : 12px;}
  
   .numbercolorblack {color: black; }
  
   .numbercolorwhite {color: white; }

#SKU-651-010-1{background: white;border: 1px solid gray;}
#SKU-651-010M-1{background: white;border: 1px solid gray;}
#SKU-651-019-1{background: rgb(230, 167, 0);}

#SKU-651-020-1{background: rgb(251, 170, 0);}

#SKU-651-021-1{background: rgb(254, 197, 0);}

#SKU-651-022-1{background: rgb(242, 202, 0);}

#SKU-651-025-1{background: rgb(242, 226, 16);}

#SKU-651-026-1{background: rgb(94, 5, 14); color: white;}

#SKU-651-312-1{background: rgb(111, 0, 14); color: white;}

#SKU-651-030-1{background: rgb(144, 14, 22); color: white;}

#SKU-651-031-1{background: rgb(176, 0, 13); color: white;}

#SKU-651-032-1{background: rgb(201, 17, 0); color: white;}

#SKU-651-047-1{background: rgb(211, 49, 0); color: white;}

#SKU-651-034-1{background: rgb(223, 74, 6); color: white;}

#SKU-651-036-1{background: rgb(234, 103, 0); color: white;}

#SKU-651-035-1{background: rgb(252, 108, 0); color: white;}

#SKU-651-341-1{background: rgb(242, 98, 65); color: white;}

#SKU-651-404-1{background: rgb(65, 39, 115); color: white;}

#SKU-651-040-1{background: rgb(93, 44, 104); color: white;}

#SKU-651-043-1{background: rgb(119, 94, 160); color: white;}

#SKU-651-042-1{background: rgb(184, 147, 188); color: white;}

#SKU-651-041-1{background: rgb(194, 43, 107); color: white;}

#SKU-651-045-1{background: rgb(237, 132, 182); color: white;}

#SKU-651-562-1{background: rgb(19, 30, 58); color: white;}

#SKU-651-518-1{background: rgb(19, 19, 62); color: white;}

#SKU-651-050-1{background: rgb(27, 46, 93); color: white;}

#SKU-651-065-1{background: rgb(18, 34, 108); color: white;}

#SKU-651-049-1{background: rgb(21, 42, 120); color: white;}

#SKU-651-086-1{background: rgb(25, 48, 171); color: white;}

#SKU-651-067-1{background: rgb(0, 58, 121); color: white;}

#SKU-651-057-1{background: rgb(0, 64, 140); color: white;}

#SKU-651-051-1{background: rgb(0, 70, 132); color: white;;}

#SKU-651-098-1{background: rgb(0, 80, 162); color: white;}

#SKU-651-052-1{background: rgb(0, 93, 171); color: white;}

#SKU-651-084-1{background: rgb(0, 117, 187); color: white;}

#SKU-651-053-1{background: rgb(0, 137, 195); color: white;}

#SKU-651-056-1{background: rgb(61, 161, 210); color: white;}

#SKU-651-066-1{background: rgb(0, 129, 140); color: white;}

#SKU-651-054-1{background: rgb(0, 155, 151); color: white;}

#SKU-651-055-1{background: rgb(95, 205, 183); color: white;}

#SKU-651-060-1{background: rgb(0, 64, 40); color: white;}

#SKU-651-613-1{background: rgb(0, 82, 54); color: white;}

#SKU-651-061-1{background: rgb(0, 120, 75); color: white;}

#SKU-651-068-1{background: rgb(0, 122, 66); color: white;}

#SKU-651-062-1{background: rgb(0, 135, 60); color: white;}

#SKU-651-064-1{background: rgb(40, 153, 1); color: white;}

#SKU-651-063-1{background: rgb(106, 167, 45); color: white;}

#SKU-651-080-1{background: rgb(67, 47, 30); color: white;}

#SKU-651-083-1{background: rgb(175, 89, 31); color: white;}

#SKU-651-081-1{background: rgb(168, 136, 92); color: white;}

#SKU-651-082-1{background: rgb(206, 192, 159); color: white;}

#SKU-651-023-1{background: rgb(235, 212, 148); color: white;}

#SKU-651-070-1{background: rgb(13, 14, 17); color: white;}

#SKU-651-070M-1{background: rgb(13, 14, 17); color: white;}

#SKU-651-073-1{background: rgb(75, 76, 76); color: white;}

#SKU-651-071-1{background: rgb(117, 125, 124); color: white;}

#SKU-651-076-1{background: rgb(129, 134, 137); color: white;}

#SKU-651-074-1{background: rgb(138, 143, 139); color: white;}

#SKU-651-072-1{background: rgb(191, 194, 192); color: white;}

#SKU-651-090-1{background: rgb(104, 106, 109); color: white;}
#SKU-651-091-1{background: rgb(117, 98, 50); color: white;}
#SKU-651-092-1{background: rgb(107, 65, 29); color: white;}
#SKU-651-824-1{background: rgb(210, 151, 47); color: white;} 
  
  
  
  
  

 @media (min-width: 200px) and (max-width: 787px) {
   
   
   
   .add-fluff{padding:10px;}
   
   .product-single__hero{}
   .product-single__photos { width: 75%;margin:0 auto;}
   
/*    .product-title{
     background:#003E89;
     color: white;font-size:18px;font-weight: bold;padding:10px;text-align:center;border-radius:5px;} */
   
   .mobile-checkout {text-align: center; width: 100%;background: #b7dcff;border-radius:10px; color: black;height: 45px;border:none;}
   .mobile-price-align{text-align:center;}
       }
      

  @media (min-width: 789px) and (max-width: 1900px) {
  
  
   .product-single__photos { width: 75%;margin:0 auto;}
    
    .mobile-checkout {text-align: center; width: 100%;background: #b7dcff;border-radius:10px; color: black;height: 45px;border:none;}
    
  .product-title{
     
 text-align:left;font-size:22px;}
    .mobile-price-align{text-align:left;}
    
   
  }


#SKU-581{background:#FFFFFF;}
#SKU-589{background:#FFFF00;}
#SKU-590{background:#FFCE18;}
#SKU-591{background:#FFB510;}
#SKU-588{background:#DE5A00;}
#SKU-582{background:#D60818;}
#SKU-583{background:#AD1829;}
#SKU-584{background:#7B2129;}
#SKU-602{background:#EF086B;}
#SKU-601{background:#6B1873;}
#SKU-600{background:#00214A;}
#SKU-598{background:#085A9C;}
#SKU-596{background:#004284;}
#SKU-597{background:#008CBD;}
#SKU-603{background:#003184;}
#SKU-595{background:#004231;}
#SKU-594{background:#005242;}
#SKU-593{background:#009C63;}
#SKU-592{background:#6BBD4A;}
#SKU-604{background:#ADADA5;}
#SKU-585{background:#522918;}
#SKU-586{background:#393129;}
#SKU-587{background:#F7DEAD;}
#SKU-580{background:#050505;}


/* 
.grid__item {
   padding-right: 5px;
} */


.item1{width: 20%;}
@media (min-width: 200px) and (max-width:  560px) {
.moreshit{width: 100%; font-size: 10px;}
.mobile_nodisplay{display: none;}
.mobile_collections {display: block;}
.middle-title {text-align: center; margin-top:0px;}

}

@media (min-width:560px) and (max-width:  832px) {
.moreshit{width: 100%; font-size: 10px;}
.item1{width: 40%;height: 275px;}

.container1 {justify-content: center;}

}


@media (min-width:832px) and (max-width:  1000px) {

.item1{width: 20%;height: 200px;}



}


.item14 {




 width: 25%;  /* Or whatever */

 /* Magic! */
padding: 5px;

}

.container2 {

 
display: flex;
 flex-direction: column;
padding: 5px;
width: 100%;

 
}


.item2 {



align-items: flex-start;
 margin: auto;  /* Magic! */

width: 100%;

 
}

.moreshit{width: 80%; font-size: 16px; 
  background: #003e89; 
  border-radius:12px;  
  height: 40px; 
  color: white;
  font-family:$accentFontStack;
  border: 3px solid white;
font-weight: bold;
margin-left: 20px;

 -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);}

@media (min-width: 800px) and (max-width: 1800px){
.mobile_collections {display: none;}
}
@media (min-width: 200px) and (max-width: 575px) {
.mobile_nodisplay{display: none;}
.mobile_collections {display: block;}
.middle-title {text-align: center; margin-top:0px;}

li.small-list { font-size:12px; border: 1px solid red;}


}


@media (min-width:575px) and (max-width: 650px){

.item14{width: 50%; height: 250px;}
}

@media (min-width:650px) and (max-width: 950px){

.item14 {width: 33%; height: 250px;}
}


.item19 {


cursor: pointer;

 width: 16.66%;  /* Or whatever */

 /* Magic! */
padding: 5px;

}

.container2 {

 
display: flex;
 flex-direction: column;
padding: 5px;
width: 100%;
cursor: pointer;
 
}


.item2 {



align-items: flex-start;
 margin: auto;  /* Magic! */

width: 100%;
cursor: pointer;

 
}

.moreshit{width: 100%; font-size: 14px; 
  background: #003e89; 
  border-radius:12px;  
  height: 40px; 
  color: white;
  font-family:$accentFontStack;
  border: 3px solid white;
font-weight: bold;

 -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);}

@media (min-width: 200px) and (max-width:  560px) {
.moreshit{width: 100%; font-size: 10px;}
.mobile_nodisplay{display: none;}
.mobile_collections {display: block;}
.middle-title {text-align: center; margin-top:0px;}

}

@media (min-width: 561px) and (max-width:  800px) {
.item19{width: 33%;height: 265px;}
}



@media (min-width:800px) and (max-width:  1000px) {
.moreshit{width: 100%; font-size: 10px;}
.item19{width: 20%;height: 225px;}

.container1 {justify-content: center;}

}

.item13 {




 width: 25%;  /* Or whatever */

 /* Magic! */
padding: 5px;

}

@media (min-width:575px) and (max-width: 650px){

.item13 {width: 50%; height: 250px;}
}

@media (min-width:650px) and (max-width: 950px){

.item13 {width: 33%; height: 250px;}
}


  .main-wrapper-content{
   padding:2px;
    margin:0 auto;
  
   
  }

  
  .click-through-header-box{
  text-align:center;
   
  }  
  
   .click-through-header-box-h2-style{
  color:black; 
     text-align:center;
      font-size: 30px;
   
  } 
  
  
  .header-blurb-style{
  text-align:center;
    font-weight:bold;
    font-size: 30px;
  
  }

.cnc-box-wrapper{
 padding: 5px; width:100%; float: left;margin-left: 5%;margin-top:10px;
 
  
  }
  
  
  
  .category-box{

    width: 22%; 
    height:auto;
    float: left; 
    padding: 10px; 
    padding-top: 0px;
    margin: 2px;
     margin-top: 0px;

  }
  
  
  .category-image-box{
  text-align:center; 
    padding-top:0px; 
    padding-bottom:10px;

  
  
  }
  
  
  .pointer-cursor{
  	cursor: pointer;
/*     width: 200px;
    height: 200px;
    object-fit: contain; */
  }

  
  
  .category-description-blurb{
  
  font-size:14px; 
  font-weight: bold; 
  text-align:center;
  line-height:1.5; 

  padding-top:15px;
  
  
  }
  
  .shop-now-container {
    padding-top: 5px;
  
  text-align:center;
    line-height:1.5;
  
  }



 
.shop-now2{
  background:red;
  border:none; 
  margin-top:0px;
  margin-bottom:10px;
  border-radius:20px; 
  color:white; 
  font-weight:bold; 
  font-family: 'Roboto Condensed', sans-serif; 
  font-size:15px;
  padding-left:10px;
  padding-right:10px;
  padding-top:5px;
  padding-bottom:5px;
  width:100px;
}
  

  
  
  
  
  
  
  
    
    @media (min-width: 850px) and (max-width:  1200px) { 
       .cnc-box-wrapper{
 padding: 5px; width:100%; margin-left: 1%;float: left;
  
  
  }  
  
     .category-box{

      width:22%;
      float:left;
      padding:20px;margin-left:15px;
   
    }
      
       .category-image-box{
  text-align:center; 
    padding-top:0px; 
    padding-bottom:10px;
    width: 20%;
  
  
  }
       .category-description-blurb{
       font-size:13px; 
  font-weight: bold; 
  text-align:center;
  line-height:1.5; 
  height:85px;
  padding-top:5px;
       width: 95%;
       margin:0 auto;
   
    
    }
  
  } 
 .category-box:hover{
/*    padding: 10px 0px 0px 10px;  */
   padding: 10px 10px 10px; 
   transition:padding .25s ease-in-out;
 }

.red-box-hover:hover{padding: 2px;transition:padding .25s ease-in-out;border: 3px solid red;}







#FeatureRowImage--1526954001737 {
    max-width: 700px;
    max-height: 418.282208588957px;
  padding: 4px;
}


#shopify-section-1526954001737  h2{
  color: gray;
  font-size: 40px;
  font-weight: bold;
  padding: 0px;
  text-align:left;
  
}



#shopify-section-1526954001737  .featured-row__subtext{
font-weight: bold;
  color: gray;
  font-size: 18px;


}


@media (min-width: 0px) and (max-width:  750px) {
#shopify-section-1526954001737  h2{
 font-size: 20px;
  text-align: center;

}
  
  
  
#shopify-section-1526954001737  .featured-row__subtext{
font-weight: bold;
  color: gray;
  font-size: 14px;

text-align: center;
}  
  
  
  
}







.btn-link {
    font-weight: 400;
    color: black;
    text-decoration: none;
}


#ULTRACASTWHITE{
background: #ffffff  ;border: 1px solid gray;
}

#ULTRACASTMATWHITE{
background: #f7f7f7 ; border: 1px solid gray;
}
#ULTRACASTCANARY{
background: #ffd100 ;
}
#ULTRACASTSUNFLOWER{
background:#ffbe00  ;
}
#ULTRACASTLIGHTORANGE {
background:#ff7f00 ;
}
#ULTRACASTBRIGHTORANGE{
background: #FF5E13;
}
#ULTRACASTPERFMATCHRED{
background:#ff2624 ;
}
#ULTRACASTTOMATO{
background:#e91c0a  ;
}
#ULTRACASTAPPLE{
background: #e92637 ;
}
#ULTRACASTCARDINAL{
background:#d70e1e  ;
}
#ULTRACASTDRKRED{
background:#bb111a  ;
}
#ULTRACASTBURGUNDY{
background:#7e0318  ;
}
#ULTRACASTLITMAGENTA{
background:#ff61a1  ;
}
#ULTRACASTBLOSSOM{
background:#fc2455  ;
}
#ULTRACASTDARKVIOLET{
background:#9c398b  ;
}
#ULTRACASTDEEPPURPLE{
background: #2b196d  ;
}
#ULTRACASTPURPLE{
background: #391136 ;
}
#ULTRACASTDARKBLUE{
background:#161f35 ;
}
#ULTRACASTLIGHTNAVY{
background: #0f1e4a  ;
}
#ULTRACASTSAPPHIRE{
background: #04256a  ;
}
#ULTRACASTVIVIDBLUE{
background: #004b83 ;
}
#ULTRACASTINTENSEBLUE{
background: #006e9c ;
}
#ULTRACASTOLYMPIC{
background:#00a0c2  ;
}
#ULTRACASTPEACOCK{
background:#5dbbd7  ;
}
#ULTRACASTDARKAQUA{
background:#06c999  ;
}

#ULTRACASTSHADOWBLUE{
background:#374c69 ;
}
#ULTRACASTWEDGEWOOD{
background:#7599a9 ;
}
#ULTRACASTBERMUDABLUE{
background:#006659;
}
#ULTRACASTTEAL{
background:#019a86  ;
}
#ULTRACASTKELLYGREEN{
background:#00a046  ;
}
#ULTRACASTAPPLEGREEN{
background: #31ab00;
}
#ULTRACASTBRITEGREEN{
background: #008e38 ;
}
#ULTRACASTDARKGREEN{
background:#004c1d  ;
}
#ULTRACASTFORESTGREEN{
background:#0e3b26 ;
}
#ULTRACASTBOTTLEGREEN{
background: #051a07 ;
}
#ULTRACASTMATBLACK{
background:#111111  ;
}
#ULTRACASTBLACK{
background:#000000  ;
}
#ULTRACASTDRKGRAY{
background:#4b4e47;
}
#ULTRACASTMEDGRAY{
background:#8f8a86  ;
}
#ULTRACASTPEARLGRAY{
background:#E4E0D9  ;
}
#ULTRACASTBEIGE{
background:#e9d0b1;
}
#ULTRACASTSANDSTONE{
background:#b5a08b;
}
#ULTRACASTTAN{
background:#bb8a52;
}
#ULTRACASTPUTTY{
background:#826255;
}
#ULTRACASTRUSSBROWN{
background: #581a01;
}
#ULTRACASTDEEPMAHBROWN{
background: #500404 ;
}
#ULTRACASTTERRACOTTA{
background:#c54d00  ;
}
#ULTRACASTIMITATGOLD{
background: #e19f15 ;
}
#ULTRACASTMETGOLD
{
background: url("/cdn/shop/files/satingoldmet.png?v=1614196921");background-size: 100px 100px;}
#ULTRACASTMETSILVER{background: url("/cdn/shop/files/satinsilmet.png?v=1614197014");background-size: 100px 100px;}
#ULTRACASTFROGLASS{
background:#b9bab9;
}




#BLACK-0303EY55{background: black;}
#WHITE-0303EY55{background: white;border: 2px solid black;}
#RED-0306EY55{background: #b71615;}
#LHTGREEN-0325E20{background: #18884d;}
#DRKGREEN-0310E20{background: #2a5b2d;}
#PURPLE-0316E20{background: #2f0a48;}

#SWEETPINK-0371E05{background:#f983b8;}
#ORANGE-0305EY55{background: #ee5d13; }
#GREY-0324E20 {background: #b9bdc1; }
#ROBINEGG-0341E20 {background: #60b4f3;}
#ROYALBLUE-0309EY55{background: #173881;}
#TEAL-0319E05{background:#4b959e;}
#GOLDENYELL-0304EY55{background:#f8bc43;}
#NAVYBLUE-0312EY55{background:#0d164c;}
#LEMONYELLOW-0313E05{background:#e5d800;}
#FLUOPINK-0332E05-5YD{background:#ef296e;}
#FLUOGREEN-0332E05-5YD{background:#29dd2a;}
#FLUOORANGE-0326E05-5YD {background:#fe4900;}
#FLUOYELLOW-311E05-5YD {background:#fff800;}
#METGOLDHTV-0302EY55{background: url("/cdn/shop/files/smmetgoldswatch-flip.png?v=1631801580");background-size: 100px 100px;}
#METSILVERHTV{background: url("/cdn/shop/files/metsilverswatch-flipped.png?v=1631801647");background-size: 100px 100px;}
#METROSEHTV{background: url("/cdn/shop/files/rose-swatch_1.png?v=1631801989");background-size: 100px 100px;}
#BLINGGOLD{background: url("/cdn/shop/files/blinggoldswatch.png?v=1631805240");background-size: 100px 100px;}
#BLINGGREEN{background: url("/cdn/shop/files/greenbling-swatch.png?v=1631805745");background-size: 100px 100px;}
#GALAXYSILVER{background: url("/cdn/shop/files/galaxy_silverswatch.png?v=1631807596");background-size: 100px 100px;}
#GALAXYRED{background: url("/cdn/shop/files/redglitter-swatch.png?v=1631808016");background-size: 100px 100px;}
#GALAXYGOLD{background: url("/cdn/shop/files/GALAXYGOLDSWATCH.png?v=1631812349");background-size: 100px 100px;}



.datasheets {
  border: none;
  background: #003E89; 
  color: white;
  border-radius: 6px;
  padding-top: 8px;
   padding-bottom: 8px;
   padding-right: 10px;
   padding-left: 10px;
  font-size: 15px;
  

}

#red{background:red;}

.list-style-box{
	list-style: none; 
	background: #FDFDFD; 
	padding: 10px;

}

.list-style-variants-multiple{
background: white; 
  padding: 20px; 
  border: 1px solid #F5F5F5; 
  border-radius: 5px; 
  -webkit-box-shadow: 0px 0px 2px 0px rgba(181,174,181,1);
  -moz-box-shadow: 0px 0px 2px 0px rgba(181,174,181,1); 
  box-shadow: 0px 0px 2px 0px rgba(181,174,181,1);list-style:none;

}

.variant-title-style{
  font-size: 18px; 
  font-weight:bolder;
color: black;
  
}


.big{
  width: 100px !important;
  height:100px !important;
 box-shadow:none !important;
 
}

.big:hover{
  width: 100px !important;
  height:100px !important;
  
  border-radius: 0px !important;
 
}

.mobile-variant-picker{margin-left: -10px;width: 100%;}
.full-not-section{width: 80%;}
.sign-picker-href{
  width: 100%;
  float:left;
  height:100%;

}





#STOP-PICKER{
 background: url("/cdn/shop/files/thumb.png?v=1635531181");background-size: 100px 100px; 
  
}

#PICKER-ALLWAY{
background: url("/cdn/shop/files/allwaygradethumb.png?v=1635530175");background-size: 100px 100px;
}

#PICKER-THREEWAY{
background: url("/cdn/shop/files/Asset_2_0aafa0e6-bc3b-4204-befc-666be6ff2df4.png?v=1635527162");background-size: 100px 100px;  
}

#PICKER-FOURWAY{
background: url("/cdn/shop/files/4way2.png?v=1635527295");background-size: 100px 100px;  
}

#PROHIBITPARKING
{
background: url("/cdn/shop/products/R8-3a_c0b4b99d-edd8-4cdc-99e9-6150e5b0e4fc_540x.png?v=1635434507");background-size: 100px 100px;  
}

#PROHIBITTRUCKS
{
background: url("/cdn/shop/products/R5-2-24X24_6ef2e9c6-9221-44cb-a97f-973ea8da0889_740x.png?v=1635539217");background-size: 100px 100px;  
}

#PROHIBITU{
background: url("/cdn/shop/products/NoUturn_b8dcbf40-096f-49d7-82ac-95dd34ab649c_740x.png?v=1635540805");background-size: 100px 100px;  
}

#PROHIBITLEFT{
background: url("/cdn/shop/products/R3-2_995d7016-e091-43b6-9d97-cb93186d6111_540x.png?v=1635541065");background-size: 100px 100px;  
}

#PROHIBITRIGHT{
background: url("/cdn/shop/products/noRight_07c1ee93-1e58-4459-963a-3e600736eaf0_540x.png?v=1635541294");background-size: 100px 100px;  
}

#LEFTONLY{
background: url("/cdn/shop/products/leftonn_540x.png?v=1635450829");background-size: 100px 100px;  
}

#RIGHTONLY{
background: url("/cdn/shop/products/rton_e70a54f6-50cb-4bb3-a8b2-8cc56657a51c_740x.png?v=1635772529");background-size: 100px 100px;  
}


#STRAIGHTONLY{
background: url("/cdn/shop/products/centr_2f03465f-f96b-42b8-81d7-e2de1e293537_740x.png?v=1635774822");background-size: 100px 100px;  
}

#KEEPLEFT{
background: url("/cdn/shop/files/Asset_18_540x_33cf9958-d874-4fca-8821-5008f1dbf503_540x.webp?v=1641831635");background-size: 100px 100px;  
}

#KEEPRIGHT{
background: url("/cdn/shop/files/Asset_18_540x_33cf9958-d874-4fca-8821-5008f1dbf503_540x.webp?v=1641831635");background-size: 100px 100px;  
}


@media (min-width: 100px) and (max-width: 500px) {
.colorpicker-flex-container > div  {
    background-color: #f1f1f1;
    width: 50px;
    height: 50px;
    margin-bottom: 5px;
    text-align: center;
    line-height: 25px;
    font-size: 10px;
   border-radius:0px;
}
  
}

#PLACEHOLDER1{
background: url("/cdn/shop/files/Asset_5.png?v=1635776804");background-size: 100px 100px;  
}

#ONEWAYRIGHT{
background: url("/cdn/shop/products/onewayright_540x.png?v=1635782886");background-size: 100px 100px;  
}

#ONEWAYLEFT{
background: url("/cdn/shop/products/onewayleft_540x.png?v=1635783147");background-size: 100px 100px;  
}

#NOTHRUTRAFFIC{
background: url("/cdn/shop/products/NOTHRUTRAFFIC_540x.png?v=1635792074");background-size: 100px 100px;  
}


#NOTHROUGHTRUCKS{
background: url("/cdn/shop/products/NOTHROUGHTRUCKS_540x.png?v=1635793888");background-size: 100px 100px;  
}

#DONOTPASS{
background: url("/cdn/shop/files/18x26donotpass_740x.webp?v=1641831762");background-size: 100px 100px;  
}

#ONEWAYLEFT2{
background: url("/cdn/shop/products/onewayleft_1_540x.png?v=1635799605");background-size: 100px 100px;  
}

#ONEWAYRIGHT2{
background: url("/cdn/shop/products/onewayrightarrow_540x.png?v=1635799847");background-size: 100px 100px;  
}

#ROADCLOSED{
background: url("/cdn/shop/products/roadclosed_540x.png?v=1635859785");background-size: 100px 100px;  
}

#RRCROSSING{
background: url("/cdn/shop/products/RRCrossing_540x.png?v=1635861800");background-size: 100px 100px;  
}

#R7-1L-NOPARKINGLEFT{
background: url("/cdn/shop/files/R7-1L.png?v=1637250490");background-size: 100px 100px;  
}

#R7-1R-NOPARKINGRIGHT{
background: url("/cdn/shop/files/R7-1R_1.png?v=1637251513");background-size: 100px 100px;  
}


#R7-1DR7-1D-LEFTANDRIGHT{
background: url("/cdn/shop/files/R7-1D.png?v=1637250681");background-size: 100px 100px;  
}

#R7-1-ANYTIME{
background: url("/cdn/shop/files/R7-1.png?v=1637250760");background-size: 100px 100px;  
}

#R7-6-3-TOCORNER{
background: url("/cdn/shop/files/R7-6-3_2.png?v=1637250856");background-size: 100px 100px;  
}

#R7-6-5-THISSIDE{
background: url("/cdn/shop/files/R7-6-5.png?v=1637250962");background-size: 100px 100px;  
}

#R-6-9-FIRELANE{
background: url("/cdn/shop/files/R-6-9.png?v=1637251009");background-size: 100px 100px;  
}
  
#R7-19-FIRELANE2{
background: url("/cdn/shop/files/R7-19.png?v=1637251092");background-size: 100px 100px;  
}

#R8-3-BOTH{
background: url("/cdn/shop/files/R8-3.png?v=1637251872");background-size: 100px 100px;  
}
 

#R7-8a-12-12X18{
background: url("/cdn/shop/products/R7-8a-12_540x.png?v=1634909438");background-size: 100px 100px;  
}

#R7-35-12X26{
background: url("/cdn/shop/products/R7-35-12X26_1_540x_b4e9d0aa-016e-4d2c-bbb9-85499a2d424a_540x.png?v=1635875789");background-size: 100px 100px;  
}


#R7-8-11-12X18{
background: url("/cdn/shop/products/R7-8-11_540x.png?v=1634845610");background-size: 100px 100px;  
}

#HC-36-12X9{
background: url("/cdn/shop/files/max_penalty_540x_d4f1191b-b0cf-4148-84b9-c6238f287ce3_540x.webp?v=1641832032");background-size: 100px 100px;  
}

#HC-37-12X9{
background: url("/cdn/shop/files/HC--37-12x9_540x_00992093-c3c8-44e3-914b-8fde7c9c991d_540x.webp?v=1641832154");background-size: 100px 100px;  
}

#HC-20-16X6{
background: url("/cdn/shop/products/HC-20-12X6_3_540x_a77b2c9a-ed12-4487-a65e-0b57529f4507_540x.png?v=1635876533");background-size: 100px 100px;  
}


#R7-8-16-12X8{
background: url("/cdn/shop/files/R7-8-16_1_540x_540x_a2ccfb61-4aa2-4417-8a2b-0bc36aab9c5a.webp?v=1641831987");background-size: 100px 100px;  
}

#HC-22-12X6{
background: url("/cdn/shop/products/Asset_60_540x.png?v=1634910320");background-size: 100px 100px;  
}

#WARNINGLEFT{
background: url("/cdn/shop/products/W1-1L_540x.png?v=1635886679");background-size: 100px 100px;  
}



#WARNINGRIGHT{
background: url("/cdn/shop/products/W1-1R_78a4beb1-3c81-4002-a197-385bc44ba6fd_540x.png?v=1635943846");background-size: 100px 100px;  
}


#WARNINGLEFTCURVE{
background: url("/cdn/shop/products/CurveLeft_a4529b9c-cfe9-4002-9144-d26597c30478_540x.png?v=1635945545");background-size: 100px 100px;  
}

#WARNINGRIGHTCURVE{
background: url("/cdn/shop/files/CurveRight_d2541ca9-c9d7-47d0-b366-79291963fec7_740x.webp?v=1641832273");background-size: 100px 100px;  
}

#WARNINGPEDESTRIAN{
background: url("/cdn/shop/products/crosswalk_740x.png?v=1636732174");background-size: 100px 100px;  
}

#WARNINGPEDESTRIANCROSSING{
background: url("/cdn/shop/products/warningcross_740x.png?v=1636732841");background-size: 100px 100px;  
}

#DEADENDWARNING{
background: url("/cdn/shop/products/deadend_740x.png?v=163673328");background-size: 100px 100px;  
}

#NOOUTLETWARNING{
background: url("/cdn/shop/products/no_outlet_740x.png?v=1636734161");background-size: 100px 100px;  
}











.container-traffic{
    position: relative;
    width: 100%;
    height: 180px;
    float: left;
    text-align: center;
    display: flex;
}

.image-traffic {

  width: 60%;
  height: auto;
 
  margin: 0 auto;

}

.overlay-traffic {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: white;
}

.container-traffic:hover .overlay-traffic {
  opacity: .95;
}

.text-traffic {
  color: black;

  font-size: 14px;
  position: absolute;
  top: 65%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  margin-top: -25px;

  width: 100%;
}

.traffic-header{
	margin-top: 5px;
  	font-size: 20px;
    line-height: 24px;
  	text-align:center;
  	color:black;
	text-transform: capitalize;
}


.traffic-img-size{
	width: 155px;
    justify-content: center;
    padding: 15px 0px;
}


.traffic-column{
  width:16.66%;
  float:left;
}


#ECON-AUTHORIZEDPARKING{
background: url("/cdn/shop/products/Authorized_Parking_Only_740x.png?v=1636493177");background-size: 100px 100px;  
}


#ECON-NOPARKLEFT{
background: url("/cdn/shop/products/noparkingleft_0e80eec1-5ac5-47c8-acca-41ea1fce2ed8_740x.png?v=1636573734");background-size: 100px 100px;  
}

#ECON-NOPARKINGRIGHT{
background: url("/cdn/shop/products/noparkingRight_1_740x_f047e9ad-6ab2-4847-ac96-2d7f94a1922a_740x.png?v=1636637886");background-size: 100px 100px;  
}

#ECON-NOPARKBIG{
background: url("/cdn/shop/products/noparkingbig_740x_8567681b-eacd-4ae8-93de-7afb0337314b_740x.png?v=1636637990");background-size: 100px 100px;  
}

#ECON-NOPARKINGANYTIME{
background: url("/cdn/shop/products/noparkinganytime2_740x_28028f4e-b1e9-4d8d-91c3-4ce9284b0a34_740x.png?v=1636638078");background-size: 100px 100px;  
}

#ECON-NOPARKINGANYFIRELANE{
background: url("/cdn/shop/products/NOParkfire_740x_9a417845-9bb9-48f6-bf5c-8c37ee94d3f2_740x.png?v=1636638159");background-size: 100px 100px;  
}

#ECON-NOPARKINGLOADING{
background: url("/cdn/shop/products/noparkloading_740x_c37118c1-c60b-489d-9e4f-21b3ce633212_740x.png?v=1636638318");background-size: 100px 100px;  
}

#ECON-NOPARKINGTOWING{
background: url("/cdn/shop/products/Noparkingtow_740x_fc72735c-9761-4068-a8ce-ca32031be17b_740x.png?v=1636638399");background-size: 100px 100px;  
}


#ECON-UNAUTH-TOWING{
background: url("/cdn/shop/products/unauthorized_740x_2e9c6e82-4f50-42b2-9d64-7e6b897bdafa_740x.png?v=1636638566");background-size: 100px 100px;  
}

#ADA-W-RESTROOM{
background: url("/cdn/shop/products/W-BATH-ADA-BLUE_540x.png?v=1636663027");background-size: 100px 100px;  
}
#ADA-W-RESTROOM:hover{
background: url("/cdn/shop/products/W-BATH-ADA-BLACK_540x.png?v=1636663047");background-size: 100px 100px;  
}

#ADA-M-RESTROOM{
background: url("/cdn/shop/products/M-BATH-ADA-BLUE_540x.png?v=1636660293");background-size: 100px 100px;  
}
#ADA-M-RESTROOM:hover{
background: url("/cdn/shop/products/M-BATH-ADA-BLACK_540x.png?v=1636660305");background-size: 100px 100px;  
}
#ADA-W-RESTROOM-HANDI{
background: url("/cdn/shop/products/W-BATH-HANDI-ADA-BLUE_540x.png?v=1636660670");background-size: 100px 100px;  
}

#ADA-W-RESTROOM-HANDI:hover{
background: url("/cdn/shop/products/W-BATH-HANDI-ADA-BLK_540x.png?v=1636660681");background-size: 100px 100px;  
}

#ADA-M-RESTROOM-HANDI{
background: url("/cdn/shop/products/M-BATH-HANDI-ADA-BLUE_540x.png?v=1636660980");background-size: 100px 100px;  
}

#ADA-M-RESTROOM-HANDI:hover{
background: url("/cdn/shop/products/M-BATH-HANDI-ADA-BLK_540x.png?v=1636660903");background-size: 100px 100px;  
}

#ADA-UNI{
background: url("/cdn/shop/products/UNI-BATH-ADA-BLUE_540x.png?v=1636661151");background-size: 100px 100px;  
}

#ADA-UNI:hover{
background: url("/cdn/shop/products/UNI-BATH-ADA-BLK_540x.png?v=1636661161");background-size: 100px 100px;  
}


#ADA-UNI-HANDI{
background: url("/cdn/shop/products/UNI-BATH-HANDI-ADA-BLUE_540x.png?v=1636661406");background-size: 100px 100px;  
}

#ADA-UNI-HANDI:hover{
background: url("/cdn/shop/products/UNI-BATH-HANDI-ADA-BLK_540x.png?v=1636661416");background-size: 100px 100px;  
}

#ADA-NO-SMOKING{
background: url("/cdn/shop/products/ADA-NOSMOKE-BLUE_540x.png?v=1636662346");background-size: 100px 100px;  
}

#ADA-NO-SMOKING:hover{
background: url("/cdn/shop/products/ADA-NOSMOKE-BLK_540x.png?v=1636662359");background-size: 100px 100px;  
}

#ADA-STAIRS{
background: url("/cdn/shop/products/ADA-STAIRS-BLUE_540x.png?v=1636661632");background-size: 100px 100px;  
}

#ADA-STAIRS:hover{
background: url("/cdn/shop/products/ADA-STAIRS-BLK_540x.png?v=1636661643");background-size: 100px 100px;  
}

#ADA-EXIT{
background: url("/cdn/shop/products/ADA-EXIT-BLUE_540x.png?v=1636662646");background-size: 100px 100px;  
}

#ADA-EXIT:hover{
background: url("/cdn/shop/products/ADA-EXIT-BLK_540x.png?v=1636662657");background-size: 100px 100px;  
}

.card-style-side > li:hover{background: #F5F5F5;}
.accordion-side h3:hover{background: #F5F5F5;}
.accordion2-side h4:hover{background: #F5F5F5;}
.accordion3-side h5:hover{background: #F5F5F5;}



@media (min-width: 200px) and (max-width: 787px) {
 
  
 .mobile-hide-image{display:none;}
  
  
  
}





 .pricing-style-cta-front{
   background:red;
  text-align: center;

  border-radius: 15px;
  border: 2px solid red;
  padding: 3px;
  width: 100%;
   margin: 0 auto;
   text-transform:uppercase;
font-size: 14px;
  
} 
  
  
  
  .order-now{
    float: right;
    width:100%;
    line-height: 10px;
    position: absolute;
    bottom: 1px;
    right:10px;
  }
    
  
  



.gallery-section-title{
  color: black;
  font-weight:bolder;
  
  text-align:center; 

  
}



.grid-size-font4{
  font-family: 'Roboto Condensed', sans-serif;
  font-weight:bolder;
  font-size:18px;
}

.grid-size-font5{
 font-family: 'Roboto Condensed', sans-serif;
  font-weight:bolder;
  font-size:18px;


}


.grid-size-font6{

font-size:12px;}

.gallery-title{
 

  text-align:left;
  font-family: 'Roboto Condensed', sans-serif;
  color:black;
    font-size:20px;

  width:20%;
   font-weight:bolder;
  margin-left:2px;
}


@media screen and (min-width: 721px) {
    .trapezoidby_jaheyra{
	border-bottom:40px solid #d6eaf5;
border-left: 0px solid transparent;
border-right: 25px solid transparent;
height: 0;
width: 200px;
font-size: 28px;
  line-height: 1.5;

}
}
 

 .hover-collection:hover{border:4px solid red;}



.mobile-logo-h1{
font-weight: 900;


}

.mobile-logo-h2{
font-weight: 900;font-size: 14px;
}
@media (min-width: 200px) and (max-width: 787px) {
#shopify-section-1639857100642b583b{display:none;}
  
}

/* custom css for mobile  */

  @media only screen and (max-width: 600px){
#bottom-box-bg, #top-box-bg, #middle-box-bg, .gallery__image-container.hover-collection.grid-link{
     border: 1px solid #E2D9D9!important;
  }
 } 

 @media only screen and (max-width: 600px){
.gallery__image-container.hover-collection.grid-link{
 	border-radius: 5px;
  	border: 1px solid #E2D9D9;
	-webkit-box-shadow: 5px 5px 4px -5px #7c7777;
    box-shadow: 5px 5px 4px -5px #7c7777;
	}
} 


@media only screen and (max-width: 600px){
img.gallery__image.front-hover.lazyautosizes.lazyloaded {
    padding: 5px;
}
  h5.gallery-section-title.grid-size-font5 {
    padding-top: 14px;
    text-transform: uppercase;
}
  #shopify-section-announcement-banner > div > div > a:nth-child(2) > div > div.announcement_inner_text > span{
  font-size: 18px;

}
  button.qsc-btn.qsc-btn--stickycart.qsc-btn--has-shadow.pos-desktop-top_right.pos-mobile-top_right {
    margin: 15px;
}
  
  .gallery__image-wrapper{
padding-top:76%!important;
}

.gallery__image
{
padding:42px!important;
}

  
  
}