﻿.nav-button { display: none; } /* hide the navigation button by default */
.primary-nav { display: none; }
.primary-nav > ul {
		display:none;
	}
/*.main-container{
	padding-top:138px;
	padding-top:154px;
}*/
.mobile-logo-container { display: none; }
.smallphone { display: none; }
.tablet { display: none; }
.mobile { display: none; }
/*.not_mobile {display:block !important ;}*/
/*.expand_item {display:block !important ;}*/
@media only screen and (min-width: 0px) and (max-width: 1000px) {
.top-nav { display: none; }
.navbar { display: none; }
ul.navbar { display: none; }
.not_mobile {display:none; }
.header-container {display:none; }
.mobile-logo-container {
	display: block; 
	z-index: 1000;
	}
	
.mobile-flags{display: none; }
.tablet {display:block; }
.mobile {display:inline-block; }
ul.mobile {padding-left:0px; }
.slideToLeft, .slideToRight, #addthis, #topnav, #myaddthis{display:none;}
#full-size {display:none !important;}
#mobile-size {display:block !important; }
#navigation-header{
	font-size:12px;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
}
.login_nav .top_login.sf-menu a.cart_link:link, 
.login_nav .top_login.sf-menu a.cart_link:visited{
	background:url(../img/TopCart-10.png) no-repeat 10px 5px;
	background:none;
/*	height:18px;*/
	padding-left:16px;
	margin:0px 0px 0px 0px;
	color:#bfe489;
	font-weight:normal;
	padding: 0em 5px 0 5px;
}
.login_nav .top_login.sf-menu a.cart_link:focus,
.login_nav .top_login.sf-menu a.cart_link:hover, 
.login_nav .top_login.sf-menu a.cart_link:active{
	background:url(../img/TopCart-10.png) no-repeat 10px -11px;
	background:none;
	color:#488324;
	font-weight:normal;
}
	/* Navigation Button
	-------------------------------------------------------- */
	.nav-button {
		display: inline-block;
		position: absolute;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		top:14px;
		right: 1px;
		width: 50px;
		height: 35px;
		background: url('../img/menu-icon-large.png');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 21px, 100%;
		cursor: pointer;
		border: 0 none;
/*		border-bottom: 1px solid rgba(255,255,255,.1);
		box-shadow: 0 0 4px rgba(255,255,255,.7) inset;
		border-radius: 5px;*/
		z-index: 999;
		color:#fff;
		font-size:12px;
		/*margin-top:5px;*/
		text-indent:60px;
	}
	.nav-button.open {
		position: absolute;
		background: url('../img/close-icon-large.png');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 21px, 100%;
	}
	.nav-button:hover, .nav-button.open:hover { 
		background-color: rgba(0,0,0,.1); 
	}

	/* Navigation Bar
	-------------------------------------------------------- */
	.nav-container {
		position:fixed;
		background:#fff;
		background:#000;
	/*	top:32px;*/
		left:0;
		right:0;
		z-index: 2000;
	/*	box-shadow: none;*/
		-moz-box-shadow: 	0 6px 0 rgba(136,139,141,.5);
		-webkit-box-shadow:  0 6px 0 rgba(136,139,141,.5);
		box-shadow: 		0 6px 0 rgba(136,139,141,.5);
	}
