.hide-on-wide {display: none !important;}
#navRow1 .contents {display: none;}
#navRow2 .prov-selection {display: none;}

.home-page-by-default-on {right: 0;}

#master-container .vmcheader-mobiletopbar {display: none !important;} 
#vmcheader * {box-sizing: initial;}
/*
#vmcheader *:before {box-sizing: content-box !important;}
#vmcheader *:after {box-sizing: content-box !important;}
*/
    

#vmcheader .con,
#vmcheader  .special-con {
   cursor: pointer;
   display: inline-block;
 }
 
 #vmcheader .bar {
   display: block;
   height: 2px;
   width: 20px;
   background: #fff;
   margin: 4px auto;
 }
 
 #vmcheader .con {
   width: auto;
   margin: 0 auto;
   -webkit-transition: all .9s ease;
   -moz-transition: all .9s ease;
   -ms-transition: all .9s ease;
   -o-transition: all .9s ease;
   transition: all .9s ease;
 }
/* menu in X form */
#vmcheader .con.clicked .bar,#vmcheader .special-con.clicked .bar {
  background-color: #fff;
}
 
 #vmcheader .col {
   display: inline-block;
   text-align: center;
   height: auto;
   position: relative;
 }
 
 #vmcheader .middle {
   margin: 0 auto;
 }
 
#vmcheader  .bar {
   -webkit-transition: all .9s ease;
   -moz-transition: all .9s ease;
   -ms-transition: all .9s ease;
   -o-transition: all .9s ease;
   transition: all .9s ease;
 }
 
 #vmcheader .con.clicked .top {
   -webkit-transform: translateY(6px) rotateZ(45deg);
   -moz-transform: translateY(6px) rotateZ(45deg);
   -ms-transform: translateY(6px) rotateZ(45deg);
   -o-transform: translateY(6px) rotateZ(45deg);
   transform: translateY(6px) rotateZ(45deg);
 }
 
#vmcheader  .con.clicked .bottom {
   -webkit-transform: translateY(-6px) rotateZ(-45deg);
   -moz-transform: translateY(-6px) rotateZ(-45deg);
   -ms-transform: translateY(-6px) rotateZ(-45deg);
   -o-transform: translateY(-6px) rotateZ(-45deg);
   transform: translateY(-6px) rotateZ(-45deg);
 }
 
 #vmcheader .con.clicked .middle {
   width: 0;
 }



