tr_styles.css trends.js <!-- DELIVERY --><!--[if IE 7 ]> <div id="content" class="tr-page tr-landing clearfix ie7"> <![endif]--><!--[if IE 8 ]> <div id="content" class="tr-page tr-landing clearfix ie8"> <![endif]--><!--[if IE 9 ]> <div id="content" class="tr-page tr-landing clearfix ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--><div id="content" class="tr-page tr-landing clearfix"><!--<![endif]--> <!-- CSS specific to Trends Landing page --> <style media="screen,projection"> #content.tr-page {padding: 15px 25px 25px;} #content.ie7 {width: 892px !important;} #content .font-replaced { font-weight: 200; line-height: .8; } /* content header styles */ .tr-header { margin-bottom: 15px; position: relative; width:895px; } .tr-header h1 { font-size: 48px; margin-bottom: 1px; text-transform: uppercase; } .tr-header h1 > span { display:inline; font-family: Arial,sans-serif; font-size: 14px; text-indent: 0; } .tr-header .tr-social { bottom: 25px; height:19px; position:absolute; right:0; width: 22%; } #tr-page-fb-like { left:67px; overflow:hidden; position:absolute; width:82px; } .tr-header .tr-social > ul { float: right; list-style: none; padding:0; margin:0; } .tr-header .tr-social li { float: left; margin-left: 5px; } /* end content header styles */ /* main content styles */ .tr-page .tr-main { float:left; padding:0 30px 0 0; width:582px; } .tr-page .tr-main .tr-hero { margin-bottom:10px; position: relative; } .tr-page .tr-trend { font-family: Aria,sans-serif; margin-bottom: 10px; } .tr-page .tr-trend-type { color: #717171; font-family: Arial,sans-serif; font-size: 8px; font-weight: normal; margin-bottom: 5px; text-transform: uppercase; } #content.tr-page .tr-main .tr-hero .tr-trend-title {margin-bottom: 5px;} .tr-page .tr-main .tr-hero h2.font-replaced { color: #fff; font-size: 58px; left: -99999em; letter-spacing: .0125em; position: absolute; top: 55px; visibility: hidden; } .tr-page .tr-main .tr-hero h2.font-replaced + p { color: #fff; font-size: 14px; left: -99999em; line-height: 1; position: absolute; text-transform: uppercase; top: 178px; visibility: hidden; width: 275px; } #content.tr-page .tr-trend-title { color: #000; font-size: 16px; font-weight: normal; line-height: 1; margin:0 0 5px;padding:0; text-transform: uppercase; width: auto; } .tr-page .tr-trend .tr-trend-img { background-color: #ccc; float: left; height: 123px; margin: 0 13px 7px 0; width: 106px; } .tr-page .tr-trend p { color: #666; font-size: 12px; padding:0 0 .5em;margin:0; } .tr-page .tr-hero p > .tr-hero-cta { display: block; height: 321px; overflow: hidden; width: 582px; } .tr-page .tr-collection-link, .tr-page .tr-more-link { background: url("/wcsstore/SGH/experiences/trends/images/tr_arrow_right.png") no-repeat; color: #39c !important; font-size: 11px; padding-right: 9px; } .tr-page .tr-collection-link:hover, .tr-page .tr-more-link:hover {color: #000 !important;} .tr-page .tr-trend .tr-more-link { background-position: 178px 3px; display:block; } .tr-page .tr-trend .tr-more-link:hover {background-position: 178px -9px;} .tr-page.ie7 .tr-trend .tr-more-link, .tr-page.ie8 .tr-trend .tr-more-link {background-position: 175px 4px;} .tr-page.ie7 .tr-trend .tr-more-link:hover, .tr-page.ie8 .tr-trend .tr-more-link:hover {background-position: 175px -8px;} .tr-page .tr-trend .tr-collection-link { background-position: 218px 3px; display:block; } .tr-page .tr-trend .tr-collection-link:hover {background-position: 218px -9px;} .tr-page.ie7 .tr-trend .tr-collection-link, .tr-page.ie8 .tr-trend .tr-collection-link {background-position: 218px 4px;} .tr-page.ie7 .tr-trend .tr-collection-link:hover, .tr-page.ie8 .tr-trend .tr-collection-link:hover {background-position: 218px -8px;} #celeb-carousel .tr-more-link { background-position: 66px 3px; display:inline-block; } #celeb-carousel .tr-more-link:hover {background-position: 66px -7px;} .tr-page.ie7 #celeb-carousel .tr-more-link, .tr-page.ie8 #celeb-carousel .tr-more-link {background-position: 66px 4px;} .tr-page.ie7 #celeb-carousel .tr-more-link:hover, .tr-page.ie8 #celeb-carousel .tr-more-link:hover {background-position: 66px -8px;} .tr-page .tr-spotlight .tr-more-link { background-position: 106px 3px; display:block; } .tr-page .tr-spotlight .tr-more-link:hover {background-position: 106px -9px;} .tr-page.ie7 .tr-spotlight .tr-more-link, .tr-page.ie8 .tr-spotlight .tr-more-link {background-position: 103px 4px;} .tr-page.ie7 .tr-spotlight .tr-more-link:hover, .tr-page.ie8 .tr-spotlight .tr-more-link:hover {background-position: 103px -8px;} .tr-page .tr-fulltime-fab .tr-more-link { background-position: 59px 3px; display:block; } .tr-page .tr-fulltime-fab .tr-more-link:hover {background-position: 59px -9px;} .tr-page.ie7 .tr-fulltime-fab .tr-more-link, .tr-page.ie8 .tr-fulltime-fab .tr-more-link {background-position: 56px 4px;} .tr-page.ie7 .tr-fulltime-fab .tr-more-link:hover, .tr-page.ie8 .tr-fulltime-fab .tr-more-link:hover {background-position: 56px -8px;} .tr-page .tr-trend .fb-like { clear: both; display: block; } .tr-page .tr-main .multi-cols { color:#666; padding-bottom: 20px; } .tr-page .tr-main .multi-cols > div { display:block; float:left; width:280px; } .tr-page .tr-main .multi-cols > div:first-child { margin-right:22px; } .tr-page .tr-main .tr-trending-now h3 {color: #000;} /* end main content styles */ /* sidebar styles */ .tr-page .tr-sidebar { float: left; overflow: hidden; width: 280px; } .tr-page .tr-sidebar > div { margin-bottom: 20px; padding-top: 15px; } .tr-page .tr-sidebar > div.tr-celeb-sightings { border-top: none; padding-top: 11px; } .tr-page .tr-sidebar p { color: #666; font-size: 12px; margin:0; padding:0; } .tr-page .tr-trending-now h3, .tr-page .tr-sidebar h3 { font-size:31px; letter-spacing: .03em; margin-bottom: 0; position: relative; text-transform: uppercase; } .tr-page .tr-sidebar h3 { border-bottom: 4px solid #000; margin-bottom: 14px; padding-bottom: 3px; } .tr-page .tr-sidebar .tr-spotlight h3, .tr-page .tr-sidebar .tr-fulltime-fab h3 { margin-bottom: 3px; } .tr-page .tr-sidebar .tr-spotlight p, .tr-page .tr-sidebar .tr-fulltime-fab p {margin-bottom: 5px;} .tr-page .tr-sidebar h3 > span, .tr-page .tr-sidebar h3 + h2 { color: #000; font-family: Arial,sans-serif; font-size: 12px; font-weight: normal; margin-bottom: 3px; text-transform: uppercase; } .tr-page .tr-sidebar .tr-spotlight h3 + h2, .tr-page .tr-sidebar .tr-fulltime-fab h3 + h2 {margin-bottom: 14px;} .tr-page .tr-trending-now h3 { border-bottom: 4px solid #000; margin-bottom: 8px; padding-bottom: 3px; } .tr-page .tr-trending-now h3 > a, .tr-page .tr-sidebar h3 > a { bottom:3px; color:#39c !important; font-family: Georgia,serif; font-size: 12px; font-style: italic; letter-spacing: normal; position: absolute; right:0; text-transform: none; } .tr-page .tr-sidebar .tr-celeb-sightings > h3 { margin:0 0 14px; } .tr-page .tr-trending-now h3 > a:hover, .tr-page .tr-sidebar h3 > a:hover {color:#000 !important;} /* carousel dots */ .carousel-dots{ bottom:8px; left:50%; position:absolute; } .tr-spotted .carousel-dots {bottom:5px;} .carousel-dots ul{ margin-left: -50%; overflow:hidden; position:relative; } .carousel-dots li{ background:url("/wcsstore/SGH/experiences/trends/images/tr_carousel_dots.png") no-repeat; cursor:pointer; float:left; height:10px; margin:0 8px 0 0; overflow: hidden; width:10px; } .carousel-dots .active-carousel-dot{ background-position:0 -13px; cursor:default; } /* end carousel dots */ /* Circle carousel */ #circle-carousel{ background:url("/wcsstore/SGH/experiences/trends/images/tr_bg_circle.png") no-repeat 59px 0; height:218px; margin:0; overflow:hidden; position:relative; width:280px; } .ie7 #circle-carousel .carousel-dots, .ie9 #circle-carousel .carousel-dots {width: 30%;} #circle-carousel .carousel-dots {left: 50%;} #circle-carousel .carousel-dots ul {margin-left: -50%;} #circle-carousel .carousel-list{ overflow:visible; position:absolute; top:0; width:20000px; } #circle-carousel .carousel-list li img { position:relative; left:10px; } #circle-carousel .carousel-list li{ float:left; height:175px; list-style: none; position:relative; width:280px; } #circle-carousel li > p{ position:absolute; right:12px; top:145px; } #circle-carousel li span{ color:#999; font-family: Arial,sans-serif; font-size:12px; line-height:16px; display:block; text-align:right; text-transform: uppercase; } #circle-carousel li span.circle-product-price {color:#333;} #circle-carousel a:hover span{color:#000;} #circle-carousel > a{ border-top:13px solid transparent; border-bottom:13px solid transparent; bottom:10px; cursor: pointer; display:block; height:0; position:absolute; width:0; } #circle-carousel .circle-carousel-prev{ border-right:13px solid #000; left:0; } #circle-carousel .circle-carousel-next{ border-left:13px solid #000; right:0; } #circle-carousel .circle-carousel-prev:hover{ border-right:13px solid #666; left:0; } #circle-carousel .circle-carousel-next:hover{ border-left:13px solid #666; right:0; } #circle-carousel .carousel-nav-disabled, #circle-carousel .carousel-nav-disabled:hover{ border-left-color:#ccc !important; border-right-color:#ccc !important; cursor:default; } #circle-carousel > a span{ border-top:13px solid transparent; border-bottom:13px solid transparent; bottom:0; display:block; height:0; position:relative; width:0; } #circle-carousel .circle-carousel-prev span{ border-right:13px solid #fff; bottom:13px; left:3px; } #circle-carousel .circle-carousel-next span{ border-left:13px solid #fff; bottom:13px; right:16px; } /* END Circle carousel */ /* Celebrity carousel */ #celeb-carousel{ height:282px; margin:0; overflow:hidden; position:relative; width:280px; } .ie9 #celeb-carousel .carousel-dots {width: 50%;} #celeb-carousel .carousel-dots {left: 50%;} #celeb-carousel .carousel-dots ul {margin:0 0 0 -50%; padding:0;} #celeb-carousel .carousel-list{ overflow:visible; position:absolute; top:0; width:20000px;padding:0; margin:0; } #celeb-carousel .carousel-list li{ float: left; font-family: Arial,sans-serif; height:251px; list-style: none; position:relative; width:280px; } #celeb-carousel .carousel-list li img { height:170px; margin:0 auto; position:relative; width:279px; } #celeb-carousel .carousel-list li .tr-source { color: #666; font-size: 8px; font-weight: normal; line-height: 1.5; margin: 0 0 10px; text-transform: uppercase; width: auto; } #celeb-carousel .carousel-list li .tr-caption { color: #000; font-size: 15px; font-weight: normal; line-height: 1.2; text-transform: uppercase; width: auto; } #celeb-carousel .carousel-list li .product { color: #999; font-size: 10px; line-height: 1; margin-bottom: 3px; } #celeb-carousel .carousel-list li .product span { display: inline-block; padding: 0 .5em; text-transform: uppercase; } #celeb-carousel .carousel-list li .product span:first-child {padding-left: 0;} #celeb-carousel .carousel-list li .product span.style { border: solid #999; border-width: 0 1px; } #celeb-carousel .carousel-list li .product span.price {color: #333;} #celeb-carousel .carousel-list li a { border-width: 0 1px 1px; color: #39c !important; font-family: Arial,sans-serif; font-size:11px; } #celeb-carousel .carousel-list li a:hover {color:#000 !important;} #celeb-carousel > .celeb-carousel-prev, #celeb-carousel > .celeb-carousel-next{ border-top:13px solid transparent; border-bottom:13px solid transparent; bottom:0; cursor: pointer; display:block; height:0; position:absolute; width:0; z-index: 10; } #celeb-carousel .celeb-carousel-prev{ border-right:13px solid #000; left:0; } #celeb-carousel .celeb-carousel-next{ border-left:13px solid #000; right:0; } #celeb-carousel .celeb-carousel-prev:hover{ border-right:13px solid #666; left:0; } #celeb-carousel .celeb-carousel-next:hover{ border-left:13px solid #666; right:0; } #celeb-carousel .carousel-nav-disabled, #celeb-carousel .carousel-nav-disabled:hover{ border-left-color:#ccc !important; border-right-color:#ccc !important; cursor:default; } #celeb-carousel .celeb-carousel-prev > span, #celeb-carousel .celeb-carousel-next > span { border-top:13px solid transparent; border-bottom:13px solid transparent; bottom:0; display:block; height:0; position:relative; width:0; } #celeb-carousel .celeb-carousel-prev span{ border-right:13px solid #fff; bottom:13px; left:3px; } #celeb-carousel .celeb-carousel-next span{ border-left:13px solid #fff; bottom:13px; right:16px; } /* END Celebrity carousel */ /* end sidebar styles */.fb_edge_widget_with_comment {*top:0px !important;} </style> <!-- END CSS specific to Trends Landing page --> <div class="tr-header"> <h1 class="font-replaced"> Trends </h1> <div class="tr-social clearfix"> <ul class="clearfix"> <li><a href="#JS" id="tr-page-facebook" rel="http://www.facebook.com/sharer.php?u=http%3A%2F%2Fwww.sunglasshut.com%2Fwebapp%2Fwcs%2Fstores%2Fservlet%2FExperience%3FstoreId%3D10154%26experienceName%3Dtrends"><img src="/wcsstore/SGH/experiences/trends/images/tr_icon_facebook.png" alt="Share on Facebook"/></a></li> <li><a href="#JS" id="tr-page-twitter" rel="http://twitter.com/home?status=http%3A%2F%2Fwww.sunglasshut.com%2Fwebapp%2Fwcs%2Fstores%2Fservlet%2FExperience%3FstoreId%3D10154%26experienceName%3Dtrends"><img src="/wcsstore/SGH/experiences/trends/images/tr_icon_twitter.png" alt="Share on Twitter"/></a></li> </ul> <div id="tr-page-fb-like"> <fb:like href="http://www.sunglasshut.com/Experience?storeId=10154&catalogId=10102&amp;experienceName=trends" send="false" layout="button_count" width="450" show_faces="true"></fb:like> </div> </div> </div> <div class="tr-content clearfix"> <div class="tr-main"> <div class="tr-hero"> <h3 class="tr-trend-type">The Latest</h3><!-- TODO: add URL for hero. --> <a href="/ca/trends/SP13Emerald" class="font-replaced tr-hero-cta"> <img class="hero" src="/wcsstore/SGH/experiences/trends/images/trendshero_emerald.jpg" alt="Emerald"/> </a> <h2 class="font-replaced">Everything Emerald</h2> <p> See the latest sunwear styles </p><br/> <div id="tr-hero-fb-like" class="fb-like"><!-- TODO: add encoded url to facebook "like" iframe src attribute (IMPORTANT: In the href parameter, replace "&" with %252526 and replace "=" with %25253D (omit quotes)) --> <fb:like send="false" width="450" layout="button_count" show_faces="false" href="http://www.sunglasshut.com/Experience?storeId=10154&catalogId=10102&experienceName=sgh-summer-trends"></fb:like> </div> </div> <div class="multi-cols clearfix"> <div class="col"> <div class="tr-trend"> <a href="/ca/trends/SP13Stripes" ><img class="tr-trend-img" src="/wcsstore/SGH/experiences/trends/images/Thumbnail_Stripes_0320.jpg" alt=""/></a> <h3 class="tr-trend-type">Fashion</h3> <h2 class="tr-trend-title">SHOW YOUR STRIPES</h2> <p> Forget the polka dots. Choose stripes and turn heads. </p> <a href="/ca/trends/SP13Stripes" class="tr-collection-link">Shop the Collection </a> <div class="fb-like"> <fb:like href="http://www.sunglasshut.com/ca/trends/SP13Stripes" send="false" layout="button_count" width="450" show_faces="false"></fb:like> </div> </div> <div class="tr-trend"> <a href="/ca/trends/SP13Electric" ><img class="tr-trend-img" src="/wcsstore/SGH/experiences/trends/images/Thumbnail_ElectricAve_0320.jpg" alt=""/></a> <h3 class="tr-trend-type">Fashion</h3> <h2 class="tr-trend-title">ELECTRIC AVENUE</h2> <p> Live life in color. Put on your brights. </p> <a href="/ca/trends/SP13Electric" class="tr-collection-link">Shop the Collection </a> <div class="fb-like"> <fb:like href="http://www.sunglasshut.com/ca/trends/SP13Electric" send="false" layout="button_count" width="450" show_faces="false"></fb:like> </div> </div> <div class="tr-trend"> <a href="/Experience?storeId=10154&catalogId=10102&langId=-1&experienceName=polarized" ><img class="tr-trend-img" src="/wcsstore/SGH/experiences/trends/images/tr_polarized.jpg" alt=""/></a> <h3 class="tr-trend-type">Technology</h3> <h2 class="tr-trend-title">Polarized<br />Lenses 101</h2> <p> Get crystal clear vision with unparalleled style in polarized lenses. </p> <a href="/ca/trends/Polarized" class="tr-more-link">Shop the Collection</a><br> <a href="/Experience?storeId=10154&catalogId=10102&langId=-1&experienceName=polarized" class="tr-more-link">Read More</a> <div class="fb-like"> <fb:like href="http://www.sunglasshut.com/ca/trends/Polarized" send="false" layout="button_count" width="450" show_faces="false"></fb:like> </div> </div> </div> <div class="col"> <div class="tr-trend"> <a href="/ca/trends/SP13Flashy" ><img class="tr-trend-img" src="/wcsstore/SGH/experiences/trends/images/Thumbnail_FlashyAndFab_0320.jpg" alt=""/></a> <h3 class="tr-trend-type">Fashion</h3> <h2 class="tr-trend-title">FLASHY AND FABULOUS</h2> <p> Be mistaken for a celebrity in a jaw-dropping look. </p> <a href="/ca/trends/SP13Flashy" class="tr-collection-link">Shop the Collection </a> <div class="fb-like"> <fb:like href="http://www.sunglasshut.com/ca/trends/SP13Flashy" send="false" layout="button_count" width="450" show_faces="false"></fb:like> </div> </div> <div class="tr-trend"> <a href="/ca/trends/SP13Mirrored" ><img class="tr-trend-img" src="/wcsstore/SGH/experiences/trends/images/Thumbnail_Mirrored_0320.jpg" alt=""/></a> <h3 class="tr-trend-type">Fashion</h3> <h2 class="tr-trend-title">REFLECT IN STYLE</h2> <p> Covert and clandestine. Trade the gradient lenses for mirrored ones and show off your secret style. </p> <a href="/ca/trends/SP13Mirrored" class="tr-collection-link">Shop the Collection </a> <div class="fb-like"> <fb:like href="http://www.sunglasshut.com/ca/trends/SP13Mirrored" send="false" layout="button_count" width="450" show_faces="false"></fb:like> </div> </div> </div> </div> </div> <div class="tr-sidebar clearfix"> <!-- <div class="tr-celeb-sightings"> <h3 class="font-replaced"> Celebrity Sightings </h3> <div id="celeb-carousel"> <a href="#JS" class="celeb-carousel-prev carousel-nav-disabled"><span></span></a> <ul class="carousel-list"> <li> <input type="hidden" value="/wcsstore/SGH/experiences/trends/images/Trends_CelebertySightings_DAgron_3.jpg" /> <p class="tr-source"> </p> <p class="tr-caption"> DIANA AGRON IN PRADA </p> <p class="product"> <span class="tr-brand">PRADA</span> <span class="style">PR27OS</span> <span class="price">$290.00</span> </p> <a href="/ca/64366" > Get the Look </a> </li> <li> <input type="hidden" value="/wcsstore/SGH/experiences/trends/images/Trends_CelebertySightings_JenniferAniston5.jpg" /> <p class="tr-source"> </p> <p class="tr-caption"> JENNIFER ANISTON IN RAY-BAN </p> <p class="product"> <span class="tr-brand">Ray-Ban </span> <span class="style">RB3025</span> <span class="price">$149.95</span> </p> <a href="/ca/44292" class="tr-more-link"> Get the Look </a> </li> <li> <input type="hidden" value="/wcsstore/SGH/experiences/trends/images/Trends_CelebertySightingz_JoshHutcherson.jpg" /> <p class="tr-source"> </p> <p class="tr-caption"> JOSH HUTCHERSON IN PERSOL </p> <p class="product"> <span class="tr-brand">PERSOL</span> <span class="style">PO0649</span> <span class="price">$360</span> </p> <a href="/ca/46074" > Get the Look </a> </li> <li> <input type="hidden" value="/wcsstore/SGH/experiences/trends/images/tr_celeb_6.jpg" /> <p class="tr-source"> Source: Just Jared </p> <p class="tr-caption"> Reese Witherspoon in Ray-Ban </p> <p class="product"> <span class="tr-brand">Ray-Ban</span> <span class="style">RB2132 55 Wayfarer</span> <span class="price">$169.95</span> </p> <a href="/ca/44135" class="tr-more-link"> Get the Look </a> </li> <li> <img src="/wcsstore/SGH/experiences/trends/images/Trends_CelebertySightings_EvaHerzigova.jpg" width="279" /> <p class="tr-source"> </p> <p class="tr-caption"> EVA HERZIGOVA IN STELLA MCCARTNEY </p> <p class="product"> <span class="tr-brand">Stella McCartney</span> <span class="style">SM4023</span> <span class="price">$200</span> </p> <a href="/ca/50666" class="tr-more-link"> Get the Look </a> </li> <li> <img src="/wcsstore/SGH/experiences/trends/images/Trends_CelebritySighting_DakotaFanning.JPG" width="279" /> <p class="tr-source"> </p> <p class="tr-caption"> DAKOTA FANNING IN PERSOL </p> <p class="product"> <span class="tr-brand">Persol</span> <span class="style">PO3025S</span> <span class="price">$310.00</span> </p> <a href="/ca/54096" class="tr-more-link"> Get the Look </a> </li> <li> <img src="/wcsstore/SGH/experiences/trends/images/Trends_CelebertySightingz_GClooney-2.jpg" width="279" /> <p class="tr-source"> </p> <p class="tr-caption"> GEORGE CLOONEY IN PERSOL </p> <p class="product"> <span class="tr-brand">PERSOL</span> <span class="style">PO2405S</span> <span class="price">$360</span> </p> <a href="/ca/53524" class="tr-more-link"> Get the Look </a> </li> <li> <input type="hidden" value="/wcsstore/SGH/experiences/trends/images/Trends_CelebertySightings_CarrieUnderwood.jpg" /> <p class="tr-source"> </p> <p class="tr-caption"> CARRIE UNDERWOOD IN BVLGARI </p> <p class="product"> <span class="tr-brand">BVLGARI</span> <span class="style">BV6049B</span> <span class="price">$475</span> </p> <a href="/ca/50402" class="tr-more-link"> Get the Look </a> </li> </ul> <a href="#JS" class="celeb-carousel-next"><span></span></a> </div> </div> --> <!-- <div class="tr-spotlight"> <h3 class="font-replaced"> Trend Spotlight </h3> <h2>With Rachel Bilson, Style Director</h2> <img src="/wcsstore/SGH/experiences/trends/images/LUX2119_Bilson_279x170.jpg" alt="Seventies Glam" /> <p> Return to '70s glam. Obsess over this sophisticated flashback. </p> <a href="/webapp/wcs/stores/servlet/Experience?storeId=10154&catalogId=10102&experienceName=bilson-main" class="tr-more-link">See Rachel's Latest </a> </div> --> <!-- <div class="tr-fulltime-fab"> <h3 class="font-replaced"> Full Time Fabulous </h3> <h2>By Kristy Elena</h2> <img src="/wcsstore/SGH/experiences/trends/images/tr_full_time_fab.jpg" alt="" /> <p> Fashion is about moving forward. Stay on top of the latest trends, on-the-street style and fashion tips with Kristy. </p> <a href="/webapp/wcs/stores/servlet/BlogView?storeId=10154&catalogId=10102" class="tr-more-link">Read More</a> </div> --><div class="tr-sgh-on-fb" style="border-top: 0px ! important;"> <div class="tr-fb-box"> <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FSunglassHut&amp;width=280&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=288" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:280px; height:280px;" allowTransparency="true"></iframe> </div><div class="tr-fulltime-fab"> <br><br> <hr> <a href="/ca/Experience?storeId=10154&catalogId=10102&experienceName=artistseries-all" > <img src="/wcsstore/SGH/experiences/trends/images/ArtistSeries-trendstout.jpg" alt=""/> <br><br> <p> &nbsp; </p> </a> </div> </div><!-- <div class="tr-trending-now"> <h3 class="font-replaced"> Trending Now </h3> <div id="circle-carousel"> <a href="#JS" class="circle-carousel-prev carousel-nav-disabled"><span></span></a> <ul class="carousel-list"> <li> <a href="/ca/50770" title="Tory Burch TY7027" > <img src="http://s7d3.scene7.com/is/image/LuxotticaRetail/642878925209_shad_qt?$pngalpha$&amp;wid=280" width="280"/> </a> <p> <a href="/ca/50770" title="Tory Burch TY7027" > <span class="circle-product-name">Tory Burch TY7027</span> <span class="circle-product-price">$150</span> </a> </p> </li> <li> <a href="/ca/46152" title="Smith Optics Shoreline" > <input type="hidden" value="http://s7d3.scene7.com/is/image/LuxotticaRetail/715757377175_shad_qt?$pngalpha$&amp;wid=280" data-alt="Smith Optics Shoreline" /> </a> <p> <a href="/ca/46152" title="Smith Optics Shoreline" > <span class="circle-product-name">Smith Optics Shoreline</span> <span class="circle-product-price">$139</span> </a> </p> </li> <li> <a href="/ca/52396" title="Revo RE4054 GUIDE" > <img src="http://s7d3.scene7.com/is/image/LuxotticaRetail/745016236844_shad_qt?$pngalpha$&amp;wid=280" width="280"/> </a> <p> <a href="/ca/52396" title="Revo RE4054 GUIDE" > <span class="circle-product-name">Revo RE4054 GUIDE</span> <span class="circle-product-price">$179.95</span> </a> </p> </li> <li> <a href="/ca/48872" title="Vogue Eyewear VO2638S" > <input type="hidden" value="http://s7d3.scene7.com/is/image/LuxotticaRetail/805289389712_shad_qt?$pngalpha$&amp;wid=280" data-alt="Vogue Eyewear VO2638S" /> </a> <p> <a href="/ca/48872" title="Vogue Eyewear VO2638S" > <span class="circle-product-name">Vogue Eyewear VO2638S</span> <span class="circle-product-price">$89.95</span> </a> </p> </li> <li> <a href="/ca/46865" title="Burberry BE3043" > <input type="hidden" value="http://s7d3.scene7.com/is/image/LuxotticaRetail/713132303641_shad_qt?$pngalpha$&amp;wid=280" data-alt="Burberry BE3043" /> </a> <p> <a href="/ca/46865" title="Burberry BE3043" > <span class="circle-product-name">Burberry BE3043</span> <span class="circle-product-price">$190</span> </a> </p> </li> </ul> <a href="#JS" class="circle-carousel-next"><span></span></a> </div> </div> --></div></div></div> <!-- #content --><!-- TODO: update src if necessary -->
Error
ERROR HERE
OK
Thank you
ERROR HERE
OK
Loading
Loading