/*
Title: "Argecy.com" responsive screen styles
--
Date Modified: 5/24/2023
Date Created: 2/15/2016
--
Author: Fervr Design
Contact: http://fervr.co/contact
--
Table of Contents:
	layout
	navigation
	typography
	alignment
	misc
*/



/* layout 
------------------------------------- */

/* fix box model */
*, *:before, *:after {
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}

body {
	background: #fff;
	/* margin: 7px; */
	}

	
/* 4 column grid */	
.row {
	/* 
	clear: both;
	overflow: hidden;
	*/
	
	display: inline-block;
	}
.row:after {
    content: " ";
    display: block;
    height: 0;
    clear: both;
    overflow: hidden;
    visibility: hidden;
}
.row {
    display: block;
}

/* 4 column grid (default) */
.column {
	width: 25%;
	float: left;
	margin: 0;
	padding: 0;
	}
	
.column.span2 {
	width: 50%;
	}

.column.span3 {
	width: 75%;
	}

.column.span4 {
	width: 100%;
	}


/* 3 column grid (overrides 4 column grid default) */
.grid-3-columns .column {
	width: 33.3%;
	}

.grid-3-columns .column.span2 {
	width: 66.6%;
	}

.grid-3-columns .column.span3 {
	width: 100%;
	}


/* 12 column grid (overrides 4 column grid default) */
.grid-12-columns .column {
	width: 8.33%;
	}

.grid-12-columns .column.span2 {
	width: 16.66%;
	}

.grid-12-columns .column.span3 {
	width: 24.99%;
	}
	
.grid-12-columns .column.span4, 
.grid-style-product-list > ul {
	width: 33.32%;
	}
	
.grid-12-columns .column.span5 {
	width: 41.65%;
	}
	
.grid-12-columns .column.span6 {
	width: 49.98%;
	}
	
.grid-12-columns .column.span7 {
	width: 58.31%;
	}
	
.grid-12-columns .column.span8 {
	width: 66.64%;
	}
	
.grid-12-columns .column.span9 {
	width: 74.97%;
	}
	
.grid-12-columns .column.span10 {
	width: 83.3%;
	}
	
.grid-12-columns .column.span11 {
	width: 91.63%;
	}
	
.grid-12-columns .column.span12 {
	width: 99.96%;
	}


/* section-specific grid styles */
#related-products .column-content {
	margin: 5px 0 !important;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
	}
#related-products .column {
	float: none;
	flex: 0 1 200px; /* 1 1 180px */
	}
#related-products .announcement, 
#related-products .product-retired, 
#related-products .product-make-offer {
	display: none !important;
	}


#logo.column {
	/* width: 260px; */
	}

#main-header-phone.column {
	/* width: 171px; */
	}

#main-header-email.column {
	/* width: 216px; */
	}
	
#main-header-nav.column {
	}	

#main-header-phone.column .column-content, 
#main-header-email.column .column-content, 
#main-header-nav.column .column-content {
	margin: 0;
	padding: 8px 0 0;
	}

#main-header-phone.column .column-content {
	
	}

#main-header-email.column .column-content {
	
	}

#main-header-nav.column .column-content {
	
	}


#main-search-button {
	padding: 0;
	float: right;
	}	

/*
#main-header-search form {
	width: 203px;
	padding: 0;
	margin-top: 15px;
	}
*/	
#main-header-search form {
    max-width: 250px;
    width: auto;
    padding: 0;
    margin-top: 15px;
    position: relative;
	}


#main-header-search form input[type="text"] {
	height: 35px;
	width: 100% !important;
	padding: 3px 35px 3px 7px;
	margin: 0;
	-webkit-appearance: none;
	appearance: none;
	outline: none;
   	border: 1px solid rgba(0,0,0,0.25);
    border-radius: 5px;
	}


#main-header-search form .msb-wrapper, 
.search-box > #main-header-search form .msb-wrapper {
	display: block;
    padding: 0;
    position: absolute;
    top: 0;
    right: 0;
    height: 35px;
    width: 35px;
    background: #f3d078;
    background: -webkit-linear-gradient(top,#f7dfa5,#f0c14b);
    background: linear-gradient(to bottom,#f7dfa5,#f0c14b);
    border: 1px solid rgba(0,0,0,0.25);
    border-radius: 0 5px 5px 0;
	}

#main-header-search form .msb-wrapper #main-search-button, 
.search-box > #main-header-search form .msb-wrapper #main-search-button {
	display: block;
    padding: 0;
    float: none;
    position: absolute;
    top: 7px;
    right: 5px;
	}

