/*
  Yaktrax header/footer (main) css
  Created by: Mazen Chami
*/

/* Reset */
* {  } /*margin: 0; padding: 0;*/
html { overflow-y: scroll; }
body { background: #FFFFFF; font-size: 12px; line-height: 1.3em; color: #FFFFFF; font-family: "Franklin Gothic", Arial, sans-serif; }
ol, ul { list-style: none;  } /*margin: 0;*/
ul li { margin: 0; padding: 0; }
h1, h2 { margin-bottom: 10px; color: #111111; }	
a, img { outline: none; border:none; color: #FFFFFF;  } /*font-weight: bold; text-transform: uppercase;*/
p {  } /*margin: 0 0 10px; line-height: 1.3em; font-size: 12px;*/
img {  } /*display: block; margin-bottom: 10px;*/
aside { font-style: italic; font-size: 0.9em; }
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }

/* Structure */
html {
	height: 101%;
}

body {
	padding: 0; margin: 0;
	font-size: 0.9em;
	font-family: "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif;
	color: #000;
	background: #fff;
	background: url('/images/layout/topo-lines.jpg') repeat-x;
	line-height: 1.3em;
}

#headerDivElements{
	padding-bottom: 10px;
}

.mainOuterLayer {
	/*width: 1090px;
	padding: 0 2em 0 2em;*/
	width: 100%;
	max-width: 1150px;
	margin: 0 auto;
	margin-bottom: 20px;
	position: relative;
	z-index: 2;
	background: #FFFFFF;
	box-shadow: 0 0 25px 5px #888;
}

p { }

h1,h2,h3,h4,h5,h6 {
	color: #6980ac;
}

h1 { font-size: 1.5em; line-height: 1em; }
h2 { font-size: 1.15em; margin-bottom: 0.5em; font-weight: normal;}
h3 { font-size: 1.15em; }

a img { border: none; }

input, select, textarea {
	position: relative;
	z-index: 2;
}

header, .mainSections, footer {
	padding: 0px 2em 0px 2em;
}
.mainSections, 
footer{
	overflow: hidden;
}
sup {
	vertical-align: baseline;
}

/* IE Banner */
#lowVersionOfIE {
	width: 100%;
	text-align: center;
	display: inline-block;
	margin: 5px auto 0px auto;
	color: #6980AC;
}

/* Main Layout Components */
#overlay {
	width: 100%;
	height: 100%;
	background: url('/images/layout/overlay_back.png');
	position: fixed;
	z-index: 1000;
	display: none;
	text-align: center;
	padding-top: 3%;
	top: 0;
}

#overlay_close , #tool-tip-close {
	color: #fff;
	background: url('/images/layout/close.png') no-repeat 0 0;
	height: 13px;
	width: 13px;
	display: inline-block;
	position: absolute;
	right: -6px;
	top: -3px;
}

#overlay_close:active , #tool-tip-close:active { background-position: 0 -13px; }

/*#Free_ship {
	display: none;
	width: 292px;
	height: 331px;
	top:250px;
	left:-75px;
	position: absolute;
	z-index: 5000;
}*/

header {
	position: relative;
	margin: 0;
	/*width: 100%;*/
	padding-top: 5px;
	z-index: 10;

}

#logo {
	display: inline-block;
	vertical-align: middle;
	width: 28%; /*320px;*/
	background: #fff;
	min-width: 300px;
}

#nav {
	display: inline-block;
	z-index: 1001;
	font-size: 0.8em;
	position: relative;
	padding: 0; 
	margin: 15px -20px 0px;
	float: right;
	width: 530px;/*55%; 740px;
	right: 0px;
	top: 23px;*/
	margin-top: 15px;
}

#nav ul {
	list-style-type: none;
	font-size: 1.2em;
	letter-spacing: .5px; 
	right: 27px;
	background: #E9ECF3;
	z-index: 15;
	padding-left: 20px;
}

#nav li {
	display: inline-block;
	/*padding: 0 1.5em;*/
	padding: 0.4em 1.5em 0em 0em;
	display: inline-block;
	height: 2em;
	padding-top: 0.4em;
	margin-right: .6em;/*3em;*/
}

#nav li span {
	position: relative;
	top: 3px;
	color: #6980ac;
	text-decoration: none;
	cursor: default;
}

/*#nav li span:hover {
	color: #92a9d3;
}*/

.subnav li a:hover, .subnav li a {
	color: #6980AC;
}

.subnav li, .subnav li a {
	font-size: 0.9em;
}

#cartLink {
	margin: 0 !important;
}

.subnav {
	width: 175px;
	display: none;
	/*position: relative;
	z-index: 1002 !important;*/
	position: absolute;
	background: #fff !important;
	border: 1px solid #e9ecf3;
	padding: 0 0 9px 0; margin: 0;
	box-shadow: 3px 3px 3px 0 #555;
}

.subnav li {
	display: block !important;
	background: transparent !important;
	padding: 0; margin: 0;
	height: 1.2em !important;
	width: 90%;
}

.subnav li a {
	display: block !important;
	background: transparent;
	padding: 3px;
	background: #fff !important;
	position: relative;
	right: 20px;
	padding-left: 20px;
	text-decoration: none;
	width: 107%;
}

.subsubnav li a {
	display: block !important;
	background: transparent;
	padding: 3px;
	background: #fff !important;
	position: relative;
	right: 10px;
	padding-left: 10px;
	text-decoration: none;
	width: 107%;
}

.subnav li a:hover {
	background: #e9ecf3 !important;
}

.subnav li a:active {
	background: #cad9fb !important;
}

.seenontv_cart {
	text-align: right;
	display: inline-block;
	float: right;
}

.seenontv_cart a {
	text-decoration: none;
}

.seenontv_cart img {
	width: 20px;
}

#cs-find {
	margin-top:30px;
	width:50%;
}

#freeShip {
	width: 100%;
	text-align: center;
	margin-bottom:50px;
}
#freeShip img {
	width: 100%;
	position:absolute;
	left:0;
}
#freeShipMobile {
	width: 100%;
	text-align: center;
}
#freeShipMobile img {
	width: 100%;
}

#promo-store{
	max-width: 580px;
	width: 100%;
	padding: 10px 0;
}

.seenontv_cart img:first-child {
	margin-right: 5px;
}

.socialMedia {
	text-align: right;
	display: inline-block;
	width: 100%;
	margin: 0px;
	vertical-align: middle;
	font-weight: 800;
}

.socialMedia a {
	text-decoration: none;
}

.socialMedia img {
	width: 24px;
	margin-right: 5px;
	vertical-align: middle;
}

#cartsub {
	width: 175px;
	font-family: "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif !important;
	font-size: 1em !important;
}

.facebook {
	display: inline-block;
	background: url('/images/layout/sm_sprite.png') -34px -34px no-repeat;
	width: 30px; height: 30px;
}

.twitter {
	display: inline-block;
	background: url('/images/layout/sm_sprite.png') -2px -34px no-repeat;
	width: 30px; height: 30px;
}

.blog {
	display: inline-block;
	background: url('/images/layout/sm_sprite.png') -67px -34px no-repeat;
	width: 30px; height:30px;
}

#mainContent {
	/*position: relative;
	height: 800px;*/
	overflow-y: hidden; /*auto*/
	overflow-x: hidden;
}

a { color: #17479e; }
a:hover { color: #2b63c9; }
a:visited { color: #17479e; }
a:visited:hover { color: #2b63c9; }

#bottom {
	margin-top: 1em;
	height: 260px;
	color: #b1b4b7;
	font-size: 0.9em;
}

#bottomTopBar {
	width: 100%;
	height: 2em;
	background: #e9ecf3;
}

.bottomNav {
	display: inline-block;
	width: 10%;
	vertical-align: top;
	margin-top: 1.7em;
	line-height: 1.6em;
	margin-right: 15px;
	text-align: left;
}

.bottom {
	text-align: center;s
}

.bottomNav a {
	display: block;
	
}

#bottom a {
	color: #9da0a4;
	text-decoration: none;
}

#bottom a:hover {
	color: #b3b6ba;
}

#bottomCopy {
	display: inline-block;
	margin-top: 1em;
	/*width: 37%;
	font-size: 0.8em;
	position: relative;
	float: right;*/
}

#bottomCopyMobile {
	text-align: center;
}

header img {
	width: 100%;
}

#promo {
	position:relative;
	width: 792px;
	height: 36px;
	right: -403px;
	top:-13px;

}

/* Message Styles */
.messages {
	background-repeat: no-repeat;
	background-position: 10px center;
	padding: 10px 10px 15px 50px;
	background-color: #EEE;
	z-index: 1001;
	position: absolute;
	width: 500px;
	left: 200px;
	top: 0px;
	display: none;
}

.infoMsg {
	color: #00529B;
	/*background-color: #BDE5F8;*/
	background-image: url('../images/layout/msgInfo.png');
}

.successMsg {
	color: #4F8A10;
	/*background-color: #DFF2BF;*/
	background-image:url('../images/layout/msgSuccess.png');
}

.warningMsg {
	color: #9F6000;
	/*background-color: #FEEFB3;*/
	background-image: url('../images/layout/msgWarn.png');
}

.errorMsg {
	color: #D8000C;
	background-image: url('../images/layout/msgError.png');
}

.center { display: block; margin: 0 auto; }
.tcenter { text-align: center; } 
.tright { text-align: right; }
.nobr { margin: 0; }
.hidden { display: none; }
.right { text-align: right; }
.strong { font-weight: bold; }
.orange { color: #f99d32 !important; }
.blue { color: #006990 !important; }
.yellow { color: #f99d32 !important; }
.purple { color: #0068CF !important; }
.cspurple { color: #880D54 !important; }
.red { color: #e51937 !important; }
.black { color: #000 !important; }
.tleft { text-align: left; }
.bTop { border-top: 1px solid black; }
.vTop { vertical-align: top; }
.question { cursor: pointer; }
.small { font-size: 0.8em; }
.clear { clear: both; }

/* Added similar class styles for background colors */
.orange_background { background: #f99d32 !important; }
.blue_background { background: #006990 !important; }
.yellow_background { background: #f99d32 !important; }
.purple_background { background: #0068CF !important; }
.red_background { background: #e51937 !important; }
.black_background { background: #000 !important; }

#tool-tip {
	position: absolute;
	min-width: 150px;
	max-width: 300px;
	min-height: 50px;
	border-radius: 6px;
	box-shadow: 4px 4px 8px 0 #444;
	border: 1px solid #ccc;
	background: #fff url('/images/layout/tool-tip-back-bottom.png') repeat-x bottom;
	display: none;
	z-index: 1000;

}

#tool-tip-inner {
	padding: 6px;
}

.page-left {
	display:inline-block;
	margin-right: 1em;
	margin-left: 1em;
	width: 28.79%;
	/*width: 315px;*/
}

.page-left img {
	width: 100%;
}

.page-right {
	display:inline-block; 
	width: 66%;
	vertical-align:top;
}

#noscript, #closed {
	width: 100%;
	background: #8a1313;
	color: #fff;
	text-align: center;
	padding: 0.4em;
	border-bottom: 1px solid #fff;
}

/* Product Pages */
ul.product-features {
	padding: 0; margin: 0;
	overflow: visible;
	display: inline-block;
	margin-top: 1em;
}

.productTitle {
	position: relative; 
	/*right: 94px;*/
	float: right;
	top: 20px;
	margin-bottom: 1.5em;
	width: 115.5%;
}

.product-features li {
	list-style: none;
	font-size: 0.8em;
	padding-left: 1.5em;
	margin-bottom: 0.5em;
	line-height: 1.4em;
	
}

.product-features.text {
	list-style: none;
	font-size: 0.8em;
	//padding-left: 1.5em;
	margin-bottom: 0.5em;
	line-height: 1.4em;
	
}

.product-features.warmertext {
	list-style: none;
	font-size: 0.8em;
	//padding-left: 1.5em;
	margin-bottom: 0.2em;
	line-height: 0.9em;
	
}

.product-features li {
	vertical-align: top;
}

.product-features.orange li { background: url('/images/layout/bullet-orange.png') no-repeat left 3px; }
.product-features.blue li { background: url('/images/layout/bullet-blue.png') no-repeat left 5px; }
.product-features.yellow li { background: url('/images/layout/bullet-yellow.png') no-repeat left 3px; }
.product-features.purple li { background: url('/images/layout/bullet-purple.png') no-repeat left 3px; }
.product-features.cspurple li { background: url('/images/layout/bullet-cspurple.png') no-repeat left 3px; }
.product-features.red li { background: url('/images/layout/bullet-red.png') no-repeat left 3px; }
.product-features.smred li { background: url('/images/layout/smbullet-red.png') no-repeat left 3px; }

#colorBox {
	border: 1px solid black; 
	display: none; 
	height: 20px; 
	width: 45px;
	position: relative; 
}

#window360 {
	z-index: 100;
	position: absolute;
	right: 0px;
	top: 0px;
	display: none;
}

/*#overlay-content {
	background: #fff;
	padding: 30px;
	margin: 0 auto;
	vertical-align: middle;
	width: 300px;
	position: relative;
}*/

#areYouABusinessOverlay, #EUOverlay, #compareTractionOverlay, #compareSizeChart, #productsSizeChart, #videoOverlay {
	left: 0px !important;
	display: none;
	font-size: 10pt;
	color: #000000;
	/*position: fixed;
	top: 250px;*/
	background: #FFFFFF;
	padding: 10px;
	text-align: center;
	width: 50%;
	height: auto;
	margin: auto;
	border-radius: 5px;
}

#videoOverlay {
	background: #000000;
}

.compareSelectsColorWrapper {
	display: none;
}

.product-bottom {
	text-align: center;
	margin: 0 1em;
	padding: 10px;
}

/* Blog Pages */
.blogSep {
	height: 1em;
}

.post {
	display: inline-block;
	width: 100%;
}

#sm_Btns {
	/*position: absolute; 
	top: -35px; AB 3-24-2014 for product reviews*/ 
	width: 100%;
}

/* Cart */
#errorNotice {
	color: red;
}

#successNotice {
	color: green;
}

/* Mobile Nav */
#navMobile .arrowDown {
	position: absolute;
	right: 7px;
}

.arrowDown.active {
	-webkit-transform: rotate(180deg);     /* Chrome and other webkit browsers */
	-moz-transform: rotate(180deg);        /* FF */
	-o-transform: rotate(180deg);          /* Opera */
	-ms-transform: rotate(180deg);         /* IE9 */
	transform: rotate(180deg);             /* W3C complaint browsers */

	-webkit-transition-duration: 1s;
	-moz-transition-duration: 1s;
	-o-transition-duration: 1s;
	transition-duration: 1s;

	/* IE8 and below */
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=-1, DX=0, DY=0, SizingMethod='auto expand');

	right: 3px !important;
}

#navMobile h3 {
	text-align: left;
}

.mobileCart {
	text-align: right !important;
	background-color: #FFFFFF !important;
}

.mobileCartDIV li:hover {
	background-color: #FFFFFF !important;
}

#no_checkout {
	text-transform:uppercase;
	background-color:#e9ecf3;
	text-align:center;
	padding:1em;
	line-height:1.5em;
}

/**=======================
   Enter email here form
 =========================*/
#enter-email-form {
	display: inline;
}

#enter-email-text {
	font-size: .9em;
	font-weight: normal;
	max-width: 127px;
	width: 52%;
	border: 1px solid #6980AC;
	padding-left: 4px;
	height: 1.9em;
	box-sizing: border-box;
}

#email-form-submit {
	color: white;
	font-size: .8em;
	min-width: 14%;
	max-width: 77.5px;
	margin-right: 5px;
	padding: 0 6px;
	height: 1.9em;
	box-sizing: border-box;
}

#enter-email-label {
	color: black;
	font-size: .9em;
	padding-right: 6px;
	width: 40px;
}

.enter-email {
	vertical-align: bottom;
}

.enter-email-container {
	display: inline-block;
	vertical-align: bottom;
}

.submit-btn {
	color: white;
	font-weight: bold;
	background-color: #6980AC;
	border: 4px solid #6980AC;
	font-family: "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif;
	letter-spacing: 1px;
}