/*	.main{
		padding:10px 0 20px 0;
		padding:0 0;
	}*/
	#container{
		padding:10px 0 20px 0;
	}
	.modal-content {
		top:8%;
	}
	.invoice-modal-content {
		top:8%;
	} 
	.mobile-logo{  
		display:inline;
		text-align:center;
		max-height:60px;
		z-index: 1000;
		margin:5px 0px 0px 0px;	
		margin:0 auto;
		-webkit-transition: all .2s ease-in-out;
		transition: all .2s ease-in-out;
	}
	.mobile-logo img{  
		max-width:80%;
	}
	img.cad_flag{
		max-height:10px;
	} 
	ul.logo-button li{
		display:inline;
	}
	.mobile-logo-container {
		margin-left:auto;
		margin-right:auto;
	}
	.mobile-logo-container h1{
		text-align:center;
		margin:0 auto;
	/*	padding-top:10px;*/
	}
	.mobile-small-logo{  
		display:inline;
		text-align:center;
		max-height:40px;
		z-index: 1000;
		margin:5px 0px 0px 0px;	
		margin:0 auto;
		-webkit-transition: all .2s ease-in-out;
		transition: all .2s ease-in-out;
	}
	.mobile-small-logo-container h1{
		text-indent:-9999px;
		margin:0 0;
	}
	.nav_wrapper{
    	width: 100%;
    	margin: 0 0;
	}
	ul#header_contact{
		position: relative;
	}
	.primary-nav {
		width: 100%;
		float: none;
		background-color: #fff;
		display: block;
		margin: 0;
		padding: 0;
		z-index: 998;
		clear: both;
	}
	.main-container{
		padding-top:0px;
		margin-top:94px;
	}
	.primary-nav h3,  .primary-nav h3.searchBtn{
		display: none;
		width: 100%;
		font-family: Arial;
	}
	.primary-nav.open > ul {
		display:none;
	}
	
	/* Toggle the navigation bar open  */

	.primary-nav.open { 
    	background-color: #cdcdcd;
    	background-color: #f9f9f9;
    	background-color: #fffdfd;
		background-image: -webkit-linear-gradient(top, rgba(0,0,0,.2), rgba(0,0,0,0));
		background-image:    -moz-linear-gradient(top, rgba(0,0,0,.2), rgba(0,0,0,0));
		background-image:      -ms-linear-gradient(top, rgba(0,0,0,.2), rgba(0,0,0,0));
		background-image:       -o-linear-gradient(top, rgba(0,0,0,.2), rgba(0,0,0,0));
		height: auto; 
		/*margin-top: 80px;*/
	}
	.primary-nav.open h3, .primary-nav.open h3.searchBtn { 
		display: block; 
	}

	/* Submenus – optional .parent class indicates dropdowns */

	.primary-nav > h3:hover > a {
		background: rgba(0,0,0,.2);
		border-bottom-color: transparent;
		color:#fff;
	}
	.primary-nav h3{
	  margin:0;
	  padding:8px 0 8px 18px;
	  background-color:#2a2a29;
	  background-color:#5c719e;
	  border-bottom:1px solid #666;
	  border-bottom:1px solid #e2e7f2;
	  color:#000;
	  color:#fff;
	  font-size:1em;
	  font-weight:700;
	  cursor:pointer; 
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box; 
	  box-sizing: border-box;
	}
	
	.primary-nav h3:hover{
	/*  background-color:#CDCDCD;*/
    	background-color: #f9f9f9;
    	background-color: #fffdfd;
		color:#000;
	}
	.primary-nav h3.parent:hover{
	/*  background-color:#CDCDCD;*/
    	background-color: #f9f9f9;
    	background-color: #fffdfd;
		background: #f9f9f9 url(../img/right_black_arrow.gif) no-repeat right center;
		background: #fffdfd url(../img/right_black_arrow.gif) no-repeat right center;
		color:#000;
	}
	.primary-nav h3:hover > a{
/*	  background-color:#CDCDCD;*/
    	background-color: #f9f9f9;
    	background-color: #fffdfd;
		color:#000;
	}
	.primary-nav h3 a{
		color: #fff;
	}
	.primary-nav h3:hover > a:hover{
		color:#ff0000;	
		color:#c60000;	
	/*	color:#488324;*/			
	}
	.primary-nav ul li h3{
	  margin:0;
	/*  padding:8px 0 8px 18px;*/
	  padding:8px 0 8px 0;
		background-color: #f7f7f8;
	  border-bottom:none;
	  color:#000;
	  font-size:1em;
	  font-weight:700;
	  cursor:pointer; 
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box; 
	  box-sizing: border-box;
	}
	.primary-nav ul li h3:hover{ 
		background-color: #f7f7f8;	
	}
	.primary-nav ul li h3 > a{
		color: #000;	
		background-color: #f7f7f8 !important;
		display:block;
/*		background-color:transparent;
		background-color: #f7f7f8;*/
	}
	.primary-nav ul li h3 > a:hover{
		color:#ff0000;
		color:#c60000;
		color:#488324;		
		background-color: #f7f7f8 !important;	
/*		background-color:transparent;*/
	}
	.primary-nav > ul > li {
		margin: 0;
	/*	padding: 8px 0 8px 18px;*/
		padding: 4px 0 4px 0px;
		background-color: #cdcdcd;
		background-color: #f7f7f8;
		border-bottom: 1px solid #666;
		color: #2c2a29;
		font-size: 1em;
		font-size: 16px;
		/*font-weight: 600;*/
		/*cursor: pointer;*/
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		list-style: none !important;
		padding-left:30px;
}
	.primary-nav > ul > li > ul > li{
		list-style: none !important;
	}
	.primary-nav > ul > li:hover{
		background-color: #f7f7f8;
	}	
	.primary-nav > ul > li > a{
		color: #2c2a29;
	}
	.primary-nav > ul > li > a:hover, .primary-nav > ul > li > ul > li >a:hover{
		color:#ff0000;	
		color:#c60000;	
		color:#6ba548;
		background-color: #f7f7f8;		
	}
	.primary-nav > ul{padding: 0 0 0 0;}
	.primary-nav a:hover{
		text-decoration:none;
	}
