Intelligentsia - Free Shipping on all Consumer US orders over $40

    • No bleed content must be wrapped inside an div element with .container-fluid class

Example Usage

            
<div class="container-fluid">
   ... contents here
</div>

Helper Classes

Border helpers

Removes border(s) from element

.no-border-top
.no-border-bottom
.no-border-left
.no-border-right

Text align Helpers

.text-align-center
.text-align-left
.text-align-right

Text color Helpers

.text-white
.text-black

Margin Helpers

Adds margin to an element. Default value is dictated by global styles

.m-top
.m-bottom
.m-right
.m-left

Centered block text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sapien diam, aliquam quis condimentum ut, maximus id lectus. Duis augue sem, tempor ac urna quis, interdum consectetur eros.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sapien diam, aliquam quis condimentum ut, maximus id lectus. Duis augue sem, tempor ac urna quis, interdum consectetur eros. Pellentesque congue nulla lacus, a interdum eros vestibulum eu. Pellentesque congue nulla lacus, a interdum eros vestibulum eu.

Styled to resemble an Italian espresso bar, this store features original tile floors, marble-topped tables and classic bar stylings. For those of you more familiar with our other coffeebars, this one is a bit more of a classic as compared to our Broadway or Millennium Park locations.

Centered block text

        
<div class="section section__center">
    <h2 class="text-align-center">Block Text centered</h2>
    <div class="block-text-header">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sapien diam, aliquam quis condimentum ut, maximus id lectus. Duis augue sem, tempor ac urna quis, interdum consectetur eros.</p>
    </div>
    <div class="block-text">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sapien diam, aliquam quis condimentum ut, maximus id lectus. Duis augue sem, tempor ac urna quis, interdum consectetur eros. Pellentesque congue nulla lacus, a interdum eros vestibulum eu. Pellentesque congue nulla lacus, a interdum eros vestibulum eu.</p>
    </div>
    <div class="block-text_font-large">
        <p>Styled to resemble an Italian espresso bar, this store features original tile floors, marble-topped tables and classic bar stylings. For those of you more familiar with our other coffeebars, this one is a bit more of a classic as compared to our Broadway or Millennium Park locations.</p>
    </div>
</div>

Block Grid with 2 column text

Broadway Coffeebar

Address

3123 North Broadway
Chicago, Illinois 60657
773.348.8058

More info

Hours

6am-6pm / Monday-Friday
8am-4pm / Saturday
Closed / Sunday

Broadway Coffeebar

Address

3123 North Broadway
Chicago, Illinois 60657
773.348.8058

More info

Hours

6am-6pm / Monday-Friday
8am-4pm / Saturday
Closed / Sunday

Block Grid with 2 column text

            
<div class="block-grid-img-text">
    <h2 class="text-align-center">Block Grid with 2 column text</h2>
    <div class="row">
        <div class="col-md-6"><a href="/broadway-coffeebar"><img class="gor-lazy" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}}" alt="" /></a>
            <h3 class="title__name"><a href="/broadway-coffeebar">Broadway Coffeebar</a></h3>
            <div class="block-text block-text-left">
                <h4>Address</h4>
                <p>3123 North Broadway<br />Chicago, Illinois 60657<br />773.348.8058</p>
                <a href="/broadway-coffeebar">More info</a></div>

            <div class="block-text block-text-right">
                <h4>Hours</h4>
                <p>6am-6pm / Monday-Friday<br />8am-4pm / Saturday<br />Closed / Sunday</p>
            </div>
        </div>

        <div class="col-md-6"><a href="/broadway-coffeebar"><img class="gor-lazy" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}} alt="" /></a>
            <h3 class="title__name"><a href="/broadway-coffeebar">Broadway Coffeebar</a></h3>
            <div class="block-text block-text-left">
                <h4>Address</h4>
                <p>3123 North Broadway<br />Chicago, Illinois 60657<br />773.348.8058</p>
                <a href="/broadway-coffeebar">More info</a></div>

            <div class="block-text block-text-right">
                <h4>Hours</h4>
                <p>6am-6pm / Monday-Friday<br />8am-4pm / Saturday<br />Closed / Sunday</p>
            </div>
        </div>
    </div>
</div>

Monadnock Building
53 West Jackson Blvd.
Chicago, Illinois 60604
312.253.0594

6am-6pm / Monday-Friday
8am-4pm / Saturday
Closed / Sunday

Image with right content

        
<div class="block-image-address">
    <div class="block-image-address__left"><img class="gor-lazy" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}} alt="" /></div>
    <div class="block-image-address__right">
        <p class="address">Monadnock Building<br />53 West Jackson Blvd.<br />Chicago, Illinois 60604<br />312.253.0594</p>
        <p>6am-6pm / Monday-Friday<br />8am-4pm / Saturday<br />Closed / Sunday</p>
    </div>
</div>

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque architecto beatae vitae dicta sunt explicabo.

Laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.

2 column content

        
<div class="row block-text-two-cols">
    <div class="col-md-6">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque architecto beatae vitae dicta sunt explicabo.</p>
    </div>
    <div class="col-md-6">
        <p>Laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
    </div>
</div>

2 column images

        
<div class="row block-two-images">
    <div class="col-md-6"><img class="gor-lazy" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}} alt="" /></div>
    <div class="col-md-6"><img class="gor-lazy" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}} alt="" /></div>
</div>

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More info

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More info

2 column images with description and call to action link

        
<div class="block-grid-img-text vertical-margins">
    <div class="row">
        <div class="col-md-6"><img class="gor-lazy" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}} alt="" />
            <h3 class="title__name">Lorem ipsum dolor sit amet</h3>
            <div class="block-text">
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                <a href="#">More info</a></div>
        </div>
    
        <div class="col-md-6"><img class="gor-lazy" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}} alt="" />
            <h3 class="title__name">Lorem ipsum dolor sit amet</h3>
            <div class="block-text">
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                <a href="#">More info</a></div>
        </div>
    </div>
</div>

Banner textbox with background

        
<section class="section product-subscribe">
    <div class="banner">
        <div class="banner-text">
            <div class="banner-text__inner">
                <h3>Donations</h3>
                <p>If you are interested in obtaining a donation for your organization, please use this form for requests.</p>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
            </div>
        </div>
        <div class="gor-lazy banner-img" data-bg="<?php echo $wysiwygUrl ?>cms/contact-bottom.png"></div>
    </div>
</section>
Loading ...

Google map

        
<!-- Add Address in the data-address attribute in the same format as the sample -->
<!-- Add div outside .container-fluid element for full-bleed efffect -->
<div id="gmap" data-address="53 E Jackson Blvd, Chicago, IL 60604">Loading ...</div>

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.

Block Text with Call to action and link

        
<div class="block-text_font-large">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.</p>
    <button class="button button-alternate">Wholesale Inquiry Form</button>
    <div class="links"><a href="/account/login/">Already have an account? Sign In</a></div>
</div>

Full width image with content and call to action link below

        
<section class="section">
    <img class="gor-lazy" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}} alt="" />
    <div class="block-title-text-link">
        <h3>Our Approach</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
        <a href="#">Read More</a>
    </div>
</section>

Full width banner with content inside

        
<section class="banner banner__center">
    <div class="banner-text banner-text-button">
        <div class="banner-text__inner">
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
            <button class="button button-white">Sales Office</button></div>
    </div>
    <img class="gor-lazy banner-img" src="{{media url="wysiwyg/product-placeholder.gif"}}" data-src="{{media url="wysiwyg/image-sample.jpg"}}  />
</section>

"Intelligentsia's commitment to quality and education is inspiring. Our goal with the coffee program at the restaurant was to introduce our guests to a new experience with coffee..."

Will Guidara, General Manager
Eleven Madison Park | NYC, NY

Read More Testimonials

Centered blockquote with borders

        
<div class="block-testimonials">
    <p>"Intelligentsia's commitment to quality and education is inspiring. Our goal with the coffee program at the restaurant was to introduce our guests to a new experience with coffee..."</p>
    <p class="info">Will Guidara, General Manager<br /><i>Eleven Madison Park</i> | NYC, NY</p>
    <a href="#">Read More Testimonials</a>
</div>
Loading...