#vmcheader {}
	#vmcheader .contents {width: 100%; max-width: 1280px; overflow: visible;}
	#navRow1 {background-color: #fff;}
	#navRow1 .utility-nav {float: right; display: table; height: 100%;}
	#navRow1 .utility-nav li {display: table-cell; vertical-align: middle; position: relative; font-size: 12px; padding: 0 15px 0 15px;}
	#navRow1 .utility-nav li:first-child {padding: 0;}
	/* #navRow1 .utility-nav li a {display: block; width: calc(100% - 30px); height: 100%; padding: 17px 15px 0;} */
	#navRow1 .utility-nav li.languageSelector a { }
	#navRow1 .utility-nav li.provinceSelector a:first-child {}
	#navRow1 .utility-nav li.cart {}
	#navRow1 .utility-nav li.cart a {display: block; height: 25px; width: 25px; background: url("/assets/icons/shopping-cart-grey-empty.png") no-repeat center center;}
	#navRow1 .utility-nav li.cart.hasitems a,
	#navRow1 .utility-nav li.cart a.has-item {background: url("/assets/icons/shopping-cart-grey-full.png") no-repeat center center;}
	#navRow1 .utility-nav li.cart a img,
	#navRow1 .utility-nav li.cart a .cart-count {display: none !important;}
	#navRow1 .utility-nav li.myaccount .sso {float: left; margin-right: 15px; padding-right: 15px; border-right: 1px solid #333;}
	#navRow1 .utility-nav li.myaccount .sso span.name {font-family: inherit; }
	#navRow1 .selector {text-transform: uppercase; font-weight: bold; color: #333;}
	#navRow1 .utility-nav li.searchBar {padding: 0;}
	#navRow1 li.languageSelector { padding: 0 10px 0 30px;}
	#navRow1 li.languageSelector,
	#navRow1 li.provinceSelector {color: rgba(51,51,51,0.70);}
	#navRow1 li.provinceSelector {padding-left: 10px;}
	#navRow1 a {color: inherit;}
	
	#navRow1 .searchContainer { position: relative; background-color: #eaeaea; width: 200px; display:block;  float: left;}
	#navRow1 .searchContainer.searchActive {width: 300px; color: #000;}

	#navRow1 #searchField { position: relative; top: 0; background-color: #eaeaea; border: medium none; box-sizing: border-box; display: inline; height: 44px; line-height: 23px; padding: 0 15px; width: calc(100% - 30px); outline: none;}
    #navRow1 .searchContainer .searchsubmit {box-sizing: content-box; display: inline; position: absolute; bottom: 12px; right: 12px;}
	#navRow1 .searchContainer .searchclose {box-sizing: content-box;  position: absolute; bottom: 12px; right: 45px; width: auto; height: auto; padding: 0; display: none;}
	#navRow1 .searchContainer.searchActive .searchclose {visibility: visible;}
	
	#searchField::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	    color: #505050;
	    opacity: 1; /* Firefox */
	}
	
	#searchField:-ms-input-placeholder { /* Internet Explorer 10-11 */
	    color: #505050;
	}
	
	#searchField::-ms-input-placeholder { /* Microsoft Edge */
	    color: #505050;
	}
	
	/* #vmcheader ul li.has-subnav.drop ul.subnav:before  */
	
	#vmcheader ul li.has-subnav.drop.afterArrow:after {
	    content: ' ';
	    height: 0;
	    position: absolute;
	    left: 50%;
	    bottom: 6px;
	    width: 0;
	    border: 8px solid transparent;
	    border-bottom-color: #fff;
	    margin-left: -8px;
	    z-index: 1000;
	}
	#vmcheader ul li.has-subnav.drop ul.subnav {
		display: none;
		-webkit-box-shadow: 0px 0px 39px -1px rgba(0,0,0,0.62);
		-moz-box-shadow: 0px 0px 39px -1px rgba(0,0,0,0.62);
		box-shadow: 0px 0px 39px -1px rgba(0,0,0,0.62);
		position: absolute; 
		top: 90%; 
		left: 0; 
		z-index: 1000; 
		background-color: #fff;
		width: 252px;
		}
		#vmcheader ul li.has-subnav.drop.edge ul.subnav {right: 0; left: auto !important;}
		#navRow1 .utility-nav li.provinceSelector #provinceBox li {padding: 10px 0 10px 31px;}
		#navRow1 .utility-nav li.provinceSelector #provinceBox a {padding: 10px 0 10px 0; text-transform: none; font-size: 14px; font-weight: normal; color: #333;}
		#navRow1 .utility-nav li.provinceSelector.has-subnav.drop.afterArrow:after {bottom: 0;}
		
	#navRow1 ul li.has-subnav.drop ul li ul li:first-child {}
	#navRow1 ul li.has-subnav.drop ul li ul {display: block; box-shadow: none; position: static;}
	#navRow1 ul li.has-subnav.drop ul li ul li {
		float: left;
	    width: 190px;
    	/* background: url(/assets/images/bl_selector.png) no-repeat scroll 5px -25px transparent;
    	padding: 0 10px 0 26px; */
    	position: relative;
	}
	
	.md-off {
		border-color: rgba(0,0,0,0.54);
	    box-sizing: border-box;
	    position: absolute;
	    top: 7px;
	    left: 0;
	    width: 20px;
	    height: 20px;
	    border-style: solid;
	    border-width: 2px;
	    border-radius: 50%;
	    transition: border-color ease .28s;
	}
	.selected .md-off {border-color: #cc0000;}
	.selected .md-off div {
	    box-sizing: border-box;
	    position: absolute;
	    top: -2px;
	    left: -2px;
	    width: 20px;
	    height: 20px;
	    border-style: solid;
	    border-width: 2px;
	    border-radius: 50%;
	    border-color: #cc0000;
		background-color: #cc0000;
	    transition: border-color ease .28s;
	    transition: -webkit-transform ease .28s;
	    transition: transform ease .28s;
	    -webkit-transform: scale(.5);
    	transform: scale(.5);
	}
	/* #navRow1 ul li.has-subnav.drop ul li ul li.selected { background:url("/assets/images/bl_selector.png") 5px 3px no-repeat transparent; } */
	.provinces {padding: 20px !important;}
	#navRow1 .utility-nav li.provinces {background-color: #fff;}
	#navRow2 .provinces {background-color: #000;}
	#vmcheader ul li.has-subnav.drop #provinceBox.subnav {width: 500px; top: 100%;}
	#navRow2 {background-color: #cc0000; display: block;}
	#navRow2 .contents {
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cc0000+1,e10a0a+50,cc0000+100 */
		background: #cc0000; /* Old browsers */
		background: -moz-linear-gradient(left, #cc0000 1%, #e10a0a 50%, #cc0000 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, #cc0000 1%,#e10a0a 50%,#cc0000 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, #cc0000 1%,#e10a0a 50%,#cc0000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc0000', endColorstr='#cc0000',GradientType=1 ); /* IE6-9 */
	}
	#navRow2 .logo {height: 50px; padding-top: 10px; float: left;}
	#navRow2 .prov-selection {float: right;}
	#navRow2 ul li.mainLink {float: left; font-family: VMUltramagneticNormalRegular; font-size: 18px; text-transform: uppercase; color: #fff; position: relative;}
	#navRow2 ul li.mainLink a,
	#navRow2 ul li.mainLink.has-subnav span {color: #fff; text-decoration: none; padding: 20px; height: 100%; width: calc(100% - 40px); display: block; white-space: nowrap;}
	#navRow2 ul li.mainLink.has-subnav span {width: calc(100% - 60px); padding-right: 40px; cursor: pointer;}
	#navRow2 ul li.mainLink.has-subnav span:hover {text-decoration: underline;}
	#navRow2 ul li.mainLink a:hover {text-decoration: underline;}
	#navRow2 ul li.has-subnav.drop ul li {margin: 0; text-align: left; }
	#navRow2 ul li.has-subnav.drop ul li a {display: block; width: calc(100% - 49px); line-height: 1em; padding: 13px 20px 13px 25px; border-left: 4px solid #fff; color: rgba(51, 51, 51, 0.8); display: block; white-space: nowrap;}
	/*#navRow2 ul li.has-subnav.drop ul li:first-child a {padding-top: 25px;}
	#navRow2 ul li.has-subnav.drop ul li:last-child a {padding-bottom: 25px;} */
	#navRow2 ul li.has-subnav.drop ul li:hover a {color: #000; text-decoration: none; background-color: #efefef; border-color: #E10A0A;}
	
	#navRow2 .da {
	  position: absolute; 
	  right: 20px;
	  top: 30px;
	}
	
	#navRow2 .drop-arrow {
	  width: 0; 
	  height: 0; 
	  border-left: 5px solid transparent;
	  border-right: 5px solid transparent;
	  border-top: 5px solid #fff;
	}
	#navRow2 .up-arrow {
	  width: 0; 
	  height: 0; 
	  border-left: 5px solid transparent;
	  border-right: 5px solid transparent;
	  border-bottom: 5px solid #fff;
	}
	i.drop-arrow.left {display: none;}
	#navRow2 #provinceBox {display: none;}


