/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-Light_0.woff2') format('woff2'),
         url('/fonts/Gotham-Light_0.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-LightItalic_0.woff2') format('woff2'),
         url('/fonts/Gotham-LightItalic_0.woff') format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-Book_0.woff2') format('woff2'),
         url('/fonts/Gotham-Book_0.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-BookItalic_0.woff2') format('woff2'),
         url('/fonts/Gotham-BookItalic_0.woff') format('woff');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-Medium_0.woff2') format('woff2'),
         url('/fonts/Gotham-Medium_0.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-MediumItalic_0.woff2') format('woff2'),
         url('/fonts/Gotham-MediumItalic_0.woff') format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-Bold_0.woff2') format('woff2'),
         url('/fonts/Gotham-Bold_0.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-BoldItalic_0.woff2') format('woff2'),
         url('/fonts/Gotham-BoldItalic_0.woff') format('woff');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-Black_0.woff2') format('woff2'),
         url('/fonts/Gotham-Black_0.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-BlackItalic_0.woff2') format('woff2'),
         url('/fonts/Gotham-BlackItalic_0.woff') format('woff');
    font-weight: 900;
    font-style: italic;
}

:root {

/* Colors */
  /* Primary Color */
  --color-primary: #005c85;  /* Base primary color. 09/2024-  Used on CTAs. */
  --color-primary-hover: hsl(203.9deg, 56.16%, 42.94%);
  --color-primary-disabled: hsl(205.91deg 28.21% 69.41%); /* Use for disabled primary CTAs, accents, tigerstrips, etc. */
  --color-primary-dark: hsl(201.74deg 65.71% 20.59%);  
  --color-primary-darker: hsl(204deg 51.28% 15.29%);
   
  /* Linear Gradient for Primary Color - use with Background:var() */
  --gradient-primary: linear-gradient(45deg, var(--color-primary-dark) 25%, var(--color-primary) 100%);
  --gradient-primary-hover: linear-gradient(45deg, var(--color-primary) 25%, var(--color-primary-hover) 100%);
  --gradient-white: linear-gradient(#ffffff, #ffffff); /* For transition effects */


  /* Secondary Color */
  --color-secondary: hsl(92.37deg 55.07% 27.06%);  /* Base secondary color. 09/2024 - Used for Dues components. */
  --color-secondary-hover: hsl(91.53deg 27.19% 42.55%);
  --color-secondary-disabled: hsl(91.36deg 20.75% 58.43%);
  --color-secondary-dark: hsl(92.14deg 50.91% 21.57%);
  --color-secondary-darker: hsl(92.43deg 44.58% 16.27%);
  
  /* Linear Gradient for Secondary Color  - use with Background:var()*/
  --gradient-secondary: linear-gradient(90deg, var(--color-secondary-dark) 0%, var(--color-secondary) 100%);
  
  /* Grays */
  --color-black: #333333;  /* Use for body text */
  --color-gray: #828282;   /* Use for subtle text */
  --color-smoke: #EAEAEA;  /* Use for hairlines */
  --color-white: #ffffff;
  
  /* Opaqueness & Translucency */
  --color-overlay: rgba(0, 0, 0, 0.5);  /* Dark overlay with 50% opacity */;
  
/* Typography */
  --font-zize-xs: 0.75rem;	  /* 12px - H5, preliminary text */
  --font-size-sm: 0.875rem;   /* 14px - Subtitles */
  --font-size-base: 1rem;     /* 16px - body text, buttons */
  --font-size-lg: 1.25rem;    /* 20px - H4 */
  --font-size-xl: 1.5rem;     /* 24px - H3 */
  --font-size-xxl: 2.25rem;   /* 36px - H2*/
  --font-size-title: 3.0rem;  /* 48px - H1 (titles) */
  
  /* Font Families */
  --font-family-sans: 'Gotham', Arial, sans-serif;
  --font-family-serif: 'Georgia', serif;
  
  /* Line Heights */
  --line-height-body: 1.5;  /* Paragraph */
  --line-height-caption: 1.2;   /* Titles */
  --line-height-article: 1.75;  /* Articles */
  
/* Spacing */   
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2.0rem;
  --spacing-endSection: 4.0rem;
  --margin-btn: 0.5rem, 1.0rem, 1.0rem, 0.5rem;
  --padding-btn: 1.0rem, 0.5rem, 1.0rem, 0.5rem;
  
  
/* Borders and Radius */
  --rounded: 30px; /* For completely rounded button corners */
  --rectangle: 5px; /* slight roundness */  
  
/* Shadows */
  --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  --glass: inset 0 8px 4px rgba(0, 0, 0, 0.1); /*use with box-shadow */
  
/* Transitions */
   --transition-hover: 0.3s ease;

  
}


/* ------ Accessibility ------- */

.screen-reader {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* ------ End Accessibility ------- */

/* ------ HTML stuff? ------- */

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth; 

}
        /* Define keyframes for the fade-in effect */
        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        /* Apply the animation to all content */
html, body {
     opacity: 0.2; /* Start invisible */
     animation: fadeIn 0.3s ease-in-out forwards; /* Fade in over 0.3s  seconds */
}

body {
    margin: 0
}

main {
    display: block
}

/* ------ Typography ------- */

h1, h2, h3, h4, h5, h6, .ms-h1, .ms-h2, .ms-h3, .ms-h4, .ms-h5, .ms-h6 {
	margin:0;
}

h1 {
    font-size: 2em;
    margin: 0.67em 0
}

hr {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

.subtitle {
	font-size:var(--font-size-sm: 0.875rem); 
	color: var(--color-gray);
}

a {
    background-color: transparent
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,strong {
    font-weight: bolder
}

code,kbd,samp {
    font-family: monospace, monospace;
    font-size: 1em
}


sub {
    bottom: -0.25em
}

sup {
    top: -0.5em
}

/* ------ End Typography ------- */


/* ------ Image-related ------- */

img {
    border-style: none;
    border-radius: 5px;
}

.image-container {
    text-align: center;
    padding: 10px;
}

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


/* End Image-related */

/* ------- Colors ---------- */

.white {
	color: var(--color-white) !important;
	stroke: var(--color-white) !important;
}

.blue {
  color: var(--color-primary) !important;
  stroke: var(--color-primary) !important;
  
}

.gray {
  background: var(--color-gray);
  color: var(--color-gray);
}

.blue-linear {
  background: var(--gradient-primary);
  stroke: var(--gradient-primary) ;
}

.blue-linear:hover {
  background: var(--gradient-primary-hover);
}

.translucent {
	opacity:0.95;
}

/* End Colors */



/* ------------- Layout Systems  ------------- */

.flex {
	display:flex;
}

.column {
	flex-direction: column;
}


/* Width Utility */
.w-100, .100 { width: 100%; }
.w-90, .90 { width: 90%; }
.w-80, .80 { width: 80%; }
.w-75, .75 { width: 75%; }
.w-66, .66 { width: 66.7%; }
.w-50, .50 { width: 50%; }
.w-40, .40 { width: 40%; }
.w-33, .33, .w-30, .width-30 { width: 33%  !important; }
.w-25, .25 { width: 25% }
.w-xs { width: 160px }
.w-s { width: 240px }
.w-md { width: 320px }
.w-lg { width: 440px;}
.w-xl { width: 600px; }


/* Height Utility */
.h-sm {height: 112px;}
.h-md {height: 240px;}
.h-lg {height: 320px}

@media (max-width: 576px) {
  .mobile-w-100 {
    width: 100% !important; /* Full width on mobile devices */
  }
}
.divider {
	margin: 0px 5px 0px 5px;
    width: 3px; /* Thickness of the divider */
    background-color: #ccc; /* Color of the divider */
}
@media (max-width: 768px) {
    .divider {
    display:none;
    }
}
.right {
	-webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;

}

.center {
  display: flex;
  align-items: center !important;
  justify-content: center !important; /* Default to center alignment */
  flex-wrap: wrap; /* Ensure it wraps correctly when needed */
}

.row {
  flex-direction:row !important ;
}

.space-between {
  justify-content: space-between;
}

.side-padding {
  padding-left: var(--spacing-md);
  padding-right: var(--spacing-md);
}


/* Old Styles. Avoid using .container and related col- styles. Move to a flex system. */

.container {
    display: block;
    width: 100%;
    max-width: 1280px;
    margin: auto
}

@media (min-width: 992px) {
	section > .container {
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-box-pack: justify;
		-webkit-justify-content: space-between;
		-ms-flex-pack: justify;
		justify-content: space-between;
		margin: auto;
	}
}


.row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    margin-left:0px !important;
}

.row.row-justify {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.row.row-h-center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}

.row.row-left {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.row.row-right {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.row.row-top {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start
}

.row.row-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.row.row-bottom {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end
}

.row .col-1 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    width: 8.33333%
}

.row .col-2 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    width: 16.66667%
}

.row .col-3 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    width: 25%
}

.row .col-4 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    width: 33.33333%
}

