"layout"
Bootstrap 3.0.0 Snippet by evarevirus

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <html> <head> <meta charset="utf-8"> <title>Yelp</title> <link rel="stylesheet" href="https://necolas.github.io/normalize.css/5.0.0/normalize.css"/> <link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet"> </head> <body class="main-page"> <!-- main-header start's here --> <header class="main-header"> <div class="main-header__wrapper"> <div class="nav-wrapper"> <nav class="main-nav"> <ul class="main-list"> <li class="main-list__item"><a href="javascript:void(0);" class="main-list__link">Write a Review</a></li> <li class="main-list__item"><a href="javascript:void(0);" class="main-list__link">Events</a></li> <li class="main-list__item"><a href="javascript:void(0);" class="main-list__link">Talk</a></li> </ul> </nav> <div class="logon-box"> <ul class="logon-list"> <li class="logon-list__item"><a href="" class="logon-list__link Login">Log In</a></li> <li class="logon-list__item"><a href="" class="logon-list__link SignUp">Sign Up</a></li> </ul> </div> </div> <div class="main-logo"> <a href="javascript:void(0);"><img src="https://s3-media4.fl.yelpcdn.com/assets/srv0/yelp_styleguide/c3484759c57a/assets/img/logos/logo_desktop_xlarge.png" alt="yelp logo" width="160px" height="80px"/></a> </div> <!-- search box start's here --> <div class="search"> <div class="search-form__left"> <form action="/"> <span class="input-find"><input type="search" name="find" placeholder="tacos, cheap dinner, Max's"/></span> </form> </div> <div class="search-form__right"> <form action="/"> <input type="search" name="Near" placeholder="address, neighborhood, city, state or zip" value="San Francisco, CA"/> <input type="submit" value=""/> </form> </div> </div> <!-- /search box end's here --> <!-- categories box start's here --> <div class="categories"> <ul class="categories-list"> <li class="categories-list__item"> <img src="https://s3-media2.fl.yelpcdn.com/assets/srv0/svg_icons/aafb83c8f161/assets/sprite.png" alt="" width="18px" height="18px" class="categories-list__img restaurants-icon"/> <a href="javascript:void();" class="categories-list__link">Restaurants</a> </li> <li class="categories-list__item"> <img src="https://s3-media2.fl.yelpcdn.com/assets/srv0/svg_icons/aafb83c8f161/assets/sprite.png" alt="" width="18px" height="18px" class="categories-list__img nightlife-icon"/> <a href="javascript:void();" class="categories-list__link">Nightlife</a> </li> <li class="categories-list__item"> <img src="https://s3-media2.fl.yelpcdn.com/assets/srv0/svg_icons/aafb83c8f161/assets/sprite.png" alt="" width="18px" height="18px" class="categories-list__img services-icon"/> <a href="javascript:void();" class="categories-list__link">Services</a> </li> <li class="categories-list__item"> <img src="https://s3-media2.fl.yelpcdn.com/assets/srv0/svg_icons/aafb83c8f161/assets/sprite.png" alt="" width="18px" height="18px" class="categories-list__img delivery-icon"/> <a href="javascript:void();" class="categories-list__link">Delivery</a> </li> </ul> </div> <!-- /categories box end's here --> <!-- copyright-photo-block start's here --> <div class="copyright-block photo"> <a href="javascript:void(0)"><img src="https://s3-media3.fl.yelpcdn.com/photo/DglwW9r60agyxk42ZJdCYw/30s.jpg" width="30px" height="30px" class="img-box" alt="author photo profile"/></a> <small>Photo by <a href="javascript:void(0);">Asim F.</a></small> </div> <!-- /copyright-photo-block end's here --> </div> </header> <!-- /main-header end's here --> <!-- main-content start's here --> <main class="main-content"> <div class="main-wrapper"> <h2 class="main-content__heading">Yelp San Francisco</h2> <!-- main-content__menu San-Francisco start's here --> <nav class="main-content__menu San-Francisco"> <ul class="menu-list"> <li class="menu-list__item"><a href="javascript:void(0);" class="menu-list__link">New York</a></li> <li class="menu-list__item"><a href="javascript:void(0);" class="menu-list__link">San Jose</a></li> <li class="menu-list__item"><a href="javascript:void(0);" class="menu-list__link">Los Angeles</a></li> <li class="menu-list__item"><a href="javascript:void(0);" class="menu-list__link">Chicago</a></li> <li class="menu-list__item"><a href="javascript:void(0);" class="menu-list__link">Palo Alto</a></li> <li class="menu-list__item"><a href="javascript:void(0);" class="menu-list__link">Oakland</a></li> <li class="menu-list__item"><a href="javascript:void(0);" class="menu-list__link more-cities">More Cities</a></li> </ul> </nav> <!-- /main-content__menu San-Francisco end's here --> <h3 class="main-content__subheading">Hot & New Businesses</h3> <!-- restaurants start's here --> <section class="restaurants"> <div class="restaurants__row"> <div class="restaurants__col"> <div class="card__wrapper"> <div class="card__photo"> <a href="javascript:void(0)" class="img-link"><img src="https://s3-media2.fl.yelpcdn.com/bphoto/oPKEl4cw0Mw6gCFIg-3dPA/l.jpg" alt="Woods Beer" width="298px" height="180px"/></a> </div> <div class="restaurants-container"> <span class="restaurants__name"><a href="javascript:void(0);" class="restaurants__name-link">Woods Beer</a></span> <div class="restaurants__rating"> <div class="restaurants__rating__star four-stars">Star1</div> <span class="review-counter">12 reviews</span> </div> <div class="restaurants-info"> <span class="restaurants-info__cost">$$</span> <span class="restaurants-info__food">Food Trucks, Poke, Vegeterian</span> </div> <div class="restaurants-info__timetable"> <span>Opened 7 weeks ago</span> </div> </div> </div> </div> <div class="restaurants__col"> <div class="card__wrapper"> <div class="card__photo"> <a href="javascript:void(0)" class="img-link"><img src="https://s3-media4.fl.yelpcdn.com/bphoto/K0w5sjO5FyrWicpYJF3hnQ/l.jpg" alt="Woods Beer" width="298px" height="180px"/></a> </div> <div class="restaurants-container"> <span class="restaurants__name"><a class="restaurants__name-link" href="javascript:void(0);">Brown Sugar Factory</a></span> <div class="restaurants__rating"> <div class="restaurants__rating__star four-stars">Star1</div> <span class="review-counter">19 reviews</span> </div> <div class="restaurants-info"> <span class="restaurants-info__cost">$$</span> <span class="restaurants-info__food">Breakfast & Brunch, Diners, Asian F..</span> </div> <div class="restaurants-info__timetable"> <span>Opened 2 weeks ago</span> </div> </div> </div> </div> <div class="restaurants__col"> <div class="card__wrapper"> <div class="card__photo"> <a href="javascript:void(0);" class="img-link"><img src="https://s3-media2.fl.yelpcdn.com/bphoto/Tabpyh7Ip323dc4TZmB3IA/l.jpg" alt="Woods Beer" width="298px" height="180px"/></a> </div> <div class="restaurants-container"> <span class="restaurants__name"><a class="restaurants__name-link" href="javascript:void(0);">E Tea</a></span> <div class="restaurants__rating"> <div class="restaurants__rating__star four-stars">Star1</div> <span class="review-counter">10 reviews</span> </div> <div class="restaurants-info"> <span class="restaurants-info__cost">$$</span> <span class="restaurants-info__food">Bubble Tea</span> </div> <div class="restaurants-info__timetable"> <span>Opened 2 weeks ago</span> </div> </div> </div> </div> </section> <div class="menu-category__more"> <a href="javascript:void(0);" class="menu-category__link">See more hot and new businesses</a> </div> <!-- /menu-category San-Francisco end's here --> <!-- additional-info start's here --> <section class="additional-info"> <div class="local-yelp"> <h3>The Local Yelp</h3> <div class="local-yelp__wrapper"> <div class="local-yelp__img"> <img src="https://s3-media4.fl.yelpcdn.com/wphoto/tZGDWYY9j6a8H4BgQIxhIA/h.jpg" class="center" alt="San Francisco Got Seoul" width="628px" height="180px"/> </div> <div class="local-yelp__content"> <h4><a href="javascript:void(0);">San Francisco's Got Seoul</a></h4> <p> From barbecue to bibimbap to banchan and back again, San Francisco's sweet on Eastern treats. This week we're kickin' it Korean-style with these fine joints. </p> <small>The Local Yelp</small> </div> <a href="javascript:void(0);">See more</a> </div> </div> <div class="yelp-events"> <h3>Official Yelp Event</h3> <div class="yelp-events__wrapper"> <div class="yelp-events__img"> <img src="https://s3-media1.fl.yelpcdn.com/ephoto/qgs1WvhuDOM5H8lg5Cxtrw/300s.jpg" alt="Footlose on Fillmore" width="297.98px" height="180px"/> </div> <div class="yelp-events__content"> <h4><a href="javascript:void(0);">Yelp Gets Footloose on Fillmore</a></h4> <p>Ready to "Get Footloose on Fillmore?!" Great, all you need to do is RSVP here a</p> <small>Sat, Apr 29, 1:00 pm - 5:00 pm</small> <a href="javascript:void(0);">See all events</a> </div> </div> </div> </section> </div> <!-- /additional-info end's here --> <!-- category-businesses start's here --> <section class="category-businesses"> <div class="category-wrapper"> <div class="category-heading-wrapper"> <h2>Browse Businesses by Category</h2> </div> <div class="category-businesses__row"> <a href="javascript:void(0);" class="category-businesses__col"> <img src="https://s3-media1.fl.yelpcdn.com/assets/srv0/homepage/831d6d5efb37/assets/img/categories/72x72_restaurants@2x.png" alt="shoping-icon" width="72px" height="72px"/> <span class="category-businesses__label">Restaurants</span> </a> <a href="javascript:void(0);" class="category-businesses__col"> <img src="https://s3-media3.fl.yelpcdn.com/assets/srv0/homepage/6823e40b57ed/assets/img/categories/72x72_shopping.png" alt="shoping-icon" width="72px" height="72px"/> <span class="category-businesses__label">Shoping</span> </a> <a href="javascript:void(0);" class="category-businesses__col"> <img src="https://s3-media1.fl.yelpcdn.com/assets/srv0/homepage/4273a4c2d1b0/assets/img/categories/72x72_nightlife.png" alt="nightlife-icon" width="72px" height="72px"/> <span class="category-businesses__label">Nightlife</span> </a> <a href="javascript:void(0);" class="category-businesses__col"> <img src="https://s3-media3.fl.yelpcdn.com/assets/srv0/homepage/bc48d3d048a1/assets/img/categories/72x72_active_life.png" alt="active-life-icon" width="72px" height="72px"/> <span class="category-businesses__label">Active Life</span> </a> </div> <div class="category-businesses__row"> <a href="javascript:void(0);" class="category-businesses__col"> <img src="https://s3-media1.fl.yelpcdn.com/assets/srv0/homepage/8fddc8643935/assets/img/categories/72x72_beauty.png" alt="beauty-icon" width="72px" height="72px"/> <span class="category-businesses__label">Beauty & Spas</span> </a> <a href="javascript:void(0);" class="category-businesses__col"> <img src="https://s3-media2.fl.yelpcdn.com/assets/srv0/homepage/927fd53140d1/assets/img/categories/72x72_automotive.png" alt="automotive-icon" width="72px" height="72px"/> <span class="category-businesses__label">Automotive</span> </a> <a href="javascript:void(0);" class="category-businesses__col"> <img src="https://s3-media1.fl.yelpcdn.com/assets/srv0/homepage/04c2acbc7a13/assets/img/categories/72x72_home_services.png" alt="services-icon" width="72px" height="72px"/> <span class="category-businesses__label">Home Services</span> </a> <a href="javascript:void(0);" class="category-businesses__col"> <img src="https://s3-media3.fl.yelpcdn.com/assets/srv0/homepage/f36a7f7d42f8/assets/img/categories/72x72_more_categories.png" alt="more-categories-icon" width="72px" height="72px"/> <span class="category-businesses__label">More categories</span> </a> </div> </div> </section> <!-- /category-businesses end's here --> <!-- helpful-info start's here --> <section class="helpful-info"> <div class="helpful-info__wrapper"> <div class="reviews"> <h3 class="helpful-info__heading">Review of the Day</h3> <div class="reviews__row_wrapper"> <div class="reviews__row profile-details"> <div class="img-container"> <img src="https://s3-media4.fl.yelpcdn.com/photo/2TKfhXHp0PjifgIE700Y5w/60s.jpg" width="60px" height="60px" alt="profile photo" /> </div> <div class="stat-container"> <span class="profile-name"><a href="javascript:void(0);">Merica S.</a></span> <span class="feedback-count">77</span> <span class="likes-count">222</span> <span class="titul-name"><a href="javascript:void(0);">Elite'17</a></span> <p>Wrote a review for <a href="javascript:void(0);">Foreign Cinema</a></p> </div> </div> <div class="reviews__row review-of-the-day"> <p>Review of the Day</p> </div> <div class="restaurants__rating"> <div class="restaurants__rating__star five-stars">5 stars rating</div> <span class="restaurants__rating date">12/19/2016</span> </div> <p>Many thanks to Ben for putting together a great event (my first in 2017 as a goldee™) and to everyone at A15 for hosting and providing us with some excellent food and drinks. It was really interesting to try Indian-inspired food whilst leaving behind ye ol' bread and curry deal. I mean, I can't think of a time where I have experienced that! The chef and co-owner were both super-friendly during the event, which was ...<a href="javascript:void(0);">Continue reading</a></p> </div> </div> <div class="recent-lists"> <h3 class="helpful-info__heading">Recent Lists</h3> <div class="recent-lists__wrapper"> <div class="restaurants__col"> <div class="card__wrapper"> <div class="card__photo"> <a href="javascript:void(0)" class="img-link"><img src="https://s3-media1.fl.yelpcdn.com/bphoto/YJNzdiGmf1tOXbJHa6qAOQ/l.jpg" alt="rest-photo" width="300px" height="180px"/></a> </div> <div class="restaurants-container"> <span class="restaurants__name"><a class="restaurants__name-link" href="javascript:void(0);">Credo</a></span> <div class="restaurants__rating"> <div class="restaurants__rating__star four-stars">Star1</div> <span class="review-counter">617 reviews</span> </div> <div class="restaurants-info"> <span class="restaurants-info__cost">$$</span> <span class="restaurants-info__food">Italian, American (New), Bars</span> </div> <div class="restaurants-info__state"> <span>San Francisco, CA</span> </div> </div> </div> </div> </div> </section> <div class="links-wrapper"> <span class="prev-reviews"><a href="javascript:void(0);">Read previous reviews</a></span> <span class="more-lists"><a href="javascript:void(0);">Browse more lists</a></span> </div> <!-- /helpful-info start's here --> <!-- recent-activity start's here --> <section class="recent-activity"> <div class="recent-activity__wrapper"> <div class="recent-activity__heading"> <h2>Recent Activity</h2> </div> <div class="recent-activity__row"> <div class="recent-activity__col feedback"> <div class="img-container"> <img src="https://s3-media3.fl.yelpcdn.com/photo/QmWlBZ9hXKPJyanmyjo7XQ/30s.jpg" alt="profile-icon"/> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Fred N.</a></span> <span class="recent-activity__caption">Wrote a review</span> </div> <a href="javascript:void(0);"><img src="https://s3-media4.fl.yelpcdn.com/bphoto/u3WfxOE1DKuAENePexRmXg/l.jpg" alt="rest-photo" width="298.98px" height="115px"/></a> <h3 class="recent-activity__heading"><a href="javascript:void(0);">Stay Gold Deli</a></h3> <div class="restaurants__rating four-stars"> <div class="restaurants__rating__star four-stars">Star1</div> </div> <span class="break-line">1</span> <p> I was pretty disappointed and perplexed by my experience here. I was assured by the counter person that my order was plenty for 2, which it wasn't. Why he would down-sell me is a... <a href="javascript:void(0);">Countinue reading</a> </p> <span class="break-line">1</a> <div class="recent-activity__reaction"> <a href="javascript:void(0);" class="reaction-item useful">Useful</a> <a href="javascript:void(0);" class="reaction-item funny">Funny</a> <a href="javascript:void(0);" class="reaction-item cool">Cool</a> <a href="javascript:void(0);" class="reaction-item compliment">Send a Compliment</a> </div> </div> <div class="recent-activity__col feedback"> <div class="img-container"> <img src="https://s3-media4.fl.yelpcdn.com/photo/1zkoXmy4o3eFd3_-LBBAmw/30s.jpg" alt="profile-icon"/> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Tiffany L.</a></span> <span class="recent-activity__caption">Wrote a review</span> </div> <a href="javascript:void(0);"><img src="https://s3-media1.fl.yelpcdn.com/bphoto/w4gi1l9hQluP6CbFMwdRVQ/l.jpg" alt="rest-photo" width="298.98px" height="115px"/></a> <h3 class="recent-activity__heading"><a href="javascript:void(0);">Maven Recruiting Group</a></h3> <div class="restaurants__rating"> <div class="restaurants__rating__star five-stars">Star1</div> </div> <span class="break-line">1</span> <p> I rarely write Yelp bad reviews but I felt this experience really warranted one. I went to Maven back in November when I was first beginning my career change (I was mainly looking for... <a href="javascript:void(0);">Countinue reading</a> </p> <div class="recent-activity__reaction"> <a href="javascript:void(0);" class="reaction-item useful">Useful</a> <a href="javascript:void(0);" class="reaction-item funny">Funny</a> <a href="javascript:void(0);" class="reaction-item cool">Cool</a> <a href="javascript:void(0);" class="reaction-item compliment">Send a Compliment</a> </div> </div> <div class="recent-activity__col photocheck"> <div class="img-container"> <img src="https://s3-media3.fl.yelpcdn.com/photo/e8dRSSJXPZddIvcfHYc8rw/30s.jpg" alt="profile-icon"/> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Romina P.</a></span> <span class="recent-activity__caption">Added 1 photo</span> </div> <span class="break-line">1</span> <h3 class="recent-activity__heading"><a href="javascript.void(0);">Sky Terrace</a></h3> <a href="javascript:void(0);"><img src="https://s3-media3.fl.yelpcdn.com/bphoto/YXu7JYwUmfaCPjrhEk7nxA/300s.jpg" alt="photo check" width="300px" height="300px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </div> </div> <div class="recent-activity__row"> <div class="recent-activity__col photocheck"> <div class="img-container"> <img src="https://s3-media3.fl.yelpcdn.com/photo/5L-e8XbeEFMftdS8F08QYQ/30s.jpg" alt="profile-icon" /> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Rose A.</a></span> <span class="recent-activity__caption">Added 1 photo</span> </div> <h3 class="recent-activity__heading"><a href="javascript.void(0);">STEEP Creamery & Tea</a></h3> <a href="javascript:void(0);"><img src="https://s3-media1.fl.yelpcdn.com/bphoto/zUsyLfHorJLm5Jq3VB5nvg/300s.jpg" alt="photo check" width="300px" height="300px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </div> <div class="recent-activity__col photocheck"> <div class="img-container"> <img src="https://s3-media1.fl.yelpcdn.com/photo/jC2fUCi1BYXSNY7d3rHehw/30s.jpg" alt="profile-icon" /> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Kimberly H.</a></span> <span class="recent-activity__caption">Added 4 photo</span> </div> <h3 class="recent-activity__heading"><a href="javascript.void(0);">Hopwater Distribution</a></h3> <div class="photo-wrapper"> <div class="photo-block"> <a href="javascript:void(0);"><img src="https://s3-media1.fl.yelpcdn.com/bphoto/QfYyLZZjVqaB1flrQRdJkg/300s.jpg" alt="photo check" width="286px" height="150px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </div> <span class="sub-wrapper"> <a href="javascript:void(0);"><img src="https://s3-media4.fl.yelpcdn.com/bphoto/ogzh3BM-CC0hP5tj961T1Q/168s.jpg" alt="photo check" width="139px" height="132px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </span> <span class="sub-wrapper"> <a href="javascript:void(0);"><img src="https://s3-media2.fl.yelpcdn.com/bphoto/hhrUTQ7ksLCrAXKk__VL1g/168s.jpg" alt="photo check" width="139px" height="132px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </span> </div> <a class="more-photo" href="javascript:void(0);">Show all 4 photos</a> </div> <div class="recent-activity__col feedback"> <div class="img-container"> <img src="https://s3-media1.fl.yelpcdn.com/photo/hQ8pZIyjDNU4XY7lQriTTQ/30s.jpg" alt="profile-icon"/> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Kim S.</a></span> <span class="recent-activity__caption">Wrote a review</span> </div> <a href="javascript:void(0);"><img src="https://s3-media2.fl.yelpcdn.com/bphoto/ZrLFnrmBJtXzz59tp83vtg/l.jpg" alt="rest-photo" width="298.98px" height="115px"/></a> <h3 class="recent-activity__heading"><a href="javascript.void(0);">Central Kitchen</a></h3> <div class="restaurants__rating"> <div class="restaurants__rating__star five-stars">Star1</div> </div> <span class="break-line">1</span> <p> Underrated and under-the-radar Mission restaurant that has pleased me well on each of my 3 visits. The wine list is excellent, the food is spot-on, and the chocolate custard that's a... <a href="javascript:void(0);">Countinue reading</a> </p> <div class="recent-activity__reaction"> <a href="javascript:void(0);" class="reaction-item useful">Useful</a> <a href="javascript:void(0);" class="reaction-item funny">Funny</a> <a href="javascript:void(0);" class="reaction-item cool">Cool</a> <a href="javascript:void(0);" class="reaction-item compliment">Send a Compliment</a> </div> </div> </div> <div class="recent-activity__row"> <div class="recent-activity__col feedback"> <div class="img-container"> <img src="https://s3-media1.fl.yelpcdn.com/photo/jC2fUCi1BYXSNY7d3rHehw/30s.jpg" alt="profile-icon"/> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Lara C.</a></span> <span class="recent-activity__caption">Wrote a review</span> </div> <a href="javascript:void(0);"><img src="https://s3-media2.fl.yelpcdn.com/bphoto/RLiIhIbsrPkl_kl9bwfQUA/l.jpg" alt="rest-photo" width="298.98px" height="115px"/></a> <h3 class="recent-activity__heading"><a href="javascript.void(0);">The Saratoga</a></h3> <div class="restaurants__rating"> <div class="restaurants__rating__star four-stars">Star1</div> </div> <span class="break-line">1</span> <p> Michele was super fun and oh so smooth with his service, and he wasn't even our server. The table next to us got that honor. They utilized the space very well, with a bar and... <a href="javascript:void(0);">Countinue reading</a> </p> <div class="recent-activity__reaction"> <a href="javascript:void(0);" class="reaction-item useful">Useful</a> <a href="javascript:void(0);" class="reaction-item funny">Funny</a> <a href="javascript:void(0);" class="reaction-item cool">Cool</a> <a href="javascript:void(0);" class="reaction-item compliment">Send a Compliment</a> </div> </div> <div class="recent-activity__col feedback"> <div class="img-container"> <img src="https://s3-media3.fl.yelpcdn.com/photo/bjuY1_i0D0qp2QKhkZUSqg/30s.jpg" alt="profile-icon"/> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Anastasia J.</a></span> <span class="recent-activity__caption">Wrote a review</span> </div> <a href="javascript:void(0);"><img src="https://s3-media1.fl.yelpcdn.com/bphoto/ap8pJHLFERs3Y3xznecMAg/l.jpg" alt="rest-photo" width="298.98px" height="115px"/></a> <h3 class="recent-activity__heading"><a href="javascript.void(0);">The Saratoga</a></h3> <div class="restaurants__rating"> <div class="restaurants__rating__star four-stars">Star1</div> </div> <span class="break-line">1</span> <p> Great place to meet friends, however there will always be a wait. No reservations. Also the seating is incredibly uncomfortable. The cheese dip is incredible as are the fish tacos. </p> <div class="recent-activity__reaction"> <a href="javascript:void(0);" class="reaction-item useful">Useful</a> <a href="javascript:void(0);" class="reaction-item funny">Funny</a> <a href="javascript:void(0);" class="reaction-item cool">Cool</a> <a href="javascript:void(0);" class="reaction-item compliment">Send a Compliment</a> </div> </div> <div class="recent-activity__col photocheck"> <div class="img-container"> <img src="https://s3-media3.fl.yelpcdn.com/photo/kNigT3EpxPhc9FS11H_joA/30s.jpg" alt="profile-icon" /> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Stefanie W.</a></span> <span class="recent-activity__caption">Added 1 photo</span> </div> <h3 class="recent-activity__heading"><a href="javascript.void(0);">The Banked Bear - Custom Ice Cream Sandwiches</a></h3> <a href="javascript:void(0);"><img src="https://s3-media3.fl.yelpcdn.com/bphoto/eRBr_h_2U0mrR6sMe-ChLg/300s.jpg" alt="photo check" width="300px" height="300px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </div> </div> <div class="recent-activity__row"> <div class="recent-activity__col photocheck"> <div class="img-container"> <img src="https://s3-media1.fl.yelpcdn.com/photo/jC2fUCi1BYXSNY7d3rHehw/30s.jpg" alt="profile-icon" /> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Kimberly H.</a></span> <span class="recent-activity__caption">Added 12 photos</span> </div> <h3 class="recent-activity__heading"><a href="javascript.void(0);">The Saratoga</a></h3> <div class="photo-wrapper"> <div class="photo-block"> <a href="javascript:void(0);"><img src="https://s3-media2.fl.yelpcdn.com/bphoto/29Gu25g4QAmvlk8w7-2F6A/300s.jpg" alt="photo check" width="300px" height="300px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </div> <span class="sub-wrapper"> <a href="javascript:void(0);"><img src="https://s3-media3.fl.yelpcdn.com/bphoto/IZbLKEuFzjKQ1n7uD_77VQ/168s.jpg" alt="photo check" width="139px" height="132px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </span> <span class="sub-wrapper"> <a href="javascript:void(0);"><img src="https://s3-media4.fl.yelpcdn.com/bphoto/sivlMRSMqYCyylr6g1P7YA/168s.jpg" alt="photo check" width="139px" height="132px"/></a> <a href="javascript:void(0);" class="recent-activity__likes facebook"> <span class="recent-activity__likes fb-img-like"></span> <span class="recent-activity__likes text-like">Like</span> </a> </span> </div> <a class="more-photo" href="javascript:void(0);">Show all 12 photos</a> </div> <div class="recent-activity__col feedback"> <div class="img-container"> <img src="https://s3-media1.fl.yelpcdn.com/photo/iJacfnOUeR7HmZZ3XhPWZg/30s.jpg" alt="profile-icon"/> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Gabriela W.</a></span> <span class="recent-activity__caption">Wrote a review</span> </div> <a href="javascript:void(0);"><img src="https://s3-media3.fl.yelpcdn.com/bphoto/SChIQKohRU7d0canWJ_3ZQ/l.jpg" alt="rest-photo" width="298.98px" height="115px"/></a> <h3 class="recent-activity__heading"><a href="javascript.void(0);">Firepie</a></h3> <div class="restaurants__rating"> <div class="restaurants__rating__star five-stars">Star1</div> </div> <span class="break-line">1</span> <p> Artisanal crust, fresh a** toppings, arrived within 30 minutes, watched a basketball game as I chowed down, so yummy. Tummy satisfied. Will mama do it again? Hell yaaaaaaa! </p> <div class="recent-activity__reaction"> <a href="javascript:void(0);" class="reaction-item useful">Useful</a> <a href="javascript:void(0);" class="reaction-item funny">Funny</a> <a href="javascript:void(0);" class="reaction-item cool">Cool</a> <a href="javascript:void(0);" class="reaction-item compliment">Send a Compliment</a> </div> </div> <div class="recent-activity__col feedback"> <div class="img-container"> <img src="https://s3-media1.fl.yelpcdn.com/photo/iJacfnOUeR7HmZZ3XhPWZg/30s.jpg" alt="profile-icon"/> </div> <div class="caption-wrapper"> <span class="recent-activity__name"><a href="javascript:void(0);">Jane W.</a></span> <span class="recent-activity__caption">Wrote a review</span> </div> <a href="javascript:void(0);"><img src="https://s3-media1.fl.yelpcdn.com/bphoto/80pWTNJjPkPJ1Cq_tLiaBg/l.jpg" alt="rest-photo" width="298.98px" height="115px"/></a> <h3 class="recent-activity__heading"><a href="javascript.void(0);">Air Flow Pros Heating And Air Condition</a></h3> <div class="restaurants__rating"> <div class="restaurants__rating__star five-stars">Star1</div> </div> <span class="break-line">1</span> <p> Rudy is so nice, knowledgeable, patient, and honest. He came by to give us a bid, assessed our heating ducts, advised us. Second time, he changed out our furnace filter, sealed up any holes around t... </p> <a href="javascript:void(0);">Continue reading</a> <div class="recent-activity__reaction"> <a href="javascript:void(0);" class="reaction-item useful">Useful</a> <a href="javascript:void(0);" class="reaction-item funny">Funny</a> <a href="javascript:void(0);" class="reaction-item cool">Cool</a> <a href="javascript:void(0);" class="reaction-item compliment">Send a Compliment</a> </div> </div> </div> </div> </section> <!-- /recent-activity end's here --> <div class="show-more-wrapper"> <div class="show-more"> <a href="javascript:void(0);">Show more activity in San Francisco</a> </div> </div> <!-- mobile-apps start's here --> <section class="mobile-apps"> <div class="mobile-apps__wrapper"> <h2 class="mobile-apps__heading">Yelp Mobile Apps</h2> <a class="mobile-apps__link left-col" href="javascript:void(0);"> <div class="mobile-apps__os iOS"> <span>iPhone, iPad and  Watch</span> <img src="https://s3-media2.fl.yelpcdn.com/assets/srv0/yelp_styleguide/960cce5c1917/assets/img/app_pitch/pitch_ios.png" alt="iPhone" width="264px" height="170px"/> </div> </a> <a class="mobile-apps__link right-col" href="javascript:void(0);"> <div class="mobile-apps__os Android"> <span>Android</span> <img src="https://s3-media2.fl.yelpcdn.com/assets/srv0/yelp_styleguide/a91a4a087787/assets/img/app_pitch/pitch_android.png" alt="iPhone" width="264px" height="170px"/> </div> </a> </div> </section> <!-- /mobile-apps end's here --> </main> <!-- /main-content end's here --> <!-- footer start's here --> <footer class="main-footer"> <section class="main-footer__wrapper"> <div class="main-footer__col about"> <span class="main-footer__heading">About</span> <ul class="footer-list"> <li class="footer-list-item"><a href="javascript:void(0);">About Yelp</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Order Food on Eat24</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Careers</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Press</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Investor Relations</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Content Guidelines</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Terms of Service</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Privacy Policy</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Ad Choices</a></li> </ul> </div> <div class="main-footer__col discover"> <span class="main-footer__heading">Discover</span> <ul class="footer-list"> <li class="footer-list-item"><a href="javascript:void(0);">The Local Yelp</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Yelp Blog</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Support</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Yelp Mobile</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Developers</a></li> <li class="footer-list-item"><a href="javascript:void(0);">RSS</a></li> </ul> </div> <div class="main-footer__col business-owners"> <span class="main-footer__heading">Yelp for Business Owners</span> <ul class="footer-list"> <li class="footer-list-item"><a href="javascript:void(0);">Claim your Business Page</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Advertise on Yelp</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Online Ordering from Eat24</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Yelp Reservations</a></li> <li class="footer-list-item"><a href="javascript:void(0);">Business Support</a></li> <li class="footer-list-item"><a href="javascript:void(0);">yelp Blog for Business Owners</a></li> </ul> </div> <div class="main-footer__col region"> <ul class="languages-list"> <li class="languages-list__item"> English <ul class="languages-sublist"> <li class="languages-sublist__item">Russian</li> <li class="languages-sublist__item">Suomi</li> <li class="languages-sublist__item">Polski</li> <li class="languages-sublist__item">italiano</li> <li class="languages-sublist__item">Spanish</li> </ul> </li> </ul> <ul class="countries-list"> <li class="countries-list__item"> United States <ul class="countries-sublist"> <li class="countries-sublist__item">Russia</li> <li class="countries-sublist__item">Findland</li> <li class="countries-sublist__item">Poland</li> <li class="countries-sublist__item">Italia</li> </ul> </li> </ul> </div> </section> <small>Copyright © 2004-2017 Yelp Inc. Yelp <img src="" alt="" /> and related marks are registered trademarks of Yelp.</small> </footer> <!-- /footer end's here --> </body> </html>
.main-page { padding: 0; font-size: 0; line-height: 0; box-sizing: border-box; } /********* main-header *****/ .main-header { min-height: 600px; background-image: url(https://s3-media3.fl.yelpcdn.com/assets/srv0/yelp_large_assets/65e6a224ada4/assets/img/home/hero_photos/cz8iYo13MpBBGlFLlkA8Sw.jpg); background-size: cover; background-position: center center; } .main-header__wrapper { position: relative; width: 960px; min-height: 300px; margin: 0 auto; padding: 40px 0 0 0; } .main-nav { font-family: 'Roboto', Helvetica, Arial, sans-serif; font-size: 0.9em; line-height: 0; } .main-nav .main-list { margin: 0; padding: 0; } .main-nav li { display: inline; padding-right: 5px; font-weight: bold; } .main-nav .main-list__link:link { font-size: 1rem; line-height: 0.9rem; color: #fff; text-decoration: none; padding: 12px 11px 9px 11px; } .main-nav .main-list__link:hover { border-bottom: 2px solid #fff; } .logon-box { position: absolute; top: 38px; right: 0; padding: 0; } .logon-box .logon-list { margin: 0; padding: 0; } .logon-box .logon-list__item { display: inline-block; font-size: 0.9rem; font-weight: bold; line-height: 0.9rem; padding: 0; margin: 0; } .logon-box .logon-list__link { color: #fff; text-decoration: none; } .logon-list__link.Login { padding: 10px; margin-right: 15px; } .logon-list__link.Login:hover { border-bottom: 2px solid #fff; } .logon-list__link.SignUp { padding: 7px 23px 8px 23px; border: 2px solid #fff; border-radius: 4px; } .logon-list__link.SignUp:hover { background: #fff; color: #66666F; } .nav-wrapper { margin-bottom: 94px; } .main-logo { margin: 0; padding: 0; font-size: 0; text-align: center; margin-bottom: 46px; } /*************** Search-Box start here ************/ .search { width: 960px; font-size: 0; } input[type="search"] { display: inline-block; border: 1px solid #fff; border-radius: 2px 0 2px 0; padding: 10px 0 10px 50px; outline: none; } input[name="find"] { width: 480px; font-size: 1.125rem; border-radius: 3px 0 0 3px; margin-bottom: 10px; padding-left: 60px; } .input-find::after { position: absolute; content: ''; display: inline-block; top: 0.43rem; right: 0; min-height: 1.75rem; border-right: 1px solid #ccc; } .search-form__left { display: inline-block; position: relative; } .search-form__left::before { position: absolute; top: 21px; left: 13px; content: 'Find'; font-size: 1.125rem; font-weight: bold; color: #666666; } input[name="Near"] { width: 416px; font-size: 1.125rem; margin-bottom: 10px; border-radius: 0; padding-left: 60px; color: #333; } .search-form__right { position: relative; display: inline-block; } .search-form__right::before { position: absolute; top: 21px; left: 13px; content: 'Near'; font-size: 1.125rem; font-weight: bold; color: #666666; } input[type="submit"] { width: 63.5px; border: 0; outline: none; background: #D32323 url(https://i.imgur.com/veO2z1i.png) no-repeat center center; vertical-align: top; padding: 26.45px 24px 16px 24px; border-radius: 0 3px 3px 0; cursor: pointer; color: #D32323; } /***** Categories box style **** ********************************/ .categories { margin-bottom: 173px; } .categories-list { margin: 0; padding: 0; list-style: none; text-align: center; } .categories-list .categories-list__item { display: inline-block; margin-right: 30px; } .categories-list .categories-list__item:nth-child(4) { margin-right: 0; } .categories-list .categories-list__link { display:inline-block; font-size: 0.875rem; font-weight: bold; color: #fff; text-decoration: none; vertical-align: middle; } .categories-list .categories-list__link:hover { text-decoration: underline; } .categories-list img.categories-list__img { object-fit: none; object-position: 0 0; width: 18px; height: 18px; margin-right: 0.3rem; display: inline-block; vertical-align: middle; } img.categories-list__img.restaurants-icon { object-position: -96px -1890px; } img.categories-list__img.nightlife-icon { object-position: -96px -2393px; } img.categories-list__img.services-icon { object-position: -96px -3005px; } img.categories-list__img.delivery-icon { object-position: -96px -2429px; } /*** copyright-photo-block ****** *********************************/ .copyright-block { font-size: 1.1rem; text-align: center; } .copyright-block .img-box { display: block; border-radius: 5px; margin: 0 auto; margin-bottom: 10px; } .copyright-block small { color: #fff; } .copyright-block a { font-weight: bold; color: #fff; text-decoration: none; } .copyright-block a:hover { text-decoration: underline; } /**************************** ******* main-content ******** *****************************/ .main-content { } .main-wrapper { width: 960px; margin: 0 auto; margin-bottom: 72px; } .main-content__heading { font-size: 21px; font-weight: bold; color: #d32323; text-align: center; padding-top: 32px; padding-bottom: 19px; } .main-content .main-content__menu { margin-bottom: 20px; } .main-content .menu-list { position: relative; width: 960px; box-sizing: border-box; text-align: center; border-bottom: 1px solid #ccc; padding: 0; padding-bottom: 12px; margin: 0 auto; margin-bottom: 40px; } .menu-list .menu-list__item { display: inline-block; font-size: 1rem; } .menu-list .menu-list__link { text-decoration: none; color: #666; padding-left: 15px; padding-right: 15px; text-align: center; font-size: 14px; } .menu-list .menu-list__link:hover { padding-bottom: 7px; border-bottom: 3px solid #D32323; cursor: pointer; } .main-content__subheading { font-size: 1rem; font-weight: bold; color: #d32323; text-align: center; } .restaurants { margin-bottom: 20px; } .restaurants .restaurants__row { width: 990px; margin-left: -15px; margin-right: -15px; padding-top: 16px; text-align: center; } .restaurants .restaurants__col { width: 330px; display: inline-block; box-sizing: border-box; margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; } .restaurants__col img { border-radius: inherit; background-size: cover; background-position: top center; } .restaurants__col .img-link { cursor: pointer; } .restaurants__col .restaurants-container { padding-left: 12px; padding-right: 12px; padding-top: 16px; text-align: start; } .menu-list__link.more-cities { padding: 0; padding-left: 30px; padding-right: 15px; } .menu-list__link.more-cities:after { content: ''; position: absolute; right: 248px; bottom: 9px; width: 15px; height: 15px; background-image: url(https://s3-media2.fl.yelpcdn.com/assets/srv0/svg_icons/aafb83c8f161/assets/sprite.png); background-position: -2px -2756px; } .restaurants__col .card__wrapper { border-top-left-radius: 4px; border-top-right-radius: 4px; border: 1px solid #e6e6e6; border-radius: 4px; padding-bottom: 14px; } .restaurants__col .restaurants__name { display: block; text-align: start; } .restaurants__col .restaurants__name-link { display: inline-block; font-size: 16px; font-weight: bold; line-height: 1.2em; color: #0073bb; text-decoration: none; margin-bottom: 6px; } .restaurants__col .restaurants__name-link:hover { text-decoration: underline; cursor: pointer; } .restaurants__rating { text-align: start; margin-bottom: 14px; margin-left: 13px; } .restaurants__rating .restaurants__rating__star.four-stars { display: inline-block; width: 102px; height: 18px; background-image: url(https://s3-media1.fl.yelpcdn.com/assets/srv0/yelp_design_web/41341496d9db/assets/img/stars/stars.png); background-position: 0 194px; vertical-align: bottom; font-size: 0; } .restaurants .review-counter, .recent-lists .review-counter { display: inline-block; font-size: 14px; font-weight: normal; color: #666; padding-left: 6px; padding-bottom: 8px; } .restaurants-info { margin-bottom: 19px; } .restaurants-info__cost { position: relative; font-size: 14px; font-weight: normal; color: #333; margin-right: 8px; } .restaurants-info__cost:after { content: '•'; position: absolute; top: 8px; left: 24px; } .restaurants-info__food { font-size: 14px; font-weight: normal; color: #333; margin-left: 13px; } .restaurants-info__timetable { } .restaurants-info__timetable span { position: relative; font-size: 14px; font-weight: normal; color: #f15c00; padding-left: 21px; } .restaurants-info__timetable span:before { content: ''; position: absolute; top: 0px; left: 0; width: 18px; height: 18px; background: url(https://i.imgur.com/LTn6L7v.png); background-repeat: no-repeat; background-position: 0 0; } .menu-category__more { text-align: center; margin-bottom: 40px; } .menu-category__more a { display: inline-block; font-size: 14px; color: #0073bb; padding-bottom: 30px; text-decoration: none; } .menu-category__more a:hover { text-decoration: underline; cursor: pointer; } .additional-info { margin: 0 auto; padding: 0; font-size: 0; line-height: 0; width: 960px; } .additional-info .local-yelp__wrapper { width: 628px; border: 1px solid #e6e6e6; border-radius: 4px; } .additional-info h3 { font-size: 16px; text-align: center; color: #d32323; } .additional-info h4 { font-size: 16px; color: #d32323; } .additional-info a { color: #0073bb; text-decoration: none; } .additional-info a:hover { text-decoration: underline; cursor: pointer; } .additional-info img { border-radius: 4px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; display: block; } .additional-info .local-yelp { width: 660px; display: inline-block; border-radius: 4px; vertical-align: top; } .local-yelp__content { width: 630px; padding: 0 12px 12px 12px; } .local-yelp p { font-size: 14px; line-height: 18px; } .local-yelp small { font-size: 14px; color: #999; } .additional-info .yelp-events { width: 300px; display: inline-block; border-radius: 4px; vertical-align: top; } .yelp-events__wrapper { border: 1px solid #e6e6e6; border-radius: 4px; } .yelp-events__content { padding: 0 12px 0 12px; } .yelp-events p { font-size: 14px; line-height: 18px; } .yelp-events small { font-size: 14px; line-height: 18px; color: #999; } .category-businesses { background: #F5F5F5; } .category-wrapper { width: 960px; margin: 0 auto; } .category-heading-wrapper { padding: 15px 0 10px 0; } .category-heading-wrapper h2 { font-size: 21px; line-height: 1.1em; color: #d32323; text-align: center; } .category-businesses__row { padding-bottom: 30px; } .category-businesses__col { display: inline-block; box-sizing: border-box; width: 217.5px; margin-left: 15px; margin-right: 15px; padding: 17px 0 34px 0; border: 1px solid #e6e6e6; border-radius: 4px; text-align: center; vertical-align: top; text-decoration: none; color: #333; background: #fff; font-size: 10px; } .category-businesses__col:hover { color: #0073bb; border-color: #0073bb; } .category-businesses__row .category-businesses__col:first-child { margin-left: 0; } .category-businesses__row .category-businesses__col:last-child { margin-right: 0; } .category-businesses__col .category-businesses__label { display: block; font-size: 14px; padding-top: 14px; text-align: center; font-weight: bold; } .category-businesses__label { text-decoration: none; } /************************** helpful-info section *************************/ .helpful-info { } .helpful-info__wrapper { width: 960px; margin: 0 auto; font-size: 14px; line-height: 1em; } .helpful-info__heading { font-size: 16px; color: #d32323; text-align: center; } .reviews { width: 630px; box-sizing: border-box; display: inline-block; vertical-align: top; margin-right: 26px; } .reviews__row { } .reviews__row_wrapper { border: 1px solid #e6e6e6; border-radius: 4px; padding: 10px; min-height: 287px; } .reviews__row .img-container { display: inline-block; vertical-align: top; padding: 0 10px 0 10px; } .img-container img { border-radius: 4px; } .reviews__row .stat-container { position: relative; display: inline-block; vertical-align: top; font-size: 12px; font-weight: bold; color: #666; } .stat-container p { font-size: 14px; color: #333; font-weight: normal; margin-top: 7px; } .reviews__row.profile-details { margin: 0; font-size: 0; padding-top: 10px; } .reviews .profile-name { display: block; font-size: 14px; margin-bottom: 10px; font-weight: bold; color: #0073bb; } .profile-name a { color: #0073bb; text-decoration: none; } .profile-name a:hover { text-decoration: underline; } .recent-lists { width: 300px; box-sizing: border-box; display: inline-block; } .recent-lists .card__wrapper { border: 0; } .recent-lists__wrapper { padding: 10px; border: 1px solid #e6e6e6; border-radius: 4px; min-height: 287px; line-height: 0; } .recent-lists img { max-width: 100%; } .recent-lists .restaurants__name a { font-size: 16px; font-weight: bold; text-decoration: none; color: #0073bb; } .recent-lists .restaurants__name a:hover { text-decoration: underline; cursor: pointer; } .recent-lists .restaurants__rating { display: inline-block; } .stat-container .feedback-count { padding-left: 20px; } .stat-container .feedback-count:before { content: ''; position: absolute; top: 24px; left: 0; width: 15px; height: 12px; background-image: url(https://s30.postimg.org/59wvpfmxd/genders.png); } .stat-container .likes-count { position: relative; padding-left: 27px; } .stat-container .likes-count:before { content: ''; position: absolute; top: -2px; left: 9px; width: 15px; height: 15px; background-image: url(https://s3.postimg.org/91z9xng9f/stars.png); } .titul-name a { color: #f15c00; text-decoration: none; padding-left: 8px; } .titul-name a:hover { text-decoration: underline; } .stat-container p a { font-weight: bold; color: #0073bb; text-decoration: none; } .stat-container a:hover { text-decoration: underline; } .reviews__row.review-of-the-day { position: relative; background-color: #d0ecfb; border-radius: 4px; outline: none; } .review-of-the-day:after { content: ''; position: absolute; bottom: -8px; right: 8px; width: 40px; height: 40px; background-image: url(https://s3-media1.fl.yelpcdn.com/assets/srv0/yelp_styleguide/8bb21835695e/assets/img/badge_banner_icons/40x40_rotd.png); } .review-of-the-day p { padding: 5px 0 5px 7px; } .restaurants__rating .restaurants__rating__star.five-stars { display: inline-block; width: 102px; height: 18px; font-size: 0; background-image:url(https://s8.postimg.org/ylton5fjp/5stars.png); vertical-align: bottom; } .restaurants__rating.date { color: #666; } .reviews p { line-height: 17.9999px; color: #333; } .reviews a { color: #0073bb; text-decoration: none; } .reviews a:hover { text-decoration: underline; cursor: pointer; } .links-wrapper { position: relative; width: 960px; display: block; margin: 0 auto; margin-bottom: 92px; padding: 20px 0 0 0; } .prev-reviews { position: absolute; left: 244px; } .prev-reviews a { font-size: 14px; color: #0073bb; text-decoration: none; } .prev-reviews a:hover { text-decoration: underline; } .more-lists { position: absolute; right: 95.5px; } .more-lists a { font-size: 14px; color: #0073bb; text-decoration: none; } .more-lists a:hover { text-decoration: underline; } /*************** RECENT-ACTIVITY ***************/ .recent-activity { width: 960px; margin: 0 auto; } .recent-activity__wrapper { } .recent-activity__heading h2 { display: block; font-size: 21px; color: #d32323; padding: 10px 0 0 0; margin: 0 auto; margin-bottom: 37px; text-align: center; } h3.recent-activity__heading { margin-left: 13px; margin-top: 9px; margin-bottom: 13px; } h3.recent-activity__heading a { font-size: 14px; line-height: 1.3em; color: #0073bb; text-decoration: none; } .recent-activity__row { } .recent-activity__col { max-width: 300px; display: inline-block; color: #333; border: 1px solid #e6e6e6; border-radius: 4px; vertical-align: top; box-sizing: border-box; margin-right: 30px; } .recent-activity__col img { max-width: 100%; display: block; margin: 0 auto; border-radius: 1px; } .recent-activity__col.photocheck { margin-bottom: 30px; } .recent-activity__col .more-photo { display: inline-block; font-size: 14px; text-align: center; margin-left: 90px; padding: 15px 0 20px 0; } .recent-activity__row .recent-activity__col:nth-child(3) { margin-right: 0; } .recent-activity__col a { color: #0073bb; text-decoration: none; } .recent-activity__col a:hover { text-decoration: underline; } .recent-activity__name { display: block; padding-bottom: 11px; } .recent-activity__name a { text-decoration: none; font-size: 14px; font-weight: bold; color: #0073bb; } .recent-activity__col.feedback { } .recent-activity__col.feedback p { font-size: 14px; line-height: 1.1em; padding: 0 10px; } .recent-activity__row .img-container { display: inline-block; vertical-align: top; padding: 10px 10px 10px 10px; } .caption-wrapper { display: inline-block; vertical-align: bottom; } .recent-activity__caption { display: block; width: 106px; font-size: 14px; padding-bottom: 15px; } .recent-activity__col .break-line { width: 90%; border-bottom: 1px solid #E6E6E6; display: inline-block; box-sizing: border-box; margin: 0 11px; } .recent-activity .cover-wrapper { display: inline-block; } .recent-activity__likes.facebook { display: inline-block; font-size: 14px; color: #999; padding: 7px 0 7px 0; text-decoration: none; margin-left: 4px; } .recent-activity__likes.facebook:hover .text-like { color: #005f9b; text-decoration: none; } .recent-activity__likes.facebook:hover .fb-img-like { background-image: url(https://s2.postimg.org/sk66m6sdl/like_hover.png); background-repeat: no-repeat; text-decoration: none; } .recent-activity__likes.fb-img-like { display: inline-block; width: 24px; min-height: 24px; background-size: cover; background-image: url(https://s12.postimg.org/e2fcy68vx/like.png); vertical-align: bottom; } .recent-activity__likes.text-like { display: inline-block; font-size: 14px; vertical-align: bottom; min-height: 12px; padding-left: 6px; } .recent-activity__reaction { display: inline-block; padding: 9px 0 12px 11px; } .recent-activity__reaction .reaction-item { display: inline-block; width: 20px; height: 20px; padding-right: 15px; } .recent-activity__reaction .funny:hover { background-image: url(https://s3.postimg.org/jz435cmir/cool_icn_hover.png); } .recent-activity__reaction .useful:hover { background-image: url(https://s8.postimg.org/jvklb9ud1/useful_icn_hover.png); } .recent-activity__reaction .cool:hover { background-image: url(https://s24.postimg.org/q6qzribxx/cool_icn_hover.png); } .recent-activity__reaction .compliment:hover { background-image: url(https://s15.postimg.org/6h9t40sp7/compl_icn_hover.png); } .recent-activity__likes .fb-img-like:hover { background-image: url(https://s2.postimg.org/sk66m6sdl/like_hover.png); background-repeat: no-repeat; text-decoration: none; } /* nav li a:hover:after{ width: 100%; } */ .reaction-item.useful { background-image: url(https://s18.postimg.org/4mbtuyvdl/useful_icn.png); background-repeat: no-repeat; } .reaction-item.funny { background-image: url(https://s2.postimg.org/mumzpcbsp/funny_icn.png); background-repeat: no-repeat; } .reaction-item.cool { background-image: url(https://s29.postimg.org/zerjdu5bb/cool_icn.png); background-repeat: no-repeat; } .reaction-item.compliment { position: relative; top: 0; left: 145px; background-image: url(https://s14.postimg.org/o0tpl6kz5/compl_icn.png); background-repeat: no-repeat; } .photo-wrapper { padding: 0 5px 5px 5px; } .photo-block { } .photo-block img { border-radius: 2px 2px 0 0; } .sub-wrapper { width: 141px; box-sizing: border-box; display: inline-block; margin: 0; padding: 0; border: 1px solid #e6e6e6; border-radius: 1px; } .photo-wrapper .sub-wrapper:nth-child(2) { margin-right: 5px; } .sub-wrapper img { margin: 0; padding: 0; border-radius: 4px 4px 0 0; } /* FOOTER */ .show-more-wrapper { display: block; width: 960px; margin: 0 auto; margin-bottom: 95px; } .show-more { width: 300px; margin: 0 auto; } .show-more a { font-size: 14px; color: #0073bb; text-decoration: none; } .show-more a:before { content: ''; display: inline-block; width: 14px; height: 9px; margin-right: 10px; background-image: url(https://s17.postimg.org/65f1h7i9r/arrow_dn.png); background-repeat: no-repeat; cursor: pointer; vertical-align: center; padding-bottom: 1px; } .show-more a:hover { text-decoration: underline; color: #0073bb; } /* Mobile Apps Section Start Here */ .mobile-apps { width: 960px; margin: 0 auto; padding-left: 70px; margin-bottom: 73px; } .mobile-apps__wrapper { } h2.mobile-apps__heading { font-size: 21px; color: #d32323; text-align: center; margin-right: 149px; margin-bottom: 40px; } .iOS.mobile-apps__os { display: inline-block; width: 325px; font-size: 14px; border: 1px solid #e6e6e6; border-radius: 4px; padding: 0; padding-left: 33px; padding-top: 36px; padding-bottom: 14px; box-sizing: border-box; } .iOS.mobile-apps__os span { margin-left: 44px; font-weight: bold; margin-bottom: 16px; display: inline-block; } .Android.mobile-apps__os span { min-width: 100px; font-weight: bold; margin-bottom: 16px; display: inline-block; margin-left: 103px; } .Android.mobile-apps__os { display: inline-block; width: 465px; font-size: 14px; border: 1px solid #e6e6e6; border-radius: 4px; padding: 0; padding-left: 91px; padding-top: 36px; padding-bottom: 14px; box-sizing: border-box; } a.mobile-apps__link { display: inline-block; color: #333; vertical-align: top; } .left-col.mobile-apps__link { margin-right: 100px; } .mobile-apps__os.iOS:hover { display: inline-block; color: #0073bb; border: 1px solid #0073bb; border-radius: 4px; overflow: hidden; } .mobile-apps__os.Android:hover { display: inline-block; color: #0073bb; border: 1px solid #0073bb; border-radius: 4px; overflow: hidden; } /* **************** footer start's here *******************/ .main-footer { display: block; min-height: 516px; background: #f5f5f5; } .main-footer__wrapper { width: 960px; outline: 1px solid #000; margin: 0 auto; background-color: #f5f5f5; } .main-footer .main-footer__col { display: inline-block; outline: 1px solid red; vertical-align: top; } .main-footer__col.region { outline: none; } .main-footer__col.about { width: 130px; margin-right: 120px; } .main-footer__col.discover { width: 90px; margin-right: 158px; } .main-footer__col.business-owners { width: 186px; margin-right: 61px; } .main-footer__col.region { max-width: 92px; } .main-footer__col.region select { font-size: 14px; -webkit-appearance: none; background: none; border: none; outline: none; color: #0073bb; } .main-footer__col.region select:hover { cursor: pointer; } .main-footer__col.region option { color: ##0073bb; } .main-footer .main-footer__col a { display: block; line-height: 1.1em; font-size: 14px; margin-bottom: 10px; color: #0073bb; text-decoration: none; outline: 1px solid blue; } .languages-list { display: block; } .languages-list li { display: inline-block; font-size: 14px; } ul li ul { list-style: none; margin: 0; padding: 0; } ul li:hover ul { visibility: visible; } ul li ul li:hover { background-color: #0073bb; color: #fff; } ul li ul li { display: block; width: 100%; padding: 7px 15px 7px 15px; background-color: #fff; color: #0073bb; cursor: pointer; user-select: none; } .languages-sublist { display: block; font-size: 14px; line-height: 1.1em; } .languages-sublist { visibility: hidden; } .countries-list { display: block; } .countries-list li { display: inline-block; font-size: 14px; } ul li ul { list-style: none; margin: 0; padding: 0; } ul li:hover ul { visibility: visible; } ul li ul li:hover { background-color: #0073bb; color: #fff; } ul li ul li { display: block; width: 100%; padding: 7px 15px 7px 15px; background-color: #fff; color: #0073bb; cursor: pointer; user-select: none; } .countries-sublist { display: block; font-size: 14px; line-height: 1.1em; } .countries-sublist { visibility: hidden; }

Related: See More


Questions / Comments: