* { box-sizing: border-box; }
body { background-color: #fff; font-family: sans-serif; font-size: 1em; padding: 0; margin: 0; }
form { padding: 0px; margin: 0px; }
a:link { color: #101a4f; text-decoration: none; }
a:visited { color: #101a4f; text-decoration: none; }
a:hover { color: #006699; text-decoration: none; }
a:active { color: #d56600; text-decoration: none; }
img { max-width: 100%; height: auto; }
.clear { clear: both; }

#page { margin: auto; background-color: #fff; }

#pre-head { background-color: #153b68; padding: 4px; margin-bottom: 16px; color: #fff; text-align: center; color: #fff; font-weight: bold; font-size: 1em; }

#head { max-width: 1440px; margin: 0px auto; background-color: #fff; position: relative; text-align: center; }
	#logo { display: inline-block; vertical-align: middle; }
	#welcome { display: inline-block; vertical-align: middle; padding: 24px 0; position: relative; text-align: right; color: #163b67; font-size: 1.2em; }
		#help { color: #1b4f8b; vertical-align: middle; }
		#help img { vertical-align: middle; }
		#uwelcome { vertical-align: middle;}
	#search { display: inline-block; vertical-align: middle; padding: 0 75px; }
		.circbutt { height: 40px; width: 40px; background-color: transparent; border-radius: 50%; border: 0; cursor: pointer; font-size: 1.25em; color: #999; font-family: "Segoe UI Symbol"; vertical-align: middle; margin-top: 4px; padding-left: 10px; }
		#searchinput { width: 600px; height: 50px; border: 1px solid #ccc; border-radius: 50px; position: relative; vertical-align: middle; box-shadow: 2px 2px 4px #999; }
		#search-input { width: 535px; vertical-align: middle; margin-top: 3px; margin-left: 12px; font-size: 1.1em; border: 0; }
		#search-input:focus-visible { outline: -webkit-focus-ring-color auto 0px; }
	#account { display: inline-block; vertical-align: middle; padding: 0 0 10px 10px; }
		.acct-link { display: inline-block; text-align: center; color: #12194d; padding: 0 8px; vertical-align: middle; }
		#topcart-left { position: relative; vertical-align: middle; }
		#cartnum { position: absolute; top: 1px; left: 29px; color: #fff; }
		#cartnum2 { position: absolute; top: 3px; left: 26px; color: #fff; font-size: .825em; }

#main { margin: 0px auto; background-color: #fff; position: relative; padding: 10px 0 20px 0; }
	#container { max-width: 1440px; margin: 0px auto; }

	#col-2-sec { background-color: #586a82; text-align: center;  aspect-ratio: 3.6 / 1; height: auto; }
	#col-2-1 { display: inline-block; padding: 32px 16px 32px 16px; aspect-ratio: 2 / 1; height: auto; }
	#col-2-2 { display: inline-block; padding: 32px 16px 32px 16px; aspect-ratio: 2 / 1;  height: auto; }

	#col-2-1 img { aspect-ratio: 2 / 1; height: auto; }
	#col-2-2 img { aspect-ratio: 2 / 1;  height: auto; }

	#short-banner a { display: flex; }
	#banner3a { padding: 0 !important; }

	#custom1-feature h2 { font-size: 2.5em; margin: 0.33em; }
	.custom1 { display: inline-block; margin: 8px; max-width: calc(100vw - 60px); }
	.custom1 a > span { display: block; }

	.group1 { border: 1px solid #ccc; border-radius: 25px; overflow: hidden; max-width: 259px; vertical-align: top; }
	.group1 > a > span:nth-child(2) {
		color: red;
		text-align: left;
		font-size: 1.5em;
		padding: 8px 20px;
		font-weight: bold;
	}

	.group1 > a > span:nth-child(3) {
		text-align: left;
		font-size: 1.25em;
		padding: 0px 20px 16px 20px;
	}

	.group2 > a > span:nth-child(2) {
		font-size: 1.5em;
		padding: 8px;
		font-weight: bold;
	}

	.group2 > a > span:nth-child(3) {
		font-size: 1.25em;
		padding: 0px 8px;
	}

	#top-sellers h2 {
		margin: 0.83em 0.33em 0.33em 0.33em;
		font-size: 2.5em;
	}

	.topsell { display: inline-block; background-color: #fff; padding: 30px 8px; vertical-align: middle; font-size: 1.25em; text-align: center; max-width: 242px; }
	.topsell a > span { display: block; }

	#newest_items {
		text-align: center; background-color: #f8f8f8; padding: 8px;
	}

	.newhead { display: inline-block; position: relative; vertical-align: middle; color: #3b3b3b; }
	.newhead h2 { font-size: 2.5em; }

	#featured-categories h2 { font-size: 2.5em; }

	.mainimg { display: inline-block; background-color: #fff; vertical-align: middle; font-size: 1.25em; text-align: center; max-width: 1440px; }

	.newitem { display: inline-block; background-color: #fff; padding: 30px 8px; vertical-align: middle; font-size: 1.25em; text-align: center; max-width: 242px; border: 1px solid #dedede; }
	.newitem a > span { display: block; }

	#testimonials {}
	.feat-review { display: inline-block; border: 1px solid #ccc; border-radius: 3px; max-width: 30%; vertical-align: top; padding: 12px; margin: 12px; min-height: 300px; }

	.feat-title { color: #999; font-size: .75em; }
	.feat-name { color: #999; font-size: .75em; }
	.feat-comment { font-style: italic; padding: 8px 0; min-height: 120px; }
	.feat-thumb { float: right; }
	.feat-thumb img { max-height: 96px; }
	.feat-stars { margin-top: 8px; }
	.feat-itemname {  }

.featured-category { min-height: 380px; margin-bottom: 20px; }
.feat-banner { float: left; padding-right: 32px; }

.fcat { display: inline-block; padding: 8px; }

.fcat img {
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    outline: 75px solid rgba(0, 128, 164, 0.33) !important;
    outline-offset: -75px;
    height: 150px;
    width: 150px;
}

.breadcrumb {
    font-size: .75em;
    padding: 10px 30px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    max-width: 1440px;
    margin: 0 auto;
}

.breadcrumb a {
    color: #666;
}

#content { margin: auto; max-width: 1440px; }

.userpage { background-color: #f8f8f8; }

#content {
    background-color: #f8f8f8;
    padding: 12px 40px 40px 40px;
}

#contentpage {
    background-color: #fff;
    padding: 1px 40px 24px 40px;
    border: 1px solid #ccc;
}

#footer { margin: 0px auto; position: relative; text-align: center; font-weight: bold; }
#footer-inside { max-width: 1440px; margin: 0px auto; position: relative; color: #fff; }
#footer-inside a { color: #fff; }
	#footer-info { border: 1px solid #39597f; display: inline-block; margin: 16px; vertical-align: top; padding: 18px; border-radius: 6px; min-width: 305px; }
	#footer-info span { display: block; padding: 8px 0; }
	.footer-cols { display: inline-block; margin: 16px; padding: 18px; vertical-align: top; }
	.footer-cols span { display: block; padding: 8px 0; }
	.foot-head { font-size: 1.5em; font-weight: bold; padding: 0 !important; }
	.bubble { float: left; height: 37px; width: 37px; background-color: #fff; border-radius: 50%; border: 0; cursor: pointer; vertical-align: middle; margin-right: 8px; margin-bottom: 20px; }
	.bubble img { margin-left: 7px; margin-top: 1px; }
	.faqicon { float: left; margin-right: 8px; padding: 0 !important; }
	#footer-middle {  margin: auto; text-align: center; } 
	#topreturn { height: 37px; width: 37px; background-color: #2ee4cd; border-radius: 50%; border: 0; cursor: pointer; vertical-align: middle; display: inline-block; color: #fff; font-size: 2em; padding-top: 6px;  }

	#footer-bottom { position: relative; color: #fff; }
	#footer-colophon { margin: 24px; padding: 18px; display: inline-block; vertical-align: middle; }
	#footer-copyright { padding: 18px; display: inline-block; text-align: center; font-size: .75em; vertical-align: middle;  }
	#footer-tagline { display: inline-block; vertical-align: middle; padding-left: 100px; }
	#bottomlogo {  }
	#footer-bottom2 { padding: 50px 0; text-align: center; font-size: .75em; border-top: 1px solid #2b4c77; border-bottom: 1px solid #2b4c77; }

.navimg { padding: 2px 24px 2px 2px !important; width: 416px; min-height: 500px; margin-left: 180px !important; }
#nav {
	position: relative;
	z-index: 101;
	display: flex;
}

	#nav > a {
		display: none;
	}

	#nav li {
		
	}
		#nav li a {
			color: #e36c0a;
			display: block;
			text-decoration: none;
		}
		#nav li a:active {
			background-color: rgba(192,192,192,0.8) !important;
		}

	/* first level */

	#nav > ul {
		list-style:none;
		margin: 0;
		padding: 0;
		margin: auto;
	}
	#nav > ul > li {
		float: left;
	}
	#nav > ul > li > a {
		font-weight: bold;
		text-align: center;
		padding: 8px 23px;
		color: #101a4f;
		transition: all 0.3s ease;
	}

	#nav > ul > li:hover > a,
	#nav > ul:not( :hover ) > li.active > a {
		color: #ee0ea2;
	}

	/* second level */

	.navline { padding: 12px; font-size: 1.5em; font-weight: bold; }

	#nav li > ul {
		background-color: #f3f0f4;
		position: absolute;
		list-style:none;
		padding: 0;
		max-height:0px;
		opacity: 0;
		overflow: hidden;
		margin: auto;

		display: flex;
		flex-direction: column;
		flex-wrap: wrap;
		align-content: flex-start;

	}

	.nwide li {  }

	#nav li ul li {
		padding: 2px;
		float: left;
		min-width: 340px;
	}

	#nav li:hover > ul {
		max-height: 500px;
		left: 0;
		right: 0;
		transition: max-height .3s ease-in, opacity .3s ease-in .1s;
		opacity: 1;
	    box-shadow: 0px 4px 6px 0px #0006;
		padding-top: 8px;
	}
	#nav li:hover > #catmenuid1567 { max-height: 260px; }
	#nav li:hover > #catmenuid1587 { max-height: 260px; }
	#nav li:hover > #catmenuid1568 { max-height: 260px; }
	#nav li:hover > #catmenuid486 { max-height: 260px; }
	#nav li:hover > #catmenuid1569 { max-height: 260px; }
	#nav li:hover > #catmenuid1571 { max-height: 260px; }

	#nav li > ul a {
		font-weight: bold;
		font-size: .825em;
		padding: 6px 12px;
		color: #101a4f;
	}
	#nav li ul > li a:hover,
	#nav li ul:not( :hover ) li.active a {
		color: #ee0ea2;
		transition: all 0.3s ease;
	}


