
/* ## Site Header ## */
.site-header {position:relative; z-index:1000; margin:0; background:#f8f8f8; box-shadow: 0px 0px 7px -1px #949292;}
.site-header > .inner {padding:60px 0 15px; background:#fff;}
/* static containers to account for header buttons on mobile - allows absolute positioning to the header */
.site-header .container, .site-header [class*="grid-"] {position:static;}
.live-chat-div{padding: 10px; background:#004c97; color: #fff; position: fixed; top: 46%; right: 0; border-radius: 10px 0 0 10px; z-index: 9999; display: none;}
.live-chat-div span{text-align: center; display: block; font-size: 1em; font-weight: 600; margin-right: 0px;}
.live-chat-div span > svg{position: relative; top: 3px;}
.header-top{padding: 10px; display: flex; align-items: center;}


.header-top  a{display:block; text-align:center; font-weight: 500}
.header-middle-mb{padding: 10px 0;}

.header-links {text-align: right; display: none;}
.header-links > span{margin:0 25px;}
.header-links a {  margin: 0; text-decoration: none; display:none; color:#017abf;}
.header-links a.SelectDealer{color: #fff;}
.header-links .sep {display:none; color:#017abf;}
.header-links a:hover, .header-links a:focus, .header-links a:active {}
.header-links .call-us a > span{display: none;}
.header-links .call-us a > svg { position: relative; top: 10px; left: -10px;}
.cart-wrapper{display: inline-block; position: relative;}
#spanCartTotal{position: absolute; top: -10px; border-radius: 50%; right: -5px; background: #f7ea48;  color: #000;  padding: 2px 6px;  font-size: 0.80em;  font-weight: 600;}
.header-links a.cart-link{color:#017abf;}
.header-links .call-us a{color: #7f3035;}/* 
.header-middle-mb a.cart-link span:first-child{display: none;} */
/* Start Header Bottom here */
.header-bottom{display: flex; align-items: center; justify-content: space-between; padding:0;}
.header-bottom .main-nav-container{width:100%; margin-top: 0px;}

.site-logo{width: 100%;}
.site-search {margin:0 -10px;}
.search-trigger {position:relative; font-size:2em; padding:0; border:0px;  z-index:2; text-align:center; cursor:pointer; background: transparent;}
.search-trigger:hover, .site-search .search-trigger:focus, .search-active .site-search .search-trigger {background:transparent;}
.search-trigger > * {padding-top:9px; display:inline-block; width:36px; height:36px;}
.site-search input[type="text"]{border-radius: 25px;}
.site-search .inner {display:none; position:absolute; background:#00b0fa; top:100%; left:0px; padding:5px; width:100%; }
.search-active .site-search .inner {display:block;}
.site-header .formee input[type="text"] {margin:0px; background: #fff; /* padding:13px 18px; */ }
.site-search .srcbtn {position:absolute; right:20px; top:10px; height:40px; width: 40px; text-indent: -9999em; background:url(/cms/images/general/search.svg) no-repeat transparent; background-size: 50%; background-position: center; border:0;}
.header-middle-mb{display: flex; align-items: center; position: relative; justify-content: space-around;}
.icon-phone{font-size: 1.75em;}
.icon-search{font-size: 1.15em;}
.icon-cart{font-size: 1.85em;}
.srch-div-mid{display: none;}

/* =================================================================
                        Media Queries
===================================================================*/


@media only screen and (min-width:48em){


 .header-top{padding: 20px 20px 5px 20px; margin: 0;}
 .header-top  a{text-align: left;}
	.site-header .container, .site-header [class*="grid-"] {/*position:relative;*/}
	.site-header > .inner {padding:10px 0;}
 .header-bottom{padding: 30px 10px 0 10px;}
	
	.header-links {margin:0 0 0 auto; display: block; width: 60%; font-size: 0.90em;}
	.header-links > span,
	.header-links a.cart-link{margin: 0 5px;}

	.header-links a {display:inline-block;}
	.header-links .sep {display:inline-block;}
		
	.site-logo{width: 40%;}
	.site-search {margin:0px;}
	
	.site-search .search-trigger {display:none;}
	.header-bottom{padding:5px 10px 20px 10px; flex-wrap: nowrap; justify-content: center;}
	.site-search {margin:0px; margin: 0 10px;}
 #spanCartTotal{top: -5px; right: 0; }

	.header-bottom .main-nav-container{ margin-top: 0;  flex-basis: 100%; margin-bottom: 20px; }
 .design-playset{display: block; margin: 0 10px;}
 .design-playset a.btn{font-size: .85em;}
/* 	.header-links a.cart-link > span:first-child{display: none;} */
	.header-middle-mb{display: none;}
	.srch-div-mid{display: block;}

}


@media only screen and (min-width: 72em){
	.live-chat-div{ display: block; box-shadow: 0px 0px 20px -1px rgba(0,0,0,0.45);}
	.live-chat-div span{text-align: center; font-size: 1.25em;}
	.srch-div-mid{display: none;}
 .site-search .inner {display:block; background:none; position:relative; bottom:auto; padding:0px;}
 .design-playset a.btn{font-size: 1em;}
 .site-search .srcbtn{top: 5px; right: 0;}
}

@media only screen and (min-width: 80em){
.header-links {margin:0 10px 0 auto; width: auto; font-size: 1em;}
.header-links > span,
.header-links a.cart-link{margin: 0 25px;}
.header-links .call-us a > span{display: block;}
.header-links .call-us a > svg{display: none;}
.header-bottom{padding:5px 10px 20px 5px; flex-wrap: nowrap; justify-content: space-around;}
.header-bottom .main-nav-container{width: 65%; margin-top: 0; margin-bottom: 0px; flex-basis: auto;  }
.header-links a.cart-link > span:first-child{display: inline-block;}
}