.search-box > #main-header-search { /* for mobile search box */
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
}

#main-header-sitemap a {	
    width: auto;
    margin-top: 0;
    font-size: 12px !important;
    font-weight: normal;
    }




#main-wrapper .row > .column {
	min-height: 480px;
	}

#main-content .product-overview .column {
	min-height: auto;
	}

#main-sidebar.column .column-content {
	margin: 5px;
	}
 
#main-content.column .column-content {
	margin: 10px;
	}


/* main header */
#main-header {
	background: url(/images/topbg.jpg) 0 0 repeat-x;
	margin: 0;
	padding: 0;
	height: 73px;
	overflow: hidden;
	clear: both;
	}

/* main search */
#main-search {
	display: none;
	}


/* main sidebar */
#main-sidebar {
	background: #fff;
	border-right: none; /* 1px solid #eaeaea; */
	/* max-width: 200px; */
	}

#sidebar-nav {
	margin: 20px 0 !important;
	border: 1px solid #dedede;
	border-radius: 5px;
	}	
	
#sidebar-nav li {
	border-bottom: 1px solid #dedede;
	}

#sidebar-nav li:last-child {
	border-bottom: none;
	}

	
/* redbox - sidebar promo */	
#main-sidebar .redbox {
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 0;
    position: relative;
    background: #f4f1e9; /* rgba(255,123,0,0.06); #ffcccc; */
    box-shadow: 2px 3px 7px rgba(0,0,0,0.15);
    width: 100%;
    
	margin: 5px 0 30px;
	}
	
#main-sidebar .redbox .column-content {
	padding: 5px 5px;
	}
	



/* main content */
#main-content {
	background: #fff;
	}



/* main footer */
#main-footer {
	clear: both;
	background: #702829;
	margin: 0;
	padding: 5px 0;
	}
	
#main-footer-nav {
	height: 35px;
	border-bottom: 1px solid #fff;
	}



/* navigation 
------------------------------------- */

a, 
a:link {
	color: #1a73a9; /* #6c2a2c */ 
	text-decoration: none;
	}

a:hover  {
	color: #125883; /* #f00 */
	text-decoration: underline;
	}

:link:focus, 
:visited:focus { 
	outline: none; 
	} 

#main-header a {
	color: #6c2a2c;
	}

#main-header a:hover {
	color: #f00;
	}

#main-footer a {
	color: #fff;
	}
	
#main-footer a:hover {
	color: #f9dabf;
	text-decoration: underline;
	}		

#main-header .menu-trigger {
	display: none;
	position: absolute;
	top: 15px;
	width: 42px;
	height: 42px;
	background-color: rgba(0,0,0,0.07);
	border: 1px solid #712826;
	border-radius: 3px;
	
	cursor: pointer;
	}

#main-header .menu-trigger .fa {
	font-size: 32px;
	text-align: center;
	position: absolute;
	top: 5px;
	left: 7px;
	color: #712826;
	}

#main-header .menu-trigger:hover {
	background-color: rgba(255,255,255,0.20);
	}
	
#main-header #menu-trigger-main.menu-trigger {
	left: 7px;
	}

#main-header #menu-trigger-account.menu-trigger {
	right: 7px;
	}


#sidebar-nav .menu-item-selected {
	background-color: #d1e7f6 /* #dedede */;
	}
#sidebar-nav a:hover {
    background-color: rgba(209,231,246,0.3) /* rgba(0,0,0,0.05) */;
	}

#sidebar-nav .menu-item-selected, 
#sidebar-nav a {
    display: block;
    padding: 10px 0 10px 10px;
	}
	


/* typography 
------------------------------------- */
body {
	font: normal 1rem/1.3 arial, helvetica, sans-serif; /* 12.5px */
	color: #040004;
	}

/* list styles */	
.no-bullet {
	list-style-type: none;
	margin-left: 0;
	padding: right: 0;
	}

#main-header {
	font-size: 12.5px;
	line-height: 1.2;
	}
	
#main-header-phone ul, 
#main-header-email ul, 
#main-header-nav ul {
	margin: 3px;
	padding: 0;
	}

#main-header-phone .fa, 
#main-header-email .fa, 
#main-header-nav .fa {
	display: none;
	}

#main-header-phone {
	font-weight: bold;
	}

