@charset "utf-8";
/* CSS Document */

#marketing ul li {
display:inline;
}

#marketing li {
margin-right:15px;
list-style-type: none;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}

#wrapper {
width: 950px;
margin-right:auto;
margin-left: auto;
margin-top: -20px;
 
}
 
#wrapper .spec {
margin:0;
}
 
 
 
#specialty {
float:left;
margin-bottom: 0;
}
 
#specialty li {
list-style-type: none;
}
 
 
#featured ul{
float:left;
width: 142px;
margin-bottom:0;
margin-left: 8px;
 
}
 
#featured li {
list-style-type:none;
}
 
.lifestyle {
 
font-family: verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight:bold;
color:#993333;
margin-left:-25px;
}
 
 
 
 
#cat li {
list-style-type:none;
font-family: verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
line-height: 128%;
text-align:left;
margin-left: -15px;
 
}
 
#cat a:link{
list-style-type:none;
font-family: verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
text-align:left;
color:black;
text-decoration:none;
}

#cat a:hover{
color:#49B315;
}
 
#cat a:visited{
list-style-type:none;
font-family: verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
text-align:left;
 
}
 
.addbrands {
padding-left: 20px;
margin-top: 22px;
 
}
 
#addshops {
text-align:center;
}
 
#addshops li {
display: inline;
font-size: 13px;
 
}
 
#addshops li a:link {
color:black;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
 
}
 
#addshops li a:visited {
color:black;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
 
}
 
li a:hover {
text-decoration:none;
}
 
.myBox
{
    margin: 0 auto;
 	margin-top: 30px;
	padding-bottom:130px;
    border: none;
    color: #ffffff;
 	width: 100%;
    background-color: #ffffff;
 }
 
 
#shops {
list-style: none;
margin-top:0;
padding-left: 0;
}
 
#shops li {
display:inline;
margin-left: 2px;
}
 
#topbrands li {
list-style: none;
display:inline;
margin-top:none;
margin-right: 20px;
}
a:hover {color:#000;}

#container {
	float:left;

	width:600px;
	height:410px;
	margin:0 auto;
	font-family:verdana, arial, sans-serif;
	font-size:12px;
}



#container a.pics {float:left; margin:7px; display:inline; color:#000; text-decoration:none;  width:130px; height:50px; cursor:default;}
#container a.pics img.thumb {display:block; border:0;}

#container a.pics span {display:none; border:0; width:580px;   text-align:center;}
#container a.pics span img {margin:10px auto; border:0; }

#container a.pics:hover {white-space:normal; }
#container a.pics:hover span {display:block; position:absolute; left:325px; top:70px; z-index:10; height:400px;}
#container a.pics span.initial {display:block; position:absolute; left:325px; top:70px; z-index:10; height:400px;}
#container a.pics:active {border:0;} 
#container a.pics:active span {display:block; position:absolute; left:325px; top:70px; z-index:5; height:400px;}

#container a.pics:focus {border:0; outline:0;}
#container a.pics:focus span {display:block; position:absolute; left:325px; top:70px; z-index:5; outline:0;}

#container span.info {clear:left; display:block; text-align:center; line-height:20px; margin:0; padding:200px 0 0 0; width:600px; text-align:center; color:#eee; z-index:1;}
#container span.info a {color:#000;}
#container span.info a:hover {text-decoration:none;}

 /* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
	font: 12px Arial, Helvetica, sans-serif;
	color: #333333;
}

#TB_secondLine {
	font: 10px Arial, Helvetica, sans-serif;
	color:#666666;
}

#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
	position: fixed;
	z-index:100;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}

.TB_overlayMacFFBGHack {background: url(../../AppData/Local/Microsoft/Windows/Temporary%20Internet%20Files/Content.IE5/7MKBH7AE/macFFBgHack.png) repeat;}
.TB_overlayBG {
	background-color:#000;
	filter:alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window {
	position: fixed;
	background: #ffffff;
	z-index: 102;
	color:#000000;
	display:none;
	border: 4px solid #525252;
	text-align:left;
	top:50%;
	left:50%;
}

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
	display:block;
	margin: 15px 0 0 15px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
}

#TB_caption{
	height:25px;
	padding:7px 30px 10px 25px;
	float:left;
}

#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
}

#TB_closeAjaxWindow{
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
}

#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
}

#TB_title{
	background-color:#e8e8e8;
	height:27px;
}

#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
	padding:15px;
}

#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
}

#TB_load{
	position: fixed;
	display:none;
	height:13px;
	width:208px;
	z-index:103;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect{
	z-index:99;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	filter:alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	height:100%;
	width:100%;
}

* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
	_margin-bottom:1px;
}

.cssform p{  width: 380px;  clear: left;  margin: 0;  font-family: Verdana, Arial, Helvetica, sans-serif;  font-size: 11px;  padding: 5px 0 8px 0;  /*width of left column containing the label elements*/  border-top: 1px dashed gray;  height: 1%;  }    .cssform label{  font-weight: bold;  float: left;  /*width of left column*/  width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/  }    .cssform input[type="text"]{ /*width of text boxes. IE6 does not understand this attribute*/  width: 180px;  }    .cssform textarea{  width: 250px;  height: 150px;  }   

