﻿:root {
	--primary-color: #13294B;
    --secondary-color: #f09336;
	--top-banner-bg-color: #FF5F05;
	--accent-color: #E4f6ff;
	--topic-menu-bg-color-hover: #F0F0F0;
	/* LINK COLORS */
	--primary-links-color-hover: #f09336;
	--secondary-links-color-hover: #f09336;
	--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: #005E91;
	--secondary-button-text-color-hover: #FEFEFE;
	--secondary-button-border-color: #005E91;
	--secondary-button-border-color-hover: #005E91;
	/* NAVIGATION COLORS */
	--nav-bg-color: #13294B;
	--nav-tab-color: #FEFEFE;
	--nav-tab-color-hover: #F09336;
	--nav-link-color: #13294B;
    --nav-link-color-hover: #f09336;
	/* HEADING/BANNER BACKGROUND COLORS */
	--bg-color-1: #FF5F05;
    --bg-color-2: #13294B;
    --bg-color-3: #707372;
	/* HEADING/BANNER BACKGROUND COLORS WITH TRANSPARENCY */
	--rgba-color-1: rgb(6 147 178 / .5);
	--rgba-color-2: rgb(212 128 0 / .5);
	--rgba-color-3: rgb(145 197 0 / .5);
	/* FONT FAMILY */
	--font-family-heading: "Oswald", sans-serif;
	--font-family-body: "Noto Sans", sans-serif;
}

#top-banner {
    background-color: #FF5F05;
    color: #000;
}

.block-featureditems h3 {
    color: #fff;
}

.block-popularitems h3 {
    color: #fff;
}

.compare-block {
    border-radius: var(--border-radius-lg);
    overflow: clip;
    position: relative;
    box-shadow: 0 13px 13px -12px rgb(0 0 0 / .5);
    padding: 1.4em;
    border: 1px solid #eee;
}

#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;
}

.checkout-shipping-extra {
    padding: 1em;
    box-shadow: 2px 6px 31px -19px rgba(0, 0, 0, 0.28);
    border-radius: 1em;
    border: 1px solid #ebebeb;
    background: #f7f4f1;
}

.shop-main-home .catalog-name {
    background: #13294b;
}

.slide-item .captions {
    background: #d1e3fd;
    color: #202020;
    backdrop-filter: none;
    text-shadow: none;
    font-size: 1rem;
}

.shop-main-home .catalog-group-image-container {
    border-radius: 1.1em;
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR MEDIUM SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */
@media screen and (min-width: 40em) {
    
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 64em) {

}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     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) {
}
