#homepage *, #homepage *:before, #homepage *:after, .bb * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;  }
.ribbon { padding: 10px 0 8px; text-align: center; }

/* ==========================================================================
   Large layout styles
   ========================================================================== */
.row-padded { padding: 4em 0 7em; }
.row-two-col { padding-bottom: 2em; }
.row-two-col .grid-wrapper { width: 80%; float: left; padding: 0 5% 2%; border-right: 1px solid #ddd; }
.row-two-col aside { float: left; width: 20%; padding:4em 0 40px 30px; margin-top:-3%; }
.row-gray { background: #f1f1f1; border: 1px solid #ccc; }
.sub-header { font-size: 1.4em; max-width: 1023px; margin: 0 auto; position: relative; left: -3px;  text-align: center;}
.sub-header.hidearrow:before { display: none; }
.sub-header li { display: inline-block; line-height: 3em; padding: 0 .3em; font-size: 1em }
.sub-header li:before { content: "|"; display: inline; color: #ccc; padding-right: 1em; }
.sub-header li:first-child:before { content: ""; }
.hp-dropdown { text-align: center; padding-bottom: 1.5em; }
#top-designers .dropdown-tag { display: none; }
#new-noteworthy { font-size: 2.8em; margin-top: 30px; }
.bestsellers-wrapper, #handpicked_designs_wrapper, #recently_viewed_wrapper { position: relative; z-index: 4; }
.hp-dropdown .dropdown-tag { cursor: pointer; padding: 5px 15px }
.hp-dropdown .dropdown-tag:hover { background: #fff; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f3f3f3'); background-image: -webkit-linear-gradient(top,#fff,#f3f3f3); background-image: -moz-linear-gradient(top,#fff,#f3f3f3); background-image: -ms-linear-gradient(top,#fff,#f3f3f3); background-image: -o-linear-gradient(top,#fff,#f3f3f3); background-image: linear-gradient(top,#fff,#f3f3f3); border: 1px solid #ddd; }
.hp-dropdown sup { font-size: .55em; vertical-align: middle; padding-left: 5px; }
.hp-dropdown ul { margin-bottom: 10px; }
.grid-unit { float: left; width: 25%; padding: 0 1% 3em 1%; font-size: 1.4em; }
.grid-unit .img-wrap { width: 100%; height: 100%; border: 1px solid #ccc; padding-bottom: 100%; position: relative; overflow: hidden; background: #fff; box-shadow: 1px 1px 3px rgba(0,0,0,.3) }
.grid-unit img { display: block; position: absolute; top: 0; left: 0; max-width: 100%; width:100%;}
.grid-unit .grid-name { float: left; padding-top: .6em; padding-bottom: .1em; color: #333; max-width: 70%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.grid-unit .grid-time { float: right; padding-top: 1em; color: #999; font-family: Arial, sans-serif; font-size: .8em; max-width: 30%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.grid-wrapper button { clear:both; font-size: 1.5em; width: 120px; }
#homepage aside ol { height: 240px; overflow: hidden;}
#homepage aside .asideTrending ol {height: 480px;}
.trending-topic-list {margin-left: 28px;}
#homepage ol .sub-link a { color: #999; font-size: .875em; }
#homepage aside ol h3 { margin-left: 0px; }
#homepage aside h3 { margin: 0 0 .5em 0; }
#homepage aside h3 i { margin: 0 5px 0 3px; font-size: .85em; }
#homepage aside li { font-size: 1.6em; padding: .5em 0; }
.asideTrending > li {margin-left: 28px;}
.clear {clear:both;}
.asideTrending {min-height:240px; margin-bottom:1em;}
.icon-caret-down.asideArrowUp {float: left; font-size: 1.5em; text-align: center; width: 30%; border: 1px solid #DDDDDD; margin:0 .5em 0 .5em; text-decoration: none; cursor: pointer; transition: all .4s; -o-transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s;}
.icon-caret-up.asideArrowDown {float: left; font-size: 1.5em; text-align: center; width: 30%; border: 1px solid #DDDDDD; text-decoration: none; cursor: pointer; transition: all .4s; -o-transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s;}
.asideArrowDown.inactive,
.asideArrowUp.inactive { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); -khtml-opacity: 0.4; -moz-opacity: 0.4; opacity: 0.4; cursor: default; }
.asideBottomBorder {border-bottom: 1px solid #ddd; margin:3em 0; width:80%;}
.asideDiv {min-height:195px; overflow:hidden; height:260px; margin-bottom:.5em; margin-left: 8px;}
.asideDiv > ul {overflow: hidden; height:230px;}
.seocopy { padding: 3em 6em 4em; font-size: 1.6em; line-height: 1.6em; font-family: Arial, sans-serif; }
.seocopy h2 { color: #79a618; font-size: 1.4em; margin-bottom: 20px; font-family: Roboto Condensed, sans-serif; }
.seocopy a { color: #79a618; }

.new-dropdown { position: relative; z-index: 6; }
.new-dropdown .break { height: 1em; }
.new-dropdown sup { font-size: .8em; }
.new-dropdown-list { display: none; position: absolute; top: 35px; box-shadow: 2px 3px 3px rgba(0,0,0,.3); background: #fff; padding-bottom: .5em; }
.new-dropdown:hover .new-dropdown-list { display: block; }
.sub-header .new-dropdown li { line-height: 1.4em; padding: .1em 0 .1em 1.6em; font-family: Arial, sans-serif; font-size: .8em; width: 165px; float: left; text-align: left;}
.sub-header .new-dropdown li:before {content: ""; padding: 0; }

/* promo area */
.hero-banner { width: 100%; overflow: hidden; box-shadow: 1px 1px 3px rgba(0,0,0,.3); position: relative;}
.hero-banner-outer { width:200%; }
.hero-banner-wrap { width: 50%; float: left }
.hero-banner-wrap a { float: left; border-left: 1px solid #fff; position: relative; width: 33.33%; margin-bottom: -1px; }
.hero-banner-wrap a:first-child { border-left: none; }
.hero-banner-wrap a img { max-width: 100%; width: 100%; height: auto;}
.hero-banner-copy:hover {top: 0; padding-top: 13%;}
.hero-banner-copy:hover .hbc-offer { font-weight: bold; }
.hero-banner-copy { position: absolute; top:85.5%; width: 100%; height: 230px; background: #777777; background: rgba(0,0,0,.6); padding: 1% 0 0; font-size: 1.5em; text-align: center; transition: all .4s; -o-transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s;}
.hero-banner-copy span { display: block; text-shadow: 1px 1px 2px #333;}
.sub-copy { width: 90%; margin: auto; color: #fff }
.hero-banner-copy .button { display: inline-block; font-size: 1em; margin: 15px 0; text-shadow: none; }
.hbc-offer, .hbc-offer-2x, .hbc-offer-3x { font-size: 1.3em; color: #fff; margin: 0 0 7px; transition: all .4s; -o-transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s; }
.hbc-offer-2x { font-size: 2.5em }
.hbc-offer-3x { font-size: 3.5em }
#s15-button { display: none; }
.slide-controls { position: absolute; top: 38%; font-size: 5em; width: 100%; }
.slide-controls i {position: absolute; cursor: pointer; transition: all .4s; color: #fff; }
.slide-controls i:hover { color: #fff; text-shadow: 1px 1px 3px rgba(0,0,0,.5); }
.slide-controls .icon-angle-left { left: 8px; padding: 0 15px 0 8px; }
.slide-controls .icon-angle-right { right: 2px; padding: 0 8px 0 15px;  }

/* dropdown module */
.hp-dropdown { position: relative; }
.hp-dropdown .icon-refresh { display: block; color: #777; font-size: .9em; }
.hp-dropdown span, .hp-dropdown h1 { position: relative; z-index: 3; font-size: 1em; display:inline; }
.dropdown-module { display: none; background: #FFF; border: 1px solid #ddd; width: 100%; max-width: 810px; position: absolute; left: 0; right: 0; margin: auto; top: -1em; padding: 2.75em 5% 1em 5%; z-index: 2;
	-moz-box-shadow: 1px 1px 4px #ccc; 
	-webkit-box-shadow: 1px 1px 4px #ccc; 
	-o-box-shadow: 1px 1px 4px #ccc; 
	box-shadow: 1px 1px 4px #ccc;
}
.dropdown-module li { font-size: .5em; /*18px*/ border: 1px solid #ccc; display: inline-block; margin: 0 0 .8em 2.5%; text-transform: none; cursor: pointer; padding: .5em 1em; border-radius: 30px; }
.dropdown-module li:first-child { margin-left: 0; }
.dropdown-module li:hover,
.dropdown-module li.active { background: #79a618; color: #FFF; }
.dropdown-module li.active { cursor: default; }
.dropdown-search { margin: auto; width: 70%; font-size: .5em; display: inline-block; }
.dropdown-searchbox { outline:none; border: 1px solid #ddd; padding: 5px; height: 31px; font-size: 1.2em; width: 70%; vertical-align: top;}
#dropdown-searchbutton { display: inline-block; padding: 2px 10px; margin: 0; background: #79a618; color: #FFF; cursor: pointer; line-height: 27px; border: none; text-align: center; margin-left: -3px; vertical-align: top;}

/* mini user module (top designers) */
.user-module { background: #FFF; float: left; width: 170px; height: 227px; padding: 20px 0; text-align: center; border: 1px solid #ddd; margin-left: 46px;
	-moz-box-shadow: 1px 1px 4px #ccc; 
	-webkit-box-shadow: 1px 1px 4px #ccc; 
	-o-box-shadow: 1px 1px 4px #ccc; 
	box-shadow: 1px 1px 4px #ccc;
}
.user-module:first-child { margin-left: 0; }
.profile-photo-container { overflow: hidden; border-radius: 50%; width: 85px; height: 85px; border: 1px solid #ddd; margin: 0 auto 5px; }
.profile-photo-container img { width: 85px; }
.user-module h4 { line-height: 2em; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 90%; margin: auto; }
.user-module-dept { font-size: 1.4em; line-height: 2.8em; color: #999; }

.row-gray .wrapper { position: relative; }
.carousel-wrap { position: relative; margin: 0 11%; padding: 0 0 5px; overflow: hidden; }
.carousel-inner { width: 10000px; transition: margin 1s ease-out; -o-transition: margin 1s ease-out; -moz-transition: margin 1s ease-out; -webkit-transition: margin 1s ease-out;}
.carousel-nav { cursor: pointer; }
#carousel-prev, #carousel-next { width: 40px; height: 40px; background: #FFF; border-radius: 50%; position: absolute; top: 50%; }
#carousel-prev i, #carousel-next i {display: block; margin: 10px auto; width: 15px; text-align: center; }
a#carousel-prev:hover , a#carousel-next:hover { color: #fff; background: #777;}
#carousel-prev, #carousel-next { color: #777; }
#carousel-prev { left: 5%; }
#carousel-next { right: 5% ; }

#hp-promo {background-repeat: no-repeat; height: 660px; }
.hp-promo-overlay { background: #FFF; background: rgba(255,255,255,.9); float: right; position: relative; right: 10%; top: 10%; width: 54%; text-align: center; padding: 4em 0 9em 0; }
.hp-promo-overlay h2 { font-size: 3.6em; }
.hp-promo-overlay ul { font-size: 2em; margin: 2em auto; list-style-type: disc; width: 50%; text-align: left; }
.hp-promo-overlay ul li { margin-top: 1.5em; font-size: .5em; }
.hp-promo-overlay ul li span { font-size: 2em; }
.hp-promo-overlay ul li:first-child { margin: 0; }
.hp-promo-overlay blockquote { font-size: 2.6em; color: #777; font-style: italic; padding: 0 3em; line-height: 1.5em; }
#hp-promo-cta { display: block; background: #79a618; width: 120px; height: 120px; border-radius: 50%; color: #FFF; font-weight: bold; font-size: 2em; text-transform: uppercase; padding: 2em .5em; position: absolute; left: 43%; bottom: -60px; }
#hp-promo-cta:hover { text-decoration: none; background: #8cbe21; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cbe21', endColorstr='#79A618'); background-image: -webkit-linear-gradient(top,#8cbe21,#79A618); background-image: -moz-linear-gradient(top,#8cbe21,#79A618); background-image: -ms-linear-gradient(top,#8cbe21,#79A618); background-image: -o-linear-gradient(top,#8cbe21,#79A618); background-image: linear-gradient(top,#8cbe21,#79A618); -moz-box-shadow: 1px 1px 4px #555; -webkit-box-shadow: 1px 1px 4px #555; -o-box-shadow: 1px 1px 4px #555; box-shadow: 1px 1px 4px #555;  }

.mobile-promos {display:none;}

/* Holiday-Seasonal-Occasion Carousel */

.bestsellers-wrapper {margin-top: -2em;}

/*holiday section not carousels*/
.holiday-section {width:100%; overflow: hidden; padding-bottom:10px; display: none;}

.featured-txt {text-align: center; margin-bottom: 15px;}
.featured-txt img, .featured-txt h2 {display: inline-block; vertical-align: middle; font-size: 28px;}

.holiday-section a {float:left; width:25%; padding:0 1% 2% 1%; text-align: center;}
.holiday-section a:hover {opacity: 0.8;}
.holiday-section a img {width: 100%;}
.holiday-section a span {display: block; padding:5px 0 8px 0; font-size: 16px;}

/* Recently viewd carousel */
.rvp {background-color:white; width: 100%; overflow: hidden; position:relative; margin-top:6px; margin-bottom:9px;}
.rvp.loaded {border-bottom : 1px solid #ddd;}
.rvp-items{position: relative; margin:4px;}
.rvp-heading h2 {margin-top: 10px; text-align:center; text-transform:uppercase;}
.rvp .rvp-item {cursor:pointer; height:130px; margin:14px; position:relative; width:138px; float: left; }
.rvp-item img {text-align:center; width:130px; height:130px;}
.rvp .slide-controls { position: absolute; top: 40%; left:0; font-size: 2.5em; width: 100%; text-align: center; }
.rvp .slide-controls i {position: absolute; cursor: pointer; transition: all .4s; color: #777; box-shadow: 1px 1px 3px rgba(0,0,0,.3); border: 1px solid #ddd; background: #fff; border-radius: 50%; width: 34px; height: 34px; line-height: 31px; display: block;}
.rvp .slide-controls i:hover { color: #fff; background: #777; border-color: #777; }
.rvp .slide-controls .icon-angle-left { left: -40px; padding-left: 0; padding-right: 4px; }
.rvp .slide-controls .icon-angle-right { right: -40px; padding-right: 0; padding-left: 4px; }
.rvp:hover .slide-controls .icon-angle-left { left: 10px;  }
.rvp:hover .slide-controls .icon-angle-right { right: 10px;  }
.rvp .carousel { overflow: hidden; }
#global-frame  .rvp-item {margin:14px; position:relative; width:132px; height:132px; float: left; }

/* ==========================================================================
   Medium layout styles
   ========================================================================== */
@media all and (max-width: 1100px){
  .row-two-col aside { display: none; }
  .row-two-col .grid-wrapper { width: 100%; }
  .hp-promo-overlay { font-size: .9em; }
  .hp-promo-overlay ul { width: 67%; }
  #hp-promo-cta { left: 40%; }
  .hero-banner-copy:hover{ padding-top: 9%; }
  .hbc-offer, .hbc-offer-2x, .hbc-offer-3x { font-size: 1.1em; }
  .hero-banner-copy { top: 84%; }
  #holidayHomepage {width:100%;border-right:none;}
  .holiday-section {width: 100%;}
}

@media all and (max-width: 970px){
  .hero-banner-copy:hover { padding-top: 5%; }
  .hero-banner-copy:hover .hbc-offer { font-size: 1.5em; }
  .hero-banner-copy { display: block; top: 15%; left: 8%; width: 50%; height: 70%; font-size: 1.5em; padding:5% 0 0; box-shadow: 0px 0px 20px rgba(0,0,0,.1)}
  .hero-banner-copy .button { font-size: 1em; }
  .hbc-offer, .hbc-offer-2x, .hbc-offer-3x { font-size: 1.5em; font-weight: bold;  }
  .hero-banner-wrap a:hover .hero-banner-copy { top: 15%; }
  .sub-header { display: none; }
  .slide-controls, .holiday-controls {display: none; }
  .hero-banner { overflow-x: scroll; -webkit-overflow-scrolling: touch; width: 100%; }
  .hero-banner-outer { width: 2880px; }
  .hero-banner-wrap { width: 1440px; }
  .footer-social { float: left; }
  #holidayHomepage {margin: 20px 0 0 0;}
  .holiday-carousel-outer {overflow-x: scroll; -webkit-overflow-scrolling: touch;}
  .rvp  { overflow-x: scroll; -webkit-overflow-scrolling: touch; width: 100%; }
}

@media all and (max-width: 770px){
  .grid-unit { width: 33.33%; }
  span.collapse-tag { display: none; }  
  #hp-promo { background-position-x: 25%; }
  .hp-promo-overlay h2 { font-size: 3em; }
  .hp-promo-overlay blockquote { line-height: 1.3em; font-size: 1.5em; }
  #hp-promo-cta { left: 36%; }
  .hp-dropdown .dropdown-tag { background: #fff; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f3f3f3'); background-image: -webkit-linear-gradient(top,#fff,#f3f3f3); background-image: -moz-linear-gradient(top,#fff,#f3f3f3); background-image: -ms-linear-gradient(top,#fff,#f3f3f3); background-image: -o-linear-gradient(top,#fff,#f3f3f3); background-image: linear-gradient(top,#fff,#f3f3f3); border: 1px solid #ddd; }
  #top-designers .dropdown-module { width: 90%; }
  .seocopy { display: none; }
  .user-module { margin-left: 2em; }
  .carousel-wrap { overflow-x: scroll; -webkit-overflow-scrolling: touch; }
  #carousel-next { right: 2%; }
  #carousel-prev { left: 2%; }
}

@media all and (max-width: 570px){
  .hero-banner-wrap a:hover .hero-banner-copy { padding-top: 3.5%; }
  .hero-banner-wrap a { border-left: 2px solid #777; }
  .hero-banner-copy { top: 25%; left: 25%; width: 50%; height: 25%; font-size: .8em; padding-top: 3.5%; }
  .hbc-offer, .hbc-offer-2x, .hbc-offer-3x { font-size: 1.5em; }
  .hero-banner-copy .button { font-size: 1.2em; }
  .hero-banner-copy .sub-copy { display: none; }
  .hero-banner-wrap a:hover .hero-banner-copy { top: 25%; }
  .grid-unit { width: 50%; }
  #hp-promo-cta { left: 29%; }
  .hp-dropdown { font-size: 1.6em; text-transform: capitalize; }
  #new-noteworthy { font-size: 1.6em; text-transform: uppercase; margin-top: 20px; }
  .hp-dropdown .dropdown-tag { display:block; width:80%; margin: auto; padding: 8px 4%;}
  .hero-banner-outer { width: 1780px; }
  .hero-banner-wrap { width: 890px; }
  .row-padded { padding: 2em 0 0; }
  .row-gray { padding-bottom: 7em; }
  .carousel-wrap { margin: 0 5%; }
  .user-module { width: 135px; margin-left: 1.5em; }
  .user-module h4 { font-size: 1.4em; }
  #carousel-prev, #carousel-next { top: 105%; }
  #carousel-next { right: 35%; }
  #carousel-prev { left: 35%; }
  .hp-promo-overlay { width: 100%; right: 0; top: 0; }
  #hp-promo { background: none; height: auto; margin-bottom: 100px; }
  #hp-promo:after { content: ""; clear:both; display: block; }
  .dropdown-module { padding-top: 4.25em; }
  .dropdown-module li { width: 100%; font-size: 1em; margin-left: 0 ;}
  #holidayHomepage h2, .rvp-heading h2 {font-size: 2.2em;}
  .holiday-section a {width: 50%;}
  .mobile-promos a {margin:1em; display: block;}
  .mobile-promos img {width: 100%;}
}