#itemHtml{
	padding-bottom:15px;
}

#footerlinks h4 {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    
    color: #3a3a3a;
    font-size: 15px;
    padding: 13px 0 13px 20px;
    text-transform: uppercase;
}
#padding {
    padding-bottom: 10px;
    padding-top: 13px;
    position: relative;
}
/* overrite global.css   */
#tmfooterlinks ul li form {
  width: 100%;
}
.social-icons .youtube {
    background-position: -114px 0;
} 
.social-icons .tumblr {
    background-position: -144px 0;  !important;
}
#spacer {
    padding-bottom: 10px;
    padding-top: 10px;
    position: relative;
	
}
/*  COMMUNITY PAGE social button imgs */ 
img.addsocial {
    border: 0px solid #FFFFFF !important;
    border-radius: 0px !important;
    width: 32px !important;
	height: 32px !important;
}

	


/* add new .step  style from /JS/modules/tmbannerblock/css/style.css   */
.step2 {float:left; position:relative; border:7px solid #fff;-webkit-box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.1);
-moz-box-shadow:    0px 0px 5px rgba(50, 50, 50, 0.1);
box-shadow:         0px 0px 5px rgba(50, 50, 50, 0.1); margin-right:10px;margin-top:10px;	-webkit-transition: all 0.3s ;
-moz-transition: all 0.3s ;
-ms-transition: all 0.3s ;
-o-transition: all 0.3s ;
transition: all 0.3s ;}
.step2:hover{-webkit-box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.3);
-moz-box-shadow:    0px 0px 5px rgba(50, 50, 50, 0.3);
box-shadow:         0px 0px 5px rgba(50, 50, 50, 0.3);-webkit-transition: all 0.3s ;
-moz-transition: all 0.3s ;
-ms-transition: all 0.3s ;
-o-transition: all 0.3s ;
transition: all 0.3s ;}
.step2 + div + div { margin-right:0}
.step2 a{ display: inline-block; margin:0; padding:0;}
.step2 a:hover{ text-decoration:none;}
.step2.num-1 .jms-content{position:absolute; left:25px; top:22px; display:none!important;}
.step2.num-2 .jms-content{position:absolute; left:25px; top:32px;display:none!important;}
.step2.num-3 .jms-content{position:absolute; left:60px; top:66px;display:none!important;}
#banner-2 .step2.modile-1.num-3 img{}
.step2.num-3 { margin-right:0;}
.step2 p {}
.step2 p span{ }
.step2 p span.item1{}
.step2.num-1:hover h3{}
.step2.num-1:hover p{}
.step2.num-1:hover span.item1{}

.step2.num-2 h3{ }
.step2.num-2 p {  }
.step2.num-2 p span.item2{}

.step2.num-2:hover h3{}
.step2.num-2:hover p{}
.step2.num-2:hover p span.item2{}


.step2.num-3 h3{}
.step2.num-3 p{}

.step2.num-3:hover h3{}
.step2.num-3:hover p{}

.step2.modile-1.num-1 h3{ }
.step2.modile-1.num-1 p {}
.step2.modile-1.num-1 p span.item1{}

.step2.modile-1.num-2 h3{}
.step2.modile-1.num-2  p{ }
.step2.modile-1.num-2 p span.item2 {}


.step2.modile-1.num-3 h3{}
.step2.modile-1.num-3 p{}
 
 
 
/* newsletter modal   */