#footer {background-color: #232323;}
	#footer .contents {width: 100%; max-width: 1280px; overflow: visible;}
	#footer ul {float: none; margin: 0;}
	#footer .firstRow {}
		#footer .firstRow .mainlinks {float: left; padding-bottom: 25px;}
		#footer .firstRow .mainlinks li {float: left; margin: 6px 30px 0 0; line-height: 1em;}
		#footer .firstRow .mainlinks a {font-family: VMUltramagneticNormalRegular; font-weight: normal; font-size: 16px; text-transform: uppercase; text-decoration: none; color: #fff;}
		#footer .firstRow .mainlinks a span {}
		#footer .firstRow .mainlinks li img {margin-right: 5px; height: 18px; vertical-align: bottom;}
		#footer .firstRow .socialLinks {float: right;}
		#footer .firstRow .socialLinks li {display: inline-block; margin: 0 10px;}
		#footer .firstRow .socialLinks li a {}
	#footer .midRow {border-width: 1px 0; border-color: #333; border-style: solid; padding: 40px 0;}
		#footer .midRow ul {width: 22%; margin-right: 3%; float: left;}
		#footer .midRow ul:last-child {width: 25%; margin-right: 0;}
		#footer .midRow ul li {list-style: none; margin-bottom: 25px;}
		#footer .midRow ul li:last-child {margin-bottom: 0;}
		#footer .midRow ul li a {color: #fff;}
	#footer .lastRow {text-align: center; padding: 28px 0; opacity: 0.8;}
	#footer .lastRow ul {margin-bottom: 15px;}
	#footer .lastRow ul li {display: inline; margin: 0 5px; font-size: 12px; color: #fff; text-decoration: none;}
	#footer .lastRow ul li a {color: #fff;}
	#footer .lastRow .legal {font-size: 12px; color: #fff;}



@media screen and (max-width:1280px) {
	#vmcheader .contents {width: 97% !important;}
	.fr #navRow2 ul li.mainLink a {padding: 20px 10px; width: calc(100% - 20px);}
	#footer .contents {width: 100% !important;}
	#footer .firstRow,
	#footer .lastRow {width: 95%; margin: 0 auto;}
	#footer .midRow ul,
	#footer .midRow ul:last-child {margin: 0 2% 0 3%; width: 20%;}	
}	

@media screen and (max-width:900px) {
	#vmcheader .contents {width: 95% !important;}
	#vmcheader { }
	.hide-on-wide {display: block !important;}
	.hide-on-narrow {display: none !important;}	
	#navRow1 .utility-nav li.hide-on-wide {display: table-cell !important;}
	#navRow1 .utility-nav li {padding: 0;}
	#navRow1 .utility-nav li.cart a {height: 27px; width: 27px; background: url("/assets/icons/shopping-cart-white-empty.png") no-repeat center top; margin: 0 auto;}
	#navRow1 .utility-nav li.cart.hasitems a, 
	#navRow1 .utility-nav li.cart a.has-item {background: url("/assets/icons/shopping-cart-white-full.png") no-repeat center top;}
	#vmcheader .contents {width: 100% !important; max-width: 100%;}
	#navRow1 {
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cc0000+1,e10a0a+50,cc0000+100 */
		background: #cc0000; /* Old browsers */
		background: -moz-linear-gradient(left, #cc0000 1%, #e10a0a 50%, #cc0000 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, #cc0000 1%,#e10a0a 50%,#cc0000 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, #cc0000 1%,#e10a0a 50%,#cc0000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc0000', endColorstr='#cc0000',GradientType=1 ); /* IE6-9 */
	}
	#navRow1 .utility-nav {float: none; width: 100%;}
	#navRow1 .logo {height: 90%; padding: 10px;}
	#navRow1 .cart {width: 50px;}
	#navRow1 .cart a {}
	#navRow1 .cart a img.hide-on-wide {display: inline-block !important;}
	#navRow1 .find-a-store-link {width: 50px;}
	#navRow1 .find-a-store-link a {}
	#navRow1 .find-a-store-link img {height: 20px; margin: 0 auto;}
	#navRow1 .menu {width: 40px;}
	#navRow1 .menu-link {display: block; padding: 0 17px 0 10px;}
	
	.mobileSearchBox {}
	.mobileSearchBox .searchContainer {padding: 20px; position: relative; z-index: 500; background-color: #000;}
	.mobileSearchBox #searchField {width: calc(100% - 44px); padding: 20px;}
    .mobileSearchBox .searchsubmit {box-sizing: content-box; display: inline; position: absolute; bottom: 37px; right: 37px;}
	.mobileSearchBox .searchclose {box-sizing: content-box;  position: absolute; bottom: 40px; right: 70px; width: auto; height: auto; padding: 0; display: none;}
	.mobileSearchBox .searchContainer.searchActive .searchclose {visibility: visible;}
	
	
	#navRow2 {
		display: none;
	    position: absolute;
    	z-index: 100;
    	width: 320px;
    	height: calc(100% - 61px); 
    	background-color: #000;
    	right:0;
    }
	#navRow2 .contents {
		background: #000 none;
		height: calc(100% - 55px);
		overflow-y: auto;
		overflow-x: hidden;
	}
	#navRow2 .logo {display: none;}
	#navRow2 .prov-selection {float: none;}
	#navRow2 ul {float: none; position: relative;}
	#navRow2 .topNav { }
	#navRow2 .subnav {
		display: none;
		position: absolute;
	    background-color: #000;
	    width: 100%;
	    z-index: 1000;
	    font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	    text-transform: none;
	    font-size: 16px;
	}
	#navRow2 ul li.mainLink {float: none; background-color: #000; height: 100%; width: 100%;}
	#navRow2 ul li.mainLink a,
	#navRow2 ul li.mainLink.has-subnav span,
	.fr #navRow2 ul li.mainLink a {padding: 10px 20px;}
	#navRow2 ul li.mainLink.has-subnav .subnav a {padding-left: 40px;}
	#navRow2 ul li.singleMobile {
		position: absolute; 
		z-index: 100;
	}
	#navRow2 ul li.menuopen {
		visibility: hidden;
		-webkit-transition: all .7s ease;
   		-moz-transition: all .7s ease;
   		-ms-transition: all .7s ease;
   		-o-transition: all .7s ease;
   		transition: all .7s ease;
	}
	#navRow2 .has-subnav span div {display: inline-block; padding: 0 20px 0 0;}
	#navRow2 .drop-arrow {
	    display:inline-block;
	    width: .5em;
	    height: .8em;
	    position: absolute;
	    top: 17px;
	    border: none;
	    margin: 0;
	}
	#navRow2 .drop-arrow:before,
	#navRow2 .drop-arrow:after {
	    display:block;
	    content:"";
	    width:0;
	    height:0em;
	    border-style:solid;
	    position:absolute;
	}
	#navRow2 .drop-arrow:before {
	    right:0;
	    border-width:.4em 0 .4em .4em;
	    border-color:transparent transparent transparent #fff;    
	}
	#navRow2 .drop-arrow:after {
	    left:0;
	    border-width:.4em 0 .4em .4em;
	    border-color:transparent transparent transparent #000;    
	}	
	
	#navRow2 .drop-arrow.left {
	  -webkit-transform: rotate(180deg);
	  -moz-transform: rotate(180deg);
	  -ms-transform: rotate(180deg);
	  -o-transform: rotate(180deg);
	  transform: rotate(180deg);
	}
	#navRow2 #provinceBox {display: none; position: absolute; z-index: 1000; bottom: 0; width: 100%; background-color: #000; border-top: 1px solid #333;}
	#navRow2 #provinceBox .md-off {border-color: #ccc;}
	#navRow2 #provinceBox .selected .md-off {border-color: #cc0000;}
	#navRow2 .ProvinceList li {
		padding: 10px 0 10px 31px;
		float: left;
	    width: calc(100% - 31px);
	    min-width: 115px;
    	/* background: url(/assets/images/bl_selector.png) no-repeat scroll 5px -25px transparent;
    	padding: 0 10px 0 26px; */
    	position: relative;
	}
	#navRow2 .ProvinceList a {padding: 10px 0 10px 0; text-transform: none; font-size: 14px; font-weight: normal; color: #fff;}

	
		
	
	#subNavRow2 {position: absolute; display: table !important; bottom: 0; width: 100%; height: 55px; z-index: 1000; background-color: #000; border-top: 1px solid #333;}
	#subNavRow2 #sso {display: table-cell; border-right: 1px solid #333; vertical-align: middle; text-align: center;}
	#subNavRow2 #sso a {color: #fff;}
	#subNavRow2 .languageSelector {display: table-cell; border-right: 1px solid #333; width: 80px; vertical-align: middle; text-align: center;}
	#subNavRow2 .languageSelector a {font-weight: bold; color: #fff;}
	#subNavRow2 .provinceSelector {display: table-cell; width: 80px; vertical-align: middle; text-align: center; font-weight: bold;}
	#subNavRow2 .myaccountmobile {display: table-cell; border-right: 1px solid #333; vertical-align: middle; text-align: center; }
	#subNavRow2 .myaccountmobile a {
		color: #fff; 
		display: inline-block; 
		background: url("/assets/icons/myaccount-white.png") no-repeat left top; 
		background-size: contain; 
		padding-left: 20px; 
		}
	#subNavRow2 .myaccountmobile .sso {display: inline; margin-right: 15px; padding-right: 15px; border-right: 1px solid #fff;}
	#subNavRow2 .myaccountmobile .sso span.name {font-family: inherit;} 
	#subNavRow2 .myaccountmobile .sso a,
	#subNavRow2 .myaccountmobile .sso + a {background: none;}
	.fixedPosition
	 {
	    position: fixed;
	    width: 100%;
	 }
	 	 
	.fr #footer .firstRow {width: 100%; margin: 0 auto;}
	.fr #footer .firstRow .mainlinks {float: none; margin-left: 20px;}
	.fr #footer .firstRow .mainlinks li {float: none; margin: 0 0 25px 0;}
	.fr #footer .firstRow .mainlinks li:last-child {margin-bottom: 10px;}
	.fr #footer .firstRow .socialLinks {float: none; padding: 20px 0 20px 20px; border-top: 1px solid #333;}
	
	
}	

@media screen and (max-width:770px) {
	#footer {padding-top: 35px;}
	#footer .firstRow,
	#footer .lastRow {width: 100%; margin: 0 auto;}
	#footer .firstRow .mainlinks {float: none; margin-left: 20px;}
	#footer .firstRow .mainlinks li {float: none; margin: 0 0 25px 0;}
	#footer .firstRow .mainlinks li span.imgContainer {width: 25px; display: inline-block; margin-right: 7px;}
	#footer .firstRow .mainlinks li span img {margin: 0 auto; display: block;}
	#footer .firstRow .mainlinks li:last-child {margin-bottom: 10px;}
	#footer .firstRow .socialLinks {float: none; padding: 20px 0 20px 20px; border-top: 1px solid #333;}
	#footer .midRow ul,
	#footer .midRow ul:last-child {margin: 0 20px; width: 90%;}	
	#footer .midRow ul {margin-bottom: 25px;}
	#footer .lastRow {text-align: left;}
	#footer .lastRow ul {padding-left: 20px;}
	#footer .lastRow ul li {display: block; margin: 0 0 15px;}
	#footer .lastRow .legal {padding: 10px 0 10px 20px;}
}
	
@media screen and (max-width:640px) {
	
	#navRow2 {
		display: none;
	    position: absolute;
    	z-index: 10000;
    	width: 100%;
    	height: calc(100% - 61px); 
    	background-color: #000;
    }
    
    #navRow2 .ProvinceList li {
		float: left;
	    width: calc(50% - 31px);
    }


}
@media screen and (max-width: 480px) {
    #navRow2 .ProvinceList li {width: 100%;}
}

@media screen and (max-width: 400px) {
	#subNavRow2 .ProvinceList {width: 100%;}

}

@media screen and (max-width: 860px) and (max-height: 450px) and (orientation : landscape){
	#navRow2 {width: 100%;}
}