/* Media Queries */
@media screen and (max-width: 950px) {
	header, .mainSections, footer {
		padding: 0px 0.5em 0px 0.5em;
	}
	header {
		padding-top: 5px;
	}
	#nav {
		position: static;
		width: 100%;
		text-align: center;
	}
	.subnav {
		text-align: left;
	}
	#logo, #nav {
		display: block;
		margin: auto;
	}
	.seenontv_cart {
		width: 100%;
		float: none;
	}

}

@media screen and (min-width: 750px) {
	#bottomMobile {
		display: none;
	}


}

@media screen and (max-width: 750px) {
	#bottomCopyMobile {
		padding-top: 1.5em;
	}
	#nav ul {
		padding-left: 0px;
	}
	#nav li {
		margin-right: 1.5em;
	}
	#bottom {
		height: auto;
		padding-bottom: 1.5em;
		margin: 0px;
	}
	.bottom {
		display: none;
	}
	.page-left {
		margin-left: 0.5em;
	}

}

@media screen and (min-width: 605px) {
	#navMobile, .pageLeftMobile{
		display: none;
	}
}

@media screen and (max-width: 605px) {
	.page-left, .seenontv_cart, #nav {
		display: none;
	}
	#headerDivElements {
		text-align: center;
	}
	#logo {
		display: block;
		width: 100%;
	}
	header img {
		width: auto;
	}
	.pageLeftMobile {
		margin: 0px auto 15px auto;
		text-align: center;
	}
	.pageLeftMobile, .page-right {
		display: block;
		width: 100%;
	}
	.befIMG {
		width: 80%;
	}
	.socialMedia {
		display: none;
	}
	.holidayBanner {
		width: 88% !important;
	}
	#logo img {
		/*width: 47%;*/
	}
	.holidayBanner {
		width: 100% !important;
	}
}

@media screen and (max-width: 550px) {
	#freeShip {
		display: none;
	}
	#no_checkout {
		font-size: 12px;
	}
}
@media screen and (min-width: 550px) {
	#freeShipMobile {
		display: none;
	}
}


@media screen and (min-width: 400px) {
	#bottomMobileSmall, .holidayBannerWrapperMobile  {
		display: none;
	}
}

@media screen and (max-width: 400px) {
	#logo img {
		width: 70%;
	}
	#bottomMobile, .holidayBannerWrapper {
		display: none;
	}
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	/** Webkit Overrides **/
	.subnav {
		margin-left: 50px;
	}
	
	/** Fix for Bad Navigation Font in Webkit **/
	#nav ul {
		font-family: "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif;
	}
	
	.fb-like {
		top: 1px !important;
	}
	
	#sm_Btns {
		top: -35px !important;
	}

}

@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
	/** Presto Overrides **/
	
	#sm_Btns {
		top: -37px !important;
	}
	
	.fb-like {
		top: 0px !important;
	}
	
	#cartLink {
		float: right;
		padding: 0 0.3em !important;
		padding-top: 0.4em !important;
		margin: 0px;
	}
	
	#nav li { 
		padding: 0 1em !important; 
		padding-top: 0.4em !important;
	}
	
	#nav { font-weight: bold; }
}

/* Smaller tablets and desktops */
@media only screen and (max-width: 1548px) {
}


/* Bigger than Mobile phones */
@media screen and (min-width: 605px) {
	#enter-email-text {

	}

	#email-form-submit {
		font-size: .9em;
	}
}

/* Smaller screens */
@media screen and (max-width: 385px) {
	#enter-email-text {
		font-size: .8em;
		padding: 5px 4px 4px 4px;
	}	
}

/* Smallest screen */
/* Still looks good at 320px */
@media screen and (max-width: 350px) {
	#mobile-cart-top {
		padding-left: 0px;
		padding-right: 0px;
	}
}