.reveal-newslettermodal-bg { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: #000000; background: rgba(0, 0, 0, 0.45); z-index: 1004; display: none; left: 0; }

.reveal-newslettermodal, dialog { visibility: hidden; display: none; position: absolute; z-index: 1005; width: 100vw; top: 0; border-radius: 3px; left: 0; background-color: #FFFFFF; padding: 1.25rem; border: solid 1px #666666; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); padding: 1.875rem; }
@media only screen and (max-width: 40em) { .reveal-newslettermodal, dialog { min-height: 100vh; } }
.reveal-newslettermodal .column, dialog .column, .reveal-newslettermodal .columns, dialog .columns { min-width: 0; }
.reveal-newslettermodal > :first-child, dialog > :first-child { margin-top: 0; }
.reveal-newslettermodal > :last-child, dialog > :last-child { margin-bottom: 0; }
@media only screen and (min-width: 40.063em) { .reveal-newslettermodal, dialog { width: 40%; max-width: 40.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-newslettermodal, dialog { top: 6.25rem; } }
.reveal-newslettermodal.radius, dialog.radius { border-radius: 3px; }
.reveal-newslettermodal.round, dialog.round { border-radius: 1000px; }
.reveal-newslettermodal.collapse, dialog.collapse { padding: 0; }
@media only screen and (min-width: 40.063em) { .reveal-newslettermodal.tiny, dialog.tiny { width: 30%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-newslettermodal.small, dialog.small { width: 40%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-newslettermodal.medium, dialog.medium { width: 60%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-newslettermodal.large, dialog.large { width: 70%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-newslettermodal.xlarge, dialog.xlarge { width: 95%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
.reveal-newslettermodal.full, dialog.full { top: 0; left: 0; height: 100%; height: 100vh; min-height: 100vh; margin-left: 0 !important; }
@media only screen and (min-width: 40.063em) { .reveal-newslettermodal.full, dialog.full { width: 100vw; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
.reveal-newslettermodal .close-reveal-newslettermodal, dialog .close-reveal-newslettermodal { font-size: 2.5rem; line-height: 1; position: absolute; top: 0.5rem; right: 0.6875rem; color: #AAAAAA; font-weight: bold; cursor: pointer; }

dialog { display: none; }
dialog::backdrop, dialog + .backdrop { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: #000000; background: rgba(0, 0, 0, 0.45); display: none; left: 0; }
dialog[open] { display: block; }

@media print { dialog, .reveal-newslettermodal, dialog { display: none; background: #FFFFFF !important; } }


/*   modal   */

.reveal-modal-bg { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: #000000; background: rgba(0, 0, 0, 0.45); z-index: 1004; display: none; left: 0; }

.reveal-modal, dialog { visibility: hidden; display: none; position: absolute; z-index: 1005; width: 80vw; height:20vm; top: 0; border-radius: 3px; left: 0; background-color: #FFFFFF; padding: 1.25rem; border: solid 1px #666666; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); padding: 1.875rem; }
@media only screen and (max-width: 40em) { .reveal-modal, dialog { min-height: 20vh; } }
.reveal-modal .column, dialog .column, .reveal-modal .columns, dialog .columns { min-width: 0; }
.reveal-modal > :first-child, dialog > :first-child { margin-top: 0; }
.reveal-modal > :last-child, dialog > :last-child { margin-bottom: 0; }
@media only screen and (min-width: 40.063em) { .reveal-modal, dialog { width: 40%; max-width: 40.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-modal, dialog { top: 6.25rem; } }
.reveal-modal.radius, dialog.radius { border-radius: 3px; }
.reveal-modal.round, dialog.round { border-radius: 1000px; }
.reveal-modal.collapse, dialog.collapse { padding: 0; }
@media only screen and (min-width: 40.063em) { .reveal-modal.tiny, dialog.tiny { width: 30%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-modal.small, dialog.small { width: 40%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-modal.medium, dialog.medium { width: 60%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-modal.large, dialog.large { width: 70%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
@media only screen and (min-width: 40.063em) { .reveal-modal.xlarge, dialog.xlarge { width: 95%; max-width: 62.5rem; left: 0; right: 0; margin: 0 auto; } }
.reveal-modal.full, dialog.full { top: 0; left: 0; height: 100%; height: 0vh; min-height: 20vh; margin-left: 0 !important; }
@media only screen and (min-width: 40.063em) { .reveal-modal.full, dialog.full { width: 80vw; max-width: 62.5rem; height:20vm; left: 0; right: 0; margin: 0 auto; } }
.reveal-modal .close-reveal-modal, dialog .close-reveal-modal { font-size: 2.5rem; line-height: 1; position: absolute; top: 0.5rem; right: 0.6875rem; color: #AAAAAA; font-weight: bold; cursor: pointer; }

dialog { display: none; }
dialog::backdrop, dialog + .backdrop { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: #000000; background: rgba(0, 0, 0, 0.45); display: none; left: 0; }
dialog[open] { display: block; }

@media print { dialog, .reveal-modal, dialog { display: none; background: #FFFFFF !important; } }

/*   flex video   */
.flex-video {
  height:0;
  margin-bottom:1rem;
  overflow:hidden;
  padding-bottom:67.5%;
  padding-top:1.5625rem;
  position:relative;
}
.flex-video { position: relative; padding-top: 1.5625rem; padding-bottom: 67.5%; height: 0; margin-bottom: 1rem; overflow: hidden; }

.flex-video.widescreen { padding-bottom: 56.34%; }

.flex-video.vimeo { padding-top: 0; }

.flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }