:root {
	--primary-color: #13294B;
    --secondary-color: #B4610E;
    --top-banner-bg-color: #FF5F05;
    --accent-color: #E4f6ff;
    --topic-menu-bg-color-hover: #F0F0F0;
    /* LINK COLORS */
    --primary-links-color-hover: #B4610E;
    --secondary-links-color-hover: #B4610E;
    --footer-link-color: #C4C4C4;
    --footer-link-color-hover: #F09336;
    /* BUTTON COLORS - PRIMARY */
    --primary-button-color: #13294B;
    --primary-button-color-hover: #002E47;
    --primary-button-text-color: #FEFEFE;
    --primary-button-text-color-hover: #FEFEFE;
    --primary-button-border-color: #13294B;
    --primary-button-border-color-hover: #002E47;
    /* BUTTON COLORS - SECONDARY */
    --secondary-button-color: #E4F6FF;
    --secondary-button-color-hover: #001623;
    --secondary-button-text-color: #13294B;
    --secondary-button-text-color-hover: #FEFEFE;
    --secondary-button-border-color: #13294B;
    --secondary-button-border-color-hover: #13294B;
    /* NAVIGATION COLORS */
    --nav-bg-color: #13294B;
    --nav-tab-color: #FEFEFE;
    --nav-tab-color-hover: #F09336;
    --nav-link-color: #13294B;
    --nav-link-color-hover: #B4610E;
    /* HEADING/BANNER BACKGROUND COLORS */
    --bg-color-1: #13294B;
    --bg-color-2: #FF5F05;
    --bg-color-3: #BFC9D9;
    /* HEADING/BANNER BACKGROUND COLORS WITH TRANSPARENCY */
    --rgba-color-1: rgb(19 41 75 / .75);
    --rgba-color-2: rgb(255 95 5 / .75);
    --rgba-color-3: rgb(145 197 0 / .5);
    /* FONT FAMILY */
    --font-family-heading: "Montserrat", sans-serif;
    --font-family-body: "Source Sans 3", sans-serif;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 700;
}

#top-banner {
    color: #13294B;
}

.home-announcements h3 span,
.recommended-products h2 span {
    color: #fff;
}

/* START LEGACY STYLES FOR VENDOR BLOCK */
#home .block-onecol {
	margin:-.1em 1% 1.1em 1%;
	padding:1em 1.5%;
	/*float:left;*/
	vertical-align:top;
	display:inline-block;
	border:1px #dddddd solid;
	-webkit-box-ordinal-group: 1;
    -moz-box-ordinal-group: 1;
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 1 300px;
    -ms-flex: 1 1 300px;
    flex: 1 1 300px;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    min-width:0;
    box-shadow: 2px 6px 31px -19px rgba(0, 0, 0, 0.28);
}

.vendor-block,
.vendor-block a {
	text-align:center;
}

.vendor-block {
	width:100%;
	padding:0;
	display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 1.1em;
}

.vendor-block .block-onecol,
#home .vendor-block .block-onecol,
.vendor-block .block-twocol,
#home .vendor-block .block-twocol {
	text-align:center;
	padding:.25em;
	display:block;
}

.vendor-block .block-onecol,
#home .vendor-block .block-onecol {
	-webkit-box-ordinal-group: 1;
    -moz-box-ordinal-group: 1;
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1 1 225px;
    -ms-flex: 1 1 225px;
    flex: 1 1 225px;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    min-width:0;
}

.vendor-block img {
	max-width:100%;
    border-radius: .75em;
}
/* END LEGACY STYLES FOR VENDOR BLOCK */

/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR MEDIUM SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */
@media screen and (min-width: 40em) {
    .caption-container.caption-left .caption,
    .caption-container.caption-right .caption {
    top: 65%; /* to reset back to default, set at 50% or delete this rule entirely */
    }
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 64em) {
    .mega-menu > li > ul > li, .mega-menu > li > ul > .column {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
    }
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR X-LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 75em) {
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR XX-LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 90em) {
}