.row .col-5 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.66667%;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    width: 41.66667%
}

.row .col-6 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    width: 50%
}

.row .col-7 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.33333%;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    width: 58.33333%
}

.row .col-8 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.66667%;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    width: 66.66667%
}

.row .col-9 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    width: 75%
}

.row .col-10 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.33333%;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    width: 83.33333%
}

.row .col-11 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.66667%;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    width: 91.66667%
}

.row .col-12 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    width: 100%
}

.spacer {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1
}
/* End Old */


/* End Layout Systems */



/*-------icons-------*/

.news-icon {
    background-image: url('/images/icons/news.svg');
    transform:scale(110%);
    background-repeat: no-repeat;
    color: white; /* This will only work if the SVG uses 'currentColor' for its fill and stroke */
}
.pen-icon {
    background-image: url('/images/icons/pen.svg');
    transform:scale(95%);
    background-repeat: no-repeat;
    color: white; /* This will only work if the SVG uses 'currentColor' for its fill and stroke */
}

.info-icon {
    background-image: url('/images/icons/info 2.svg');
    background-repeat: no-repeat;
    color: white; 
}

.book-icon {
    background-image: url('/images/icons/book.svg');
    background-repeat: no-repeat;
    color: white; 
    fill: white;
    stroke: white;
}

.arrow-right {
	background-image: url(/images/icons/arrow-right.svg);
	background-repeat: no-repeat;
}

.arrow {
	scale:150%;
}

.microphone-icon {
    background-image: url('/images/icons/microphone.svg');
    background-repeat: no-repeat;
    color: white; /* Works with 'currentColor' in SVG */
}
/* General class for setting the size of SVG icons */
.icon-mid {
    background-position: center; /* Centers the background image */
    display: flex; /* Use flexbox to align contents */
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    text-align: center; /* Ensures any text inside is centered */
    margin:10px;
    width:40px;
    height:40px;
}
.icon-sm {
    background-position: center; /* Centers the background image */
    display: flex; /* Use flexbox to align contents */
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    text-align: center; /* Ensures any text inside is centered */
    margin:10px;
    width:18px;
    height:20px;
}


/*-----Hover------*/

.hover {
    transition: var(--transition-hover);
    opacity: 1;
}

.hover:hover {
    transform: scale(1.01);
    opacity: 0.75;

}
/* -------- Buttons ------ */

.rounded {
	border-radius: var(--rounded) !important;
}

.round-right {
	border-bottom-right-radius: var(--rounded) !important;
	border-top-right-radius: var(--rounded) !important;
	border-bottom-left-radius: var(--rectangle);
	border-top-left-radius: var(--rectangle) ;
	overflow: hidden ; 
	
}

.stroke {
  border: 0.25rem solid var(--color-primary); /* White stroke */
}

/* End button-related */

.button {
    background-color: #005c84;
    display: flex;
    align-items: center;
    padding: 10px 10px;
    border-radius: 5px;
    cursor: pointer;
    border: none;
    width: 330px;
    height:80px;
    text-decoration: none;
    margin-bottom: 16px;
}
@media (max-width: 768px) {
    .button {
        background-color: #1D4A85;
        display: flex;
        align-items: center;
        padding: 0px 0px;
        border-radius: 5px;
        cursor: pointer;
        border: none;
        width: 90%;
        height: 80px;
        text-decoration: none;
        margin-bottom: 16px;
	}  
}      
.button:hover {
    background-color: #197CA8;
    text-decoration: none;
}
.button.right {
	border-radius: 10px 100px 100px 10px;
	margin-left:10px;
}
.button .icon-mid {
    margin-right: 10px;
    border-radius: 5px; 
}
.button p {
	color: white; 
    flex-grow: 1; 
    margin: 0 0 0 0 !important; /* Removes default margin */
    max-width:210px;
    word-wrap: normal;
    overflow-wrap: normal;
    hyphens:auto;
}



button,input,optgroup,select,textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
    padding: 3px 3px 3px 3px;
}

button,input {
    overflow: visible
}

button,select {
    text-transform: none
}

button,[type="button"],[type="reset"],[type="submit"] {
    -webkit-appearance: button
}

button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: 0.35em 0.75em 0.625em
}

legend {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type="checkbox"],[type="radio"] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

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

[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

template {
    display: none
}

[hidden] {
    display: none
}

body {
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif
}

.text__h1 {
    display: block;
    width: 100%;
    text-transform: uppercase;
    color: #7e7e7e;
    padding-bottom: 4px;
    border-bottom: 2px solid #9aafb9;
    margin: 2rem 0;
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: 300;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -.025rem;
    font-size: 4rem;
    line-height: 3.8rem
}


.text__h1:after {
    content: "";
    display: block;
    margin-top: 2px;
    border-bottom: 2px solid #9aafb9
}

.text--center {
    text-align: center
}

.text__hr {
    max-width: 1280px;
    margin: 1rem auto;
    border-top: solid 1px #dcdcdc
}


/* ------ General Card Styling ------ */
.card {
  box-sizing: border-box;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: var(--rectangle);
  box-shadow: var(--shadow);
  overflow: hidden;
  color: var(--color-white);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  text-decoration: none !important;
  margin: var(--spacing-xs);
  margin-left: 0px;
  transition: all var(--transition-hover);
}


.card-body {
	color: var(--color-black) !important;
}


@media (max-width: 768px) {
  .card {
    margin: 0; /* Removes all margins */
    margin-bottom: var(--spacing-xs);
  }
}


.card-content {
  padding: var(--spacing-md);
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-height: 96px; /* Initial height */
  overflow: hidden; /* Hide extra content */
  transition: 0.4s ease-in-out;
}

.mini {
  padding: var(--spacing-sm) !important;	
}
    
.card:hover .blue-linear {
  background: var(--gradient-primary-hover);
}

.card-content p {
  margin-bottom:0px;
}

/* Expanded state on hover for entire card */
.card-expand:hover, .card-expand:focus, .card-content {
  max-height: 200px; /* Allow the content to expand fully */
  overflow: visible;
}

/* Hidden text - truncated state */
.truncate-expand {
  max-height: 1.5rem; 
  white-space: nowrap;       /* Prevent wrapping */        
  text-overflow: ellipsis;
  overflow: hidden;
}

/* Reveal full text on hover when hovering over the entire card */
.card-expand:hover .truncate-expand {
  max-height: 200px;         
  white-space: normal;       /* Allow wrapping */
  overflow: visible;
  transition-delay: 0s;
}

.icon {
/* display: flex;
  align-items: center;
  justify-content: center; */
  min-width: 24px;
  height: auto; /* Sets a fixed height */
}
.icon img, .icon svg {
  width: 100%;
  height: 100%;
  object-fit: contain; /* Ensures the icons maintain aspect ratio */
}



/* Card Hover Effect */
.card:hover {
  transform: scale(1.01);
  transition: all var(--transition-hover);
}

/* End card */



* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    font-size: 100%
}

body {
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: 1rem
}

a {
    color: #005c84
}

@media (min-width: 992px) {
    .mobile-only {
        display:none !important
    }
}

@media (max-width: 992px) {
    .desktop-only {
        display:none !important
    }
}

@media (max-width: 992px) {
    .m-order-0 {
        -webkit-box-ordinal-group:1;
        -webkit-order: 0;
        -ms-flex-order: 0;
        order: 0
    }

    .m-order-1 {
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
        -ms-flex-order: 1;
        order: 1
    }

    .m-order-2 {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -ms-flex-order: 2;
        order: 2
    }

    .m-order-3 {
        -webkit-box-ordinal-group: 4;
        -webkit-order: 3;
        -ms-flex-order: 3;
        order: 3
    }

    .m-order-4 {
        -webkit-box-ordinal-group: 5;
        -webkit-order: 4;
        -ms-flex-order: 4;
        order: 4
    }

    .m-order-5 {
        -webkit-box-ordinal-group: 6;
        -webkit-order: 5;
        -ms-flex-order: 5;
        order: 5
    }

    .m-order-6 {
        -webkit-box-ordinal-group: 7;
        -webkit-order: 6;
        -ms-flex-order: 6;
        order: 6
    }

    .m-order-7 {
        -webkit-box-ordinal-group: 8;
        -webkit-order: 7;
        -ms-flex-order: 7;
        order: 7
    }

    .m-order-8 {
        -webkit-box-ordinal-group: 9;
        -webkit-order: 8;
        -ms-flex-order: 8;
        order: 8
    }

    .m-order-9 {
        -webkit-box-ordinal-group: 10;
        -webkit-order: 9;
        -ms-flex-order: 9;
        order: 9
    }

    .m-order-10 {
        -webkit-box-ordinal-group: 11;
        -webkit-order: 10;
        -ms-flex-order: 10;
        order: 10
    }

    .m-order-11 {
        -webkit-box-ordinal-group: 12;
        -webkit-order: 11;
        -ms-flex-order: 11;
        order: 11
    }

    .m-order-12 {
        -webkit-box-ordinal-group: 13;
        -webkit-order: 12;
        -ms-flex-order: 12;
        order: 12
    }

    .m-order-13 {
        -webkit-box-ordinal-group: 14;
        -webkit-order: 13;
        -ms-flex-order: 13;
        order: 13
    }

    .m-order-14 {
        -webkit-box-ordinal-group: 15;
        -webkit-order: 14;
        -ms-flex-order: 14;
        order: 14
    }

    .m-order-15 {
        -webkit-box-ordinal-group: 16;
        -webkit-order: 15;
        -ms-flex-order: 15;
        order: 15
    }
}

pre {
    padding: 30px;
    background: #eeeeee;
    font-family: 'Courier New', Courier, monospace;
    font-size: 12px;
    overflow: auto;
    max-height: 400px
}

.button--block {
    display: block;
    width: 100%;
    margin: 1rem auto
}

.button--gradient {
    color: #005c84;
    border: solid 1px #c0c0c0;
    border-radius: 5px;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f9fafc), to(#88a0bd));
    background-image: linear-gradient(180deg, #f9fafc 0%, #88a0bd 100%);
    -webkit-box-shadow: inset 0 -1px 2px rgba(255,255,255,0.2);
    box-shadow: inset 0 -1px 2px rgba(255,255,255,0.2)
}

.top-nav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 30px 2rem;
    margin: auto;
    background: #fff
}

@media (max-width: 992px) {
    .top-nav {
        display:none
    }
    .button-dropdown__trigger:after{
		display:none !important;
	}
	.breadcrumbs{
	 display:none;
	}
}

.top-nav__main-nav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.top-nav__mobile-nav {
    display: block;
    height: 50px;
    width: 100%;
    background: red
}

.top-nav__menu {
    padding: 0;
    margin: 0;
    list-style: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.top-nav__logo {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 15%;
    -ms-flex: 0 0 15%;
    flex: 0 0 15%;
    width: 15%;
    padding-right: 30px
}

.top-nav__logo-link {
    display: block;
    width: 100%;
    height: 100%
}

.top-nav__logo-img {
    display: block;
    width: 125%;
    height: auto
}

.top-nav__main-nav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: auto;
    -webkit-flex: auto;
    -ms-flex: auto;
    flex: auto;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.top-nav__search {
    display: block;
    background-color: #ebecec;
    background-image: url("../images/icon-search.svg");
    background-repeat: no-repeat;
    background-position: calc(100% - 15px) center;
    background-size: 24px;
    min-width: 250px
}

.top-nav__search-input {
    display: block;
    height: 2.25rem;
    padding: 0 55px 0 15px;
    width: 100%;
    background: transparent !important;
    border: none;
    outline: none;
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: .85rem;
    line-height: 1.35rem;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0;
}

.top-nav__search-input::-webkit-input-placeholder {
    opacity: 1;
    color: #2a3036
}

.top-nav__search-input:-moz-placeholder {
    opacity: 1;
    color: #2a3036
}

.top-nav__search-input::-moz-placeholder {
    opacity: 1;
    color: #2a3036
}

.top-nav__search-input:-ms-input-placeholder {
    opacity: 1;
    color: #2a3036
}

.top-nav__menu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.top-nav__menu-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-right: 2px solid #2a3036;
    height: 2.25rem;
    padding: 0 5px
}