#main-header-phone li:last-of-type {
	margin-left: 4px;
	}
	
#main-header-email li:first-of-type {
	margin-bottom: 15px;
	font-weight: bold;
	}

#main-header-nav { /* to size bullets */
	font-size: 9px;
	}

#main-header-nav a { /* to size text */
	font-size: 12.5px;
	font-weight: bold;
	}

#main-header-sitemap {
	width: 208px;
	margin-top: 3px;
	}

#main-header-sitemap a {
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 16px;
	}
	
#main-search-tagline {
	margin-left: 50px;
	max-width: 500px;
	color: #fff;
	text-align: left;
	font-size: 12px;
	line-height: 29px; /* center text vertically by height of parent */
	}
	
input#search {
	font-size: 12px;
	}	
	
#main-footer, 
#main-footer p {
	color: #fff;
	font-size: 12px;
	text-align: center;
	}
	
#main-sidebar ul#sidebar-nav {
	font-family: arial, helvetica, sans-serif;
	font-size: 12px;
	font-weight: 600;
	margin: 0;
	padding: 0;
	}


#main-sidebar .redbox {
	font-size: 12px;
	line-height: 1.25em;
	}


#main-sidebar .redbox .big-text {
	font-size: 18px;
	line-height: 1.2em;
	}

.red-text {
	color: #FC1008;
	}
	
	
#main-sidebar .redbox h2 {
	margin-top: 3px;
	line-height: 1.2;
	font-weight: bold;
	color: #1a73a9; /* #900 */
	font-size: 1.15rem;
	}

#main-sidebar .redbox .fa, 	
#main-sidebar .redbox .red-text {	
	color: #900;
	}
	
#main-sidebar .redbox .red-text {	
	font-size: 16px;
	}
	


/* alignment 
------------------------------------- */

.align-left {
	float: left;
	}

.pad-left {
	float: left;
	margin: 0 15px 10px 0;
	}

.align-right {
	float: right;
	}

.pad-right {
	float: right;
	margin: 0 0 10px 15px;
	}

.align-center {
	text-align: center;
	margin: 0 auto;
	}
 
.pad-center {
	text-align: center;
	margin: 15px auto;
	}

.clear {
	clear: both;
	}
	

/* misc 
------------------------------------- */
img,  
a img { 
	border: 0; 
	}

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

	
/* Responsive styles 
------------------------------------- */

@media all and (max-width: 979px) { /* medium screen size */

	/* 4 column grid (default) */	
	.column, 
	.column.span1-med {
		width: 25%;
		}
	
	.column.span2-med {
		width: 50%;
		}

	.column.span3-med {
		width: 75%;
		}

	.column.span4-med {
		width: 100%;
		}


	/* 3 column grid (overrides 4 column grid default) */
	.grid-3-columns .column, 
	.grid-3-columns .column.span1-med {
		width: 33.3%;
		}

	.grid-3-columns .column.span2-med {
		width: 66.6%;
		}

	.grid-3-columns .column.span3-med {
		width: 100%;
		}

/* 12 column grid (overrides 4 column grid default) */
	.grid-12-columns .column, 
	.grid-12-columns .column.span1-med {
		width: 8.33%;
		}

	.grid-12-columns .column.span2-med {
		width: 16.66%;
		}

	.grid-12-columns .column.span3-med {
		width: 24.99%;
		}
	
	.grid-12-columns .column.span4-med {
		width: 33.32%;
		}
	
	.grid-12-columns .column.span5-med {
		width: 41.65%;
		}
	
	.grid-12-columns .column.span6-med, 
	.grid-style-product-list > ul {
		width: 49.98%;
		}
	
	.grid-12-columns .column.span7-med {
		width: 58.31%;
		}
	
	.grid-12-columns .column.span8-med {
		width: 66.64%;
		}
	
	.grid-12-columns .column.span9-med {
		width: 74.97%;
		}
	
	.grid-12-columns .column.span10-med {
		width: 83.3%;
		}
	
	.grid-12-columns .column.span11-med {
		width: 91.63%;
		}
	
	.grid-12-columns .column.span12-med {
		width: 99.96%;
		}




	#main-header-nav.column {
		float: right;
		}	


	#search-tagline-wrapper.column {

	 	}
	
	#main-search-tagline {
		margin: 0 auto;
		text-align: center;
		max-width: auto;
		}	

	.hide-med {
		display: none;
		}


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

}



@media all and (max-width: 790px) { /* small screen size */
	body {
		margin: 0;
		}
		
	/* 4 column grid */	
	.column, 
	.column.span1-sm {
		width: 25%;
		}
	
	.column.span2-sm {
		width: 50%;
		}

	.column.span3-sm {
		width: 75%;
		}

	.column.span4-sm {
		width: 100%;
		}


	/* 3 column grid (overrides 4 column grid default) */
	.grid-3-columns .column, 
	.grid-3-columns .column.span1-sm {
		width: 33.3%;
		}

	.grid-3-columns .column.span2-sm {
		width: 66.6%;
		}

	.grid-3-columns .column.span3-sm {
		width: 100%;
		}

	/* 12 column grid (overrides 4 column grid default) */
	.grid-12-columns .column, 
	.grid-12-columns .column.span1-sm {
		width: 8.33%;
		}

	.grid-12-columns .column.span2-sm {
		width: 16.66%;
		}

	.grid-12-columns .column.span3-sm {
		width: 24.99%;
		}
	
	.grid-12-columns .column.span4-sm {
		width: 33.32%;
		}
	
	.grid-12-columns .column.span5-sm {
		width: 41.65%;
		}
	
	.grid-12-columns .column.span6-sm {
		width: 49.98%;
		}
	
	.grid-12-columns .column.span7-sm {
		width: 58.31%;
		}
	
	.grid-12-columns .column.span8-sm {
		width: 66.64%;
		}
	
	.grid-12-columns .column.span9-sm {
		width: 74.97%;
		}
	
	.grid-12-columns .column.span10-sm {
		width: 83.3%;
		}
	
	.grid-12-columns .column.span11-sm {
		width: 91.63%;
		}
	
	.grid-12-columns .column.span12-sm, 
	.grid-style-product-list > ul {
		width: 99.96%;
		}



	#logo a img {
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		display: block;
		}
		
	#main-header #main-header-nav {
		display: none;
		float: none;
		z-index: 10;
		position: absolute;
		top: 71px;
		right: 0;
		background-color: rgba(253,241,221,0.95);
		border: 1px solid #742724;
		border-bottom-width: 2px;
		border-top-color: rgba(0,0,0,0.05);
		border-left-color: rgba(0,0,0,0.25);
		width: auto;
		min-width: 200px;
		max-width: 50%;
		}
	
	#main-header #main-header-nav ul {
		margin: 5px 10px 10px 25px;
		}
		
	#main-header #main-header-nav a {
		display: block;
		padding: 5px 0;
		}

	#main-header #main-header-nav img {
		display: none;
		}

  	#main-search #search-box-alt { /* added 1/28/2018 */
		background: #712826;
		}
  
	#main-search #search-box-contacts {
		display: block;
		}
	
	#main-search #search-box-contacts .column {
	
		}
		
	#main-search #search-box-contacts .column .column-content {
		padding: 0;
		}

	#main-search #search-box-contacts ul {
		margin: 6px;
		padding-left: 12px;
		font-size: 12.5px;
		}
		
	#main-search #search-box-contacts .fa {
		display: inline-block;
		margin-right: .5em;
		}
		
	#main-search #search-box-contacts,
	#main-search a {
		color: #fff;
		}
				
	#main-search a:hover {
	color: #f9dabf;
	text-decoration: underline;
		}
			
	#main-search {
		float: none;
		display: block;
		min-height: 75px;
		height: auto;
		background: #712826;
		}
	
	#main-search li {
		line-height: 1.5;
		}
	
	#main-search-phone li:last-of-type {
	margin-left: 17px;
	}	

	.hide-sm {
		display: none;
		}
		
	#main-header .menu-trigger {
		display: block;
		}
		
	#main-sidebar.column {
		display: none;
		z-index: 1;
		position: absolute;
		top: 71px;
		max-width: 75% !important;
		min-height: auto !important;
		background-color: rgba(253,241,221,0.95);
		border: 1px solid #742724;
		border-bottom-width: 2px;
		border-top-color: rgba(0,0,0,0.05);
		border-left-color: rgba(0,0,0,0.25);
		}
		
	#sidebar-nav li {
    	border-bottom-color: rgba(100,100,100,0.15); /* #ebebeb */
    	}


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

	table {
		width: 100% !important;
	}


}


@media all and (min-width: 791px) { /* large screen size */

	#main-sidebar, 
	#main-header #main-header-nav {
		display: block !important;
	}

}