/*	h3.search{text-indent:-9999px;}*/
	.primary-nav.open > a > h3.searchBtn { 	
		border: none;
		background-color:#2a2a29;
		background:#2a2a29 url(../img/search-icon-white-md.png) no-repeat 18px center;
		/*padding: 0 0 0 36px;*/
		display:inline-block;
		height:40px;
		text-indent:-9999px;
	}
	.primary-nav.open > a > h3.searchBtn:hover { 
		background: url(../img/search-icon-black-md.png) no-repeat 18px center !important;
		}
	.primary-nav.open > a > h3.searchBtn{ 
	/*	height:40px;
		width:100px;*/
		display:block;
	}

	.primary-nav.open > h3.searchBtn { 	
		border: none;
		background-color:#2a2a29;
		background-color:#5c719e;
		background:#2a2a29 url(../img/search-icon-white-md.png) no-repeat 18px center;
		background:#5c719e url(../img/search-icon-white-md.png) no-repeat 18px center;
		/*padding: 0 0 0 36px;*/
		display:inline-block;
		height:40px;
		text-indent:-9999px;
	}
	.primary-nav.open > h3.searchBtn:hover { 
		background: url(../img/search-icon-black-md.png) no-repeat 18px center !important;
		}
	.primary-nav.open > h3.searchBtn{ 
	/*	height:40px;
		width:100px;*/
		display:block;
	}
/*	.primary-nav.open > form.search_input{
		width:200px;
	}*/
	.primary-nav.open > ul > li.h-topcat{ 
		padding:4px 0 0 18px !important;		
	}
	.primary-nav.open  > ul > li.h-topcat h2{ 
		font-size:16px;
	}
/*	a.mobile-searchBtn:link{
		background:#2a2a29 url(../img/search-icon-white-md.png) no-repeat 3px 2px;		
		padding-left:30px;
	}
	a.mobile-searchBtn:hover{
		background:#f7f7f8 url(../img/search-icon-black-md.png) no-repeat 3px 2px;		
		padding-left:30px;	
	}*/
	.sect_1 h2, .sect_1 p{
		font-size:0.85em;
	}
/*	h1{
		font-size:1.5em;
		margin: 0.2em 0;
		line-height:1.5;
	}*/
	
  .top-nav .search-container {
    float: none;
  }
  .top-nav a, .topnav input[type=text], .topnav .search-container button {
    float: none;
    display: block;
    text-align: left;
    width: 100%;
    margin: 0;
    padding: 14px;
  }
  .top-nav input[type=text] {
    border: 1px solid #ccc;  
  }
	
/*	#home .primary-nav  h3.home,
	#about .primary-nav  h3.about,
	#news_pages .primary-nav  h3.news_pages,
	#products .primary-nav  h3.products,
	#contact .primary-nav  h3.contact,	
	#home .primary-nav .home > a,
	#about .primary-nav .about > a,
	#news_pages .primary-nav .news_pages > a,
	#products .primary-nav .products > a,
	#contact .primary-nav .contact > a
	{
		color:#000;
		color:#fff;
		text-decoration:none;
		font-weight:bold;
		background-color:#ff0000 !important;
		background-color:#fff !important;
		background-color:#c60000;
		background-color: #9b0000 !important;
		cursor:pointer;
	}
	
	#home .primary-nav h3.home > a:hover,
	#about .primary-nav h3.about > a:hover,
	#news_pages .primary-nav h3.news_pages > a:hover,
	#products .primary-nav h3.products > a:hover,
	#contact .primary-nav h3.contact > a:hover
	{
		color:#2c2a29;
		color:#c60000;
		color:#f7f7f8;
		text-decoration:none;
		font-weight:bold;
		background-color:#ff0000;
		cursor:pointer;
	}*/

	/* Indicate active page */
	
	#home .primary-nav  a.home > h3,
	#about .primary-nav  a.about > h3,
	#service .primary-nav  a.service > h3,
	#news_pages .primary-nav  a.news_pages > h3,
	#products .primary-nav  a.products > h3,
	#contact .primary-nav  a.contact > h3,
	#about .primary-nav  h3.about,
	#service .primary-nav  h3.service,
	#products .primary-nav  h3.products	
/*	#home .primary-nav .home > a,
	#about .primary-nav .about > a,
	#news_pages .primary-nav .news_pages > a,
	#products .primary-nav .products > a,
	#contact .primary-nav .contact > a*/
	{
		color:#000;
		color:#fff;
		text-decoration:none;
		font-weight:bold;
		background-color:#ff0000 !important;
		background-color:#fff !important;
		background-color:#c60000;
		background-color: #9b0000 !important;
		background-color: #395081 !important;
		background-color: #3a5283 !important;
		background-color: #22396b !important;
		cursor:pointer;
	}
	
	#home .primary-nav a.home > h3:hover,
	#about .primary-nav a.about > h3:hover,
	#news_pages .primary-nav a.news_pages > h3:hover,
	#products .primary-nav a.products > h3:hover,
	#contact .primary-nav a.contact > h3:hover
	{
		color:#2c2a29;
		color:#c60000;
		color:#f7f7f8;
		text-decoration:none;
		font-weight:bold;
		background-color:#ff0000;
		background-color:#c60000;
		cursor:pointer;
	}

.process-expandButton{
	margin:0 0;
}
#process .w-3col, #process .w-1col{
	margin-bottom:0;
	padding:0;	
}
/*@media only screen and (min-width: 0px) and (max-width: 900px) {	
	.navbar{
		margin-left:20%;
	}
}*/
/*@media only screen and (min-width: 801px) {
.main-container{
	padding-top:138px;
	padding-top:152px;
	padding-top:150px;
}*/
}
@media only screen and (min-width: 0px) and (max-width: 550px) {
/*.cart_table{
	font-size:14px !important;
	}*/
}
@media only screen and (min-width: 0px) and (max-width: 500px) {
/*.cart_table{
	font-size:13px !important;
	}*/
}
@media only screen and (max-width: 415px) {
	.main-container{
	/*	margin-top:114px;*/
	}
	.home_section p{
		font-size: 20px !important;
	}
/*	body {
		font: 12px/20px Helvetica, Helvetica Neue, Arial;	
		font: 12px/20px din-2014,"Helvetica Neue",sans-serif;
		background-color: #fff;
		box-sizing: border-box;
	}
	p{
		font-size:12px !important;	
	}*/
/*	table{
		font-size:10px !important;			
	}
	table.pondshop-table td {
		font: 12px/20px din-2014,"Helvetica Neue",sans-serif;
	}*/
	.nav-button{
		margin-top: 0px;
		
	}
}
@media only screen and (min-width: 0px) and (max-width: 407px) {
	.tablet { display: none; }
	.smallphone {display:block; }
	.nav-button{top:5px;}
	.main-container{
		margin-top:68px;
	}	
}
@media only screen and (max-width: 400px) {	
	.mobile-logo-container h1{
	/*	text-align: left;*/
	}
	.home_section h1{
		font-size: 20px;
	}
	.home_section p, .home_section h2{
		font-size: 18px !important;
	}
	.home_section a.learn{
		font-size: 14px !important;	
		padding: 10px 10px;
	}
	.bx-caption span{
		font-size: 0.75em !important;
	}
}
@media only screen and (max-width: 300px) {
	.main-container{
		margin-top:60px;
	}
	.bx-caption span{
		font-size: 0.6em !important;
	}
/*	body {
		font: 10px/18px Helvetica, Helvetica Neue, Arial;	
		font: 10px/18px din-2014,"Helvetica Neue",sans-serif;
		background-color: #fff;
		box-sizing: border-box;
	}*/
	/*table{
		font-size:10px !important;	
	}*/
/*	p{
		font-size:10px !important;	
	}*/
	table.pondshop-table td {
		font: 10px/18px din-2014,"Helvetica Neue",sans-serif;
	}
	.home_section p{
		font-size: 16px !important;
	}
	.mobile-small-logo{
		max-height:30px;
		max-width:80%;
	}
	.nav-button{
		width:30px;
		top:0px;
	}
/*	#navigation-header {
		font-size:10px;
	}*/
}
@media only screen and (max-width: 240px) {
	.flags {
		display:none;
	}
}
@media only screen and (max-width: 200px) {
	.mobile-small-logo{
		float:left;
	}
	}
} /* End Mobile Styles */