.top-nav__menu-item-link {
    display: block;
    padding: 5px 10px;
    text-decoration: none;
    border-radius: 2.25rem;
    -webkit-transition: .2s;
    transition: .2s;
    color: #666;
    font-family: Georgia,Constantia,"Lucida Bright",Lucidabright,"Lucida Serif",Lucida,"DejaVu Serif","Bitstream Vera Serif","Liberation Serif",serif;
    font-size: 1rem;
    line-height: .95rem;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0
}

@media (max-width: 1220px) {
    .top-nav__menu-item-link {
        padding:5px
    }
}

.top-nav__menu-item-link:hover {
    background: #005c84;
    color: #fff
}

.top-nav__menu-cart {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    width: 50px;    
}

@media (max-width: 990px) {
    .top-nav__menu-cart {
        margin-right:28px;        
    }
}

.top-nav__menu-cart img {
    display: block;
    height: auto;
    max-width: 30px; /*28px;*/
    width: 75%;
    margin: auto
}

.top-nav__menu-cart:hover .top-nav__menu-cart-badge {
    top: -10px
}

.top-nav__menu-cart-badge {
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    background: #0e0d1a;
    color: #fff;
    font-weight: bold;
    font-size: .75rem;
    border-radius: 50%;
    border: none;
    top: -9px;
    right: 0px;
    -webkit-transition: .2s;
    transition: .2s
}

@media (max-width: 1110px) {
    .top-nav__menu-cart-badge {
        right:-8px
    }
}

.top-nav__user-menu-link {
    font-size: 1rem;
    color: #005c84;
    text-decoration: none;
    font-weight: bold;
    padding: 0 30px;
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: .85rem;
    line-height: 1.35rem;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0
}

@media (max-width: 1110px) {
    .top-nav__user-menu-link {
        -webkit-box-flex:0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        text-align: center
    }

    .top-nav__user-menu-link br {
        display: none
    }
}

.top-nav__user-menu-logout {
    font-size: 1rem;
    color: #005c84;
    text-decoration: none;
    font-weight: bold;
    padding: 5px 25px;
    background-color: #005c84;
    border-radius: 30px;
    color: #fff;
    text-align: center;
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: .85rem;
    line-height: 1.35rem;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0
}


.top-nav__user-menu-icon {
    position: absolute;
    display: block;
    height: 60px;
    margin-top:-25px;
    width: auto;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center bottom;
    object-position: center bottom;
    right:0;
}

@media (max-width: 1440px) {
    .top-nav__user-menu-icon {
        height:40px;
        margin-top:-25px;
        margin-right:5px;
    }
}

@media (min-width: 1600px) {
    .top-nav__user-menu-icon {
        margin-right:20px;
    }
}

.subnav {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: .5rem solid #0e0d1a
}

@media (max-width: 992px) {
    .subnav {
        display:none
    }
}

.subnav__item {
    display: block;
    position: relative;
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    min-width: 192px;
    padding: 1rem 2rem .75rem;
    background: transparent;
    -webkit-transition: .2s;
    transition: var(--transition-hover);
    border-radius: 5px 5px 0px 0px;

}

.subnav__item>a {
    display: block;
    text-align: center;
    color: #2a3036;
    text-decoration: none;
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -.05rem;
    font-size: 1.65rem;
    line-height: 1.5675rem
}

.subnav__item:last-child {
    border: none
}

.subnav__item.active,.subnav__item:active,.subnav__item:hover {
    background: var(--color-primary);
	transition: var(--transition-hover);

}

.subnav__item.active>a,.subnav__item:active>a,.subnav__item:hover>a {
    color: #fff
}

.subnav__item:hover .subnav__dropdown {
    display: block
}

.subnav__dropdown {
    display: none;
    position: absolute;
    z-index: 999;
    top: 100%;
    width: 100%;
    left: 0;
    right: 0;
    background: #fff;
    padding: .5rem 0;
    -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.2);
    box-shadow: 0 3px 5px rgba(0,0,0,0.2)
}

.subnav__dropdown-item {
    display: block;
    padding: .5rem 0.75rem;
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 1.125rem;
    line-height: 1.25rem;
    text-decoration: none;
    color: #2a3036;
    width: 196px;
}

.subnav__dropdown-item:hover {
    background-color: #eaeaea;
    color: #2a3036
}

/* subnav wrap fix*/
.subnav_item-fix:hover{
	width: 196px;
}

.mobile-nav {
    position: relative;
    padding: 0;
    height: 100px;
    display: block
}

@media (min-width: 992px) {
    .mobile-nav {
        display:none
    }
    .button-dropdown__trigger{
		padding-right: 24px;
	}
 }

.mobile-nav__main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin:0.4em;
}

.nav__left {
    flex: 1; /* Occupy remaining space */
}

.nav__right {
    display: flex;
    align-items: center;
}

/* Optional: Hide button-dropdown__trigger by default */
.button-dropdown__trigger {
    display: none;
}

/* Ensure logo remains centered vertically */
.mobile-nav__logo-link {
    display: flex;
    align-items: center;
}

