/* #Base 1200 Grid
================================================== */

.container	{position: relative; width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }

.column,
.columns	{ width: 100%; float: left; box-sizing: border-box; }

@media (min-width: 400px) {
	.container { width: 85%; padding: 0; }
}

/* For devices larger than 550px */
@media (min-width: 750px) {
	.container .one-fourth	{width:23.5%;}
	.container .one-third		{width:32%;}
	.container .two-thirds	{width:66%;}
	.container .one-half		{width:49%;}
	.container .column		{float:left;margin-right:2%;}
	.container .column.last	{float:right;margin-right:0;}
}


/* #Media Queries
================================================== */
	
	/* Larger than phablet (also point when grid becomes active) */
	@media (min-width: 550px) {
		.products .product {width:48%;float:left;margin:0 1% 40px;}
	}
	
	/* Larger than tablet */
	@media (min-width: 750px) {
		.banner-slogan span {font-size:2.4rem;}

		.company-banner {height:400px;}

		.category-grid {grid-template-columns: repeat(3, 1fr); gap: 30px;}

		.woocommerce-MyAccount-navigation ul li a {padding:60px 10px 20px;font-size:1.4rem;}
		.woocommerce-MyAccount-navigation ul li a:before {font-size:3.0rem;top:20px;}
	}
	
	/* Larger than desktop */
	@media (min-width: 1000px) {
		.mainNav {display:block;}
		.mobile-nav-trigger-outter,
		.mobile-nav { display: none }

		.company-banner {height:450px;}
		.woocommerce .products .product {width:23.5% !important;margin:0 2% 40px 0 !important;}
		.woocommerce .products .product.last {margin-right:0 !important;float:right !important;}

		.woocommerce .products .product .add_to_cart_button,
		.woocommerce .products .product .added_to_cart {opacity:0;}
		.woocommerce .products .product:hover .add_to_cart_button,
		.woocommerce .products .product:hover .added_to_cart {opacity:1;}

		.signup-steps {padding-bottom:200px;}

		.woocommerce-MyAccount-navigation ul {flex-wrap:nowrap;}
		.woocommerce-MyAccount-navigation ul li {flex:1 1 0;}
		.woocommerce-MyAccount-navigation ul li a {padding:60px 10px 40px;font-size:1.6rem;}

	.category-grid {grid-template-columns: repeat(4, 1fr);}
	.category-grid.has-few {grid-template-columns: repeat(var(--cat-count, 4), minmax(0, 240px));}
}