@media only screen and ( max-width: 1800px )
{
.navimg { margin-left: 100px !important }
}

@media only screen and ( max-width: 1700px )
{
.navimg { margin-left: 50px !important }
}

@media only screen and ( max-width: 1600px )
{
.navimg { margin-left: 35px !important }
}


@media only screen and ( max-width: 1460px )
{
	.navimg { margin-left: 0 !important }

	#search { display: inline-block; vertical-align: middle; padding: 0 40px; }
		#searchinput { width: 450px; height: 50px; border: 1px solid #ccc; border-radius: 50px; position: relative; vertical-align: middle; box-shadow: 2px 2px 4px #999; }
		#search-input { width: 385px; vertical-align: middle; margin-top: 3px; margin-left: 12px; font-size: 1.1em; border: 0; }
	#account { display: inline-block; vertical-align: middle; padding: 10px; }

	#nav > ul > li > a {
		padding: 8px 13px;
	}

	.breadcrumb {
	    padding: 8px 16px;
	}
	.category {
	    padding: 0;
	}

}

@media only screen and ( max-width: 1360px )
{
	.navimg { min-height: 640px; }

	#nav li:hover > ul {
		max-height: 640px;
	}

}

@media only screen and ( max-width: 1240px )
{
	#searchinput {
		width: 300px;
	}
	#search-input {
		width: 236px;
	}

	#nav > ul > li > a {
		padding: 8px;
		font-size: .875em;
	}

}

@media only screen and ( max-width: 1100px )
{
	.navimg { min-height: 720px; }

	#nav li:hover > ul {
		max-height: 720px;
	}

	#search {
		padding: 0 4px 0 10px;
	}

}

@media only screen and ( max-width: 1040px )
{
	.navimg { width: 250px; }
	#nav li ul li {
		min-width: auto;
	}

}

@media only screen and ( max-width: 1024px ) 
{

	#pre-head { font-size: .75em; }

	#logo { max-width: 80px; }
	#welcome { text-align: left; }
	#search { display: block; padding: 8px; }
	#searchinput { width: 100%; }
	#search-input { width: calc(100% - 60px); }
	#account { display: block; text-align: center; }

	#main {
		padding: 4px 0;
	}

	#col-2-sec {
		display: block;
	}

	#col-2-1 { padding: 8px; display: block; }
	#col-2-2 { padding: 0 8px 8px 8px; display: block; }

	#custom1-feature h2 { font-size: 2em; margin: 0.1em; }
	
	.group2 { max-width: 45%; }

	#newest_items {
		text-align: center; background-color: #f8f8f8; padding: 8px;
	}

	.newhead { display: block; padding-right: 0; }

	.newhead h2 { margin-top: 8px; }

	.newitem { vertical-align: top; }

	.feat-review { max-width: auto; }

	.navimg { padding: 0 !important; min-height: auto; width: auto; }

	#content {
	    padding: 12px 8px;
	}

	#contentpage {
	    padding: 1px 8px 24px 8px;
	}

	#nav {
		position: absolute;
		top: 0;
		left: 0;
		width:100%;
	}
	#nav > a {
		width: 40px;
		height: 40px;
		text-align: left;
		background-color: transparent;
		position: absolute;
		right: 3px;
		top: 30px;
	}

	#nav:not( :target ) > a:first-of-type,
	#nav:target > a:last-of-type {
		display: block;
	}

	/* first level */
	#nav > ul {
		height: auto;
		display: none;
		position: absolute;
		left: 0;
		right: 0;
		top: 128px;
		background-color: rgba(255,255,255,255.9);
		width: 100%;
		margin: 0; padding: 0;
		box-shadow: 0px 7px 12px 0px #000c;
	}
	#nav:target > ul {
		display: block;
		background-color: rgba(255,255,255,255.9);
	}
	#nav > ul > li {
		float: none;
		background-color: rgba(255,255,255,255.9);
	}
	#nav > ul > li > a {
		text-align: left;
		color: #000;
		font-size: 1.25em;
	}

	#nav > ul > li:not( :last-child ) > a {
		border-right: none;
		border-bottom: 1px solid #999;
	}

	/* second level */

	#nav li:hover > ul {
		max-height: 100%;
	    padding-bottom: 12px;
	}

	#nav li ul {
		position: static;
		padding: 0;
		z-index: 10000;
	}

	.nwide li { float: none; width:auto; }

	#nav li ul li {
		padding: 2px 12px;
		float: none;
		min-width: auto;
	}

	#nav li ul a {
		font-size: 1em;
		padding: 4px 0;
		text-indent: 4px;
	}

	#nav li:hover > #catmenuid1567 { max-height: none; }
	#nav li:hover > #catmenuid1587 { max-height: none; }
	#nav li:hover > #catmenuid1568 { max-height: none; }
	#nav li:hover > #catmenuid486 { max-height: none; }
	#nav li:hover > #catmenuid1569 { max-height: none; }
	#nav li:hover > #catmenuid1571 { max-height: none; }

}

@media only screen and ( max-width: 640px ) 
{
	#pre-head { font-size: .67em; }
}
@media only screen and ( max-width: 360px ) 
{
	#footer-info { min-width: auto; margin: 0px; padding: 8px; width: 100%; }
}