/* Media query to toggle button-dropdown__trigger visibility */
@media screen and (max-width: 768px) {
    .button-dropdown__trigger {
        display: inline; /* Show button-dropdown__trigger on smaller screens */
    }
}
.mobile-nav__logo-link {
    display: block;
    height: 35px;    
 }

.mobile-nav__logo-img {
    display: block;
    height: 100%;
    width: auto;    
}

.mobile-nav__user {
    position: relative;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.mobile-nav__user.open .mobile-nav__user-link:after {
    -webkit-transform: scale(1, -1);
    transform: scale(1, -1)
}

.mobile-nav__user.open .mobile-nav__dropdown {
    display: block
}

.mobile-nav__burger {
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30px;
    -ms-flex: 0 0 30px;
    flex: 0 0 30px;
    width: 35px;
    height: 30px;
    background: white;
    position: relative;
    margin-right: 1rem;
    outline: none
}

.mobile-nav__burger span {
    display: block;
    height: 4px;
    width: 100%;
    background: #005c84;
    position: absolute;
    -webkit-transition: .25s;
    transition: .25s;
    -webkit-transform-origin: center;
    transform-origin: center;
    margin:0.4em;
}

.mobile-nav__burger span:nth-child(1) {
    position: absolute;
    top: 0px
}

.mobile-nav__burger span:nth-child(2) {
    position: absolute;
    top: calc(50% - 6px)
}

.mobile-nav__burger span:nth-child(3) {
    position: absolute;
    top: calc(100% - 12px)
}

.mobile-nav__search {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin:0.4em;
}

.mobile-nav__input {
    display: block;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: #fff;
    background:#ebecec !important;
    padding: 0 1rem 0 2rem;
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: .8rem;
    line-height: 1.3rem;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0;
    border: none;
    border-radius: 1rem 0rem 0rem 1rem;
    height: 2rem;
    -webkit-transition: .2s;
    transition: .2s;
    border: none !important;
}

.mobile-nav__input::-webkit-input-placeholder {
    
    opacity: 1
}

.mobile-nav__input:-moz-placeholder {
   
    opacity: 1
}

.mobile-nav__input::-moz-placeholder {
    
    opacity: 1
}

.mobile-nav__input:-ms-input-placeholder {
   
    opacity: 1
}

.mobile-nav__input:focus {
    background: #acbdc3;
    color: #005c84;
    outline: none
}

.mobile-nav__input:focus::-webkit-input-placeholder {
    color: #fff;
    opacity: 1;
    color: #005c84
}

.mobile-nav__input:focus:-moz-placeholder {
    color: #fff;
    opacity: 1;
    color: #005c84
}

.mobile-nav__input:focus::-moz-placeholder {
    color: #fff;
    opacity: 1;
    color: #005c84
}

.mobile-nav__input:focus:-ms-input-placeholder {
    color: #fff;
    opacity: 1;
    color: #005c84
}

.mobile-nav__jellybean {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50px;
    -ms-flex: 0 0 50px;
    flex: 0 0 50px;
    width: 50px;
    margin-left: 1rem
}

@media screen and (max-width: 380px) {
    .mobile-nav__jellybean {
        display: none;
    }
}


.mobile-nav__jellybean img {
    display: block;
    width: auto;
    height: 40px
}

.mobile-nav__drawer {
    display: block;
    position: fixed;
    z-index: 2147483632;
    top: 185px;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: auto;
    padding: 1rem;
    background: #ebecec;
    -webkit-transform: translate(-100%, 0);
    transform: translate(-100%, 0);
    -webkit-transition: .2s transform;
    transition: .2s transform;
    overflow-x: hidden;
    overflow-y: visible
}

.mobile-nav__drawer-link {
    display: block;
    text-decoration: none
}

.mobile-nav__drawer-link.active {
    border-left: 5px solid #005c84;
    padding-left: 1rem
}

.mobile-nav__drawer-row {
    display: block;
    padding: 1rem 0
}

.mobile-nav__drawer-row:nth-child(1) {
    border-bottom: 1px solid #005c84
}

.mobile-nav__drawer-row:nth-child(2) .mobile-nav__drawer-link {
    font-family: Georgia,Constantia,"Lucida Bright",Lucidabright,"Lucida Serif",Lucida,"DejaVu Serif","Bitstream Vera Serif","Liberation Serif",serif;
    font-size: 1.25rem;
    line-height: 1.1875rem;
    font-weight: normal;
    margin-top: 1rem;   
    letter-spacing: 0;
    color: #005c84
}

.mobile-nav__drawer-row:nth-child(1) .mobile-nav__drawer-link {
    color: #005c84;
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: bold;
    margin-top: 1rem;    
    letter-spacing: 0
}

.has-drawer {
    overflow: hidden !important
}

.has-drawer .mobile-nav__burger span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 28px;
    top: 12px;
    left: 0;
    height: 4px;
    border-radius: 4px
}

.has-drawer .mobile-nav__burger span:nth-child(2) {
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
    opacity: 0
}

.has-drawer .mobile-nav__burger span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 28px;
    top: 12px;
    left: 0;
    height: 4px;
    border-radius: 6px
}

.has-drawer .mobile-nav__drawer {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0)
}

.carousel {
    display: block;
    width: 100%;
    position: relative;
    overflow: hidden
}

.carousel::after {
    content: '';
    position: absolute;
    left: 100%;
    top: 0;
    height: 100%;
    bottom: 0;
    width: 5000px;
    background: rgba(255,255,255,0.85)
}

.carousel.hero {
    position: relative;
    height: 0;
    padding: 0;
    padding-bottom: 29%;
    max-width: initial
}

@media (max-width: 1280px) {
    .carousel.hero {
        padding-bottom:45%
    }
}

@media (max-width: 768px) {
    .carousel.hero {
        padding-bottom:50%
    }
}

@media (max-width: 640px) {
    .carousel.hero {
        padding-bottom:90%;
        max-height: initial
    }
}

.carousel.hero .carousel__slides {
    position: absolute;
    height: 100%;
    min-height: 300px;
    max-height: 600px
}

.carousel.hero .carousel__slide {
    height: 100%;
    background-size: cover;
    background-position: center
}

.carousel.hero .carousel__slide-body {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    margin: auto
}

@media (max-width: 992px) {
    .carousel.hero .carousel__slide-body {
        padding:0 1rem
    }
}

.carousel.hero .carousel__slide-body h2 {
    text-align: center;
    color: #fff;
    text-shadow: 0 0 10px rgba(0,0,0,0.15);
    margin: 0;
    pointer-events: none;
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -.05rem;
    font-size: 6.5rem;
    line-height: 6.0rem
}

.carousel.hero .carousel__slide-body h3 {
    text-align: center;
    color: #fff;
    text-shadow: 0 0 10px rgba(0,0,0,0.15);
    line-height: 4.9rem;
    margin: 0;
    pointer-events: none;
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -.05rem;
    font-size: 5.65rem;
    line-height: 5.3675rem
}

.carousel.hero .carousel__slide-body h4 {
    text-align: center;
    color: #fff;
    text-shadow: 0 0 10px rgba(0,0,0,0.15);
    line-height: 4.9rem;
    margin: 0;
    pointer-events: none;
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -.05rem;
    font-size: 4.5rem;
    line-height: 4.275rem
}

.footer {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background: #666;
    color: #fff;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    max-width: 1280px;
    margin: 4rem auto 0;
}

@media (max-width: 768px) {
    .footer {
        margin-top:.5rem
    }
}

.footer__header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}

.footer__logo {
    display: block;
    margin: -2.25rem auto 0;
    width: 28rem;
    height: auto
}

@media (max-width: 768px) {
    .footer__logo {
        display:block;
        width: 90%;
        margin: 2rem auto 0
    }
}

.footer__title {
    display: block;
    margin: auto
}

.footer__group {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #fff;
    margin-top: 2rem;
    padding: 0 4rem .5rem
}

@media (max-width: 768px) {
    .footer__group {
        padding:0 .5rem
    }
}

.footer__group-title {
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -.05rem;
    font-size: 2rem;
    line-height: 1.9rem
}

.footer__social {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.footer__follow {
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -.05rem;
    font-size: 1.25rem;
    line-height: 1.1875rem;
    color: #fff;
    margin-right: .25rem
}

.footer__social-link {
    display: block;
    margin: 0 .25rem;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.25);
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.25);
    padding: .5rem;
    -webkit-transition: .2s background-color;
    transition: .2s background-color
}

@media (max-width: 768px) {
    .footer__social-link {
        margin:1rem 0;
        width: 30px;
        height: 30px;
        margin-left: 3px
    }
}

.footer__social-link img {
    display: block;
    margin: auto;
    width: auto;
    height: 100%
}

.footer__social-link:hover {
    background-color: rgba(255,255,255,0.1)
}

.footer__links {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    border-bottom: 1px solid #fff;
    width: 100%;
    padding: 0 4rem
}

@media (max-width: 768px) {
    .footer__links {
        padding:0 .5rem
    }
}

.footer__links--no-border {
    border: none
}

.footer__links-card {
    display: block;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30%;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    width: 30%;
    padding: 2rem 2rem 2rem 0
}

@media (max-width: 768px) {
    .footer__links-card {
        -webkit-box-flex:0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: 100%;
        padding: .5rem 0
    }
}

.footer__links-card p {
    line-height: 1.5rem;
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: .8rem;
    line-height: 1.3rem;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0
}

.footer__links-card p a {
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: .8rem;
    line-height: 1.3rem;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0
}

.footer__links-card-title {
    text-transform: uppercase;
    color: #fff;
    margin: 0 0 1rem
}

.footer__card-link {
    display: block;
    color: #fff;
    margin-bottom: .5rem;
    -webkit-transition: .2s text-decoration;
    transition: .2s text-decoration;
    -webkit-text-decoration: underline solid transparent;
    text-decoration: underline solid transparent;
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: 0.8rem;
    line-height: 1.3rem;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0
}

.footer__card-link:hover {
    -webkit-text-decoration: underline solid #fff;
    text-decoration: underline solid #fff
}

.footer__quicklinks {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 2rem 0
}

.footer__quicklinks-link {
    text-align: center;
    color: #fff;
    font-weight: bold;
    padding: 0 1rem;
    border-right: solid 3px #fff;
    -webkit-transition: .2s text-decoration;
    transition: .2s text-decoration;
    -webkit-text-decoration: underline solid transparent;
    text-decoration: underline solid transparent;
    font-family: Georgia,Constantia,"Lucida Bright",Lucidabright,"Lucida Serif",Lucida,"DejaVu Serif","Bitstream Vera Serif","Liberation Serif",serif;
    font-size: 1rem;
    line-height: .95rem;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0
}

.footer__quicklinks-link:hover {
    -webkit-text-decoration: underline solid #fff;
    text-decoration: underline solid #fff
}

.footer__quicklinks-link:last-child {
    border: none
}

.footer__copyright {
    display: block;
    text-align: center;
    padding-bottom: 1rem;
    font-family: Georgia,Constantia,"Lucida Bright",Lucidabright,"Lucida Serif",Lucida,"DejaVu Serif","Bitstream Vera Serif","Liberation Serif",serif;
    font-size: 1rem;
    line-height: .95rem;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0
}

.footer__serverid {
	display:block;
	text-align:center;
	padding-bottom:.25rem;
}

.hero {
    background: -webkit-gradient(linear, left top, left bottom, from(#979797), to(#757575));
    /*background: linear-gradient(#979797, #757575);*/
    background: rgb(0,92,132);
    padding: 4rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: auto;
    width: 100%;
    max-width: 1280px;
    min-height: 15rem
}

.split__main {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.split__aside {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 30%;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    /*width: 30%*/
}

@media (max-width: 992px) {
    .split__aside {
        -webkit-box-flex:0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        width: 100%
    }
}

.split__inset {
    display: block;
    margin: -10.5rem 2rem 0 1rem;
    height: 100%
}

@media (max-width: 992px) {
    .split__inset {
        display:-webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        margin: auto;
        width: 80%
    }
}

@media (max-width: 992px) and (max-width: 640px) {
    .split__inset {
        width:100%
    }
}

.split__inset--normal {
    margin-top: 0px;
}

.button-dropdown {
    display: flex;
    float:right;
    max-width: 250px;
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 0;
    margin-right:50px;
    letter-spacing: -.05rem;
    font-size: 1rem;
    line-height: .95rem;
    position: relative;
    background-color:#416a22;
    padding:10px 14px 10px 14px;
    border-radius:10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    text-decoration:none;
    
}

@media (max-width: 1444px) {
    .button-dropdown {
        position:absolute;
        margin-left:-130px;
        margin-top:20px;
        min-width:135px;
    }
   
}

.button-dropdown__trigger {
    color: #ffffff;
    display: block;
    position: relative;    
    margin-right: 5px;
    text-decoration: none;
    outline: none;
    line-height: .85rem !important;
    text-align:right;
}

.button-dropdown__trigger span {
    font-family: "ff-din-web-condensed-n6","ff-din-web-condensed-1","ff-din-web-condensed-2";
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -.05rem;
    font-size: 1.1rem;
    line-height: 1.045rem;
    line-height: 1.1rem !important;
}

.button-dropdown__trigger:hover {
    text-decoration:none;
    color:#d3ebc0;

}

@media (max-width: 992px) {
    .button-dropdown__trigger br {
        display:none;
    }
}

.button-dropdown__trigger:after {
    content: '';
    position: absolute;
    display: block;
    -webkit-transition: .2s;
    transition: .2s;
    top: calc(50% - 12px);
    -webkit-transform-origin: center;
    transform-origin: center;
    right: 0;
    width: 16px;
    height: 20px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("/images/icons/arrow-down-minimal.svg")
}

.button-dropdown__body {
    display: none;
    position: absolute;
    top: 100%;
    margin-top: 7px;
    right: 0;
    z-index: 999;
    width: 200px;
    background: #fff;
    padding: 1rem 0;
    border: solid 1px #cad5d8;
    -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    border-radius: 4px;
    z-index: 9999999;
    text-align:left;
}

.button-dropdown__link {
    display: block;
    text-decoration: none;
    color: #2a3036 !important;
    font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
    font-size: .85rem;
    line-height: 1.35rem;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: 0;
    padding: 5px .5rem
}

.button-dropdown__link:hover {
    color: #2a3036;
}

.button-dropdown.open .button-dropdown__trigger:after {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.button-dropdown.open .button-dropdown__body {
    display: block
}
/* Need to add a specific class inside of the template to target only State Bar/Section Blogs*/
@media only screen and (max-width: 480px) {
	div.sb-section-blogs > div > h1 {
	    text-align: center;
	}	
}

/* Cart Items styling */
span#CartItems{
    width: 24px;
    height: auto;
    margin-top: -31px;
    margin-left: -24px;
 }
 
span#CartItems, span#mobileCartItems{
    background-color: #426A1F;
    color: #fff;
    font-size: 12px;
    border-radius: 50%;
    justify-content: center;
}

@media screen and (max-width: 992px) {
  span#mobileCartItems{
    left: 50%;
    margin-top:-67%;
  }
  .top-nav__menu-cart img {
  	margin-bottom:-5px
  }
}


/* Google Translate Turned On - Responsiveness */
/* .translated-ltr */
@media (max-width: 1772px) {
    .translated-ltr .top-nav__menu-item-link{
		font-size: 0.75rem;
		transition: .2s;
	}
}

@media (max-width: 1484px) {
    .translated-ltr .top-nav__menu-item-link{
		font-size: 0.73875rem;
    	line-height: .70181rem;
		transition: .2s;
	}
}
/*Translation on styles*/
.translated-ltr .top-nav__logo-img{
    width: 100%;
}