Style Guide

Color Palette

#352438
#a59553
#3aa0d5
#4b474c
#030303

Headings

h1.Heading

h1.Sub Heading

h2.Heading

h2.Sub Heading

h3.Heading

h3.Sub Heading

h4.Heading

h4.Sub Heading

h5.Heading
h5.Sub Heading
h6.Heading
h6.Sub Heading

Heading Sizer h1

Heading Sizer h2

Heading Sizer h3

Heading Sizer h4

Heading Sizer h5

Heading Sizer h6

<h1 class="heading-divider">Headings</h1>
<h1>h1.Heading</h1>
<h1 class="subheader">h1.Sub Heading</h1>
<h2>h2.Heading</h2>
<h2 class="subheader">h2.Sub Heading</h2>
<h3>h3.Heading</h3>
<h3 class="subheader">h3.Sub Heading</h3>
<h4>h4.Heading</h4>
<h4 class="subheader">h4.Sub Heading</h4>
<h5>h5.Heading</h5>
<h5 class="subheader">h5.Sub Heading</h5>
<h6>h6.Heading</h6>
<h6 class="subheader">h6.Sub Heading</h6>
<h3 class="h1">Heading Sizer h1</h3>
<h3 class="h2">Heading Sizer h2</h3>
<h3 class="h3">Heading Sizer h3</h3>
<h3 class="h4">Heading Sizer h4</h3>
<h3 class="h5">Heading Sizer h5</h3>
<h3 class="h6">Heading Sizer h6</h3>

Paragraphs

This is a lead paragraph donec venenatis vulputate lorem. Nam at tortor in tellus interdum sagittis. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. Praesent egestas neque eu enim. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce id purus.

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Paragraph link. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

<p class="intro">This is a lead paragraph donec venenatis vulputate lorem. Nam at tortor in tellus interdum sagittis. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. Praesent egestas neque eu enim. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce id purus.</p>
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. <a href="#">Paragraph link</a>. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<img src="http://placehold.it/350x250" class="alignright border">
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<img src="http://placehold.it/350x250" class="alignleft border">
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<img src="http://placehold.it/1200x400" class="aligntop border">
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>

Aligning

Left Align Lorem ipsum Ut a nisl id ante tempus hendrerit.

Right Align Lorem ipsum Ut a nisl id ante tempus hendrerit.

Center Lorem ipsum Ut a nisl id ante tempus hendrerit.

<p class="left-align border p1"><strong>Left Align</strong> Lorem ipsum Ut a nisl id ante tempus hendrerit.</p>
<p class="right-align border p1"><strong>Right Align</strong> Lorem ipsum Ut a nisl id ante tempus hendrerit.</p>
<p class="center border p1"><strong>Center</strong> Lorem ipsum Ut a nisl id ante tempus hendrerit.</p>

Blockquotes

Blockquote Text donec venenatis vulputate lorem. Nam at tortor in tellus interdum sagittis. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. Praesent egestas neque eu enim. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce id purus. posuere cubilia Curae; Fusce id purus. Fusce id purus. posuere

Optional Authors Name Optional Second Field

<blockquote>
<p class="quote">Blockquote Text donec venenatis vulputate lorem. Nam at tortor in tellus interdum sagittis. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. Praesent egestas neque eu enim. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce id purus. posuere cubilia Curae; Fusce id purus. Fusce id purus. posuere </p>
<p class="cite">Optional Authors Name <span> Optional Second Field</span> </p>
</blockquote>

Typography

Italic Font

Upercase Font Decoration

Bold Font Weight

Normal Font Weight

Font Size t1

Font Size t2

Font Size t3

Font Size t4

Font Size t5

Font Size t6

Font Size t7

Font Size t8

Font Size t9

Font Size t10

<p class="italic">Italic Font</p>
<p class="caps">Upercase Font Decoration</p>
<p class="bold">Bold Font Weight</p>
<p class="regular">Normal Font Weight</p>
<p class="t1">Font Size t1</p>
<p class="t2">Font Size t2</p>
<p class="t3">Font Size t3</p>
<p class="t4">Font Size t4</p>
<p class="t5">Font Size t5</p>
<p class="t6">Font Size t6</p>
<p class="t7">Font Size t7</p>
<p class="t8">Font Size t8</p>
<p class="t9">Font Size t9</p>
<p class="t10">Font Size t10</p>

Spacing

Top Spacing

Margin Top 0
Margin Top 1
Margin Top 2
Margin Top 3
Margin Top 4
Margin Top 5
Margin Top 6
Margin Top 7
Margin Top 8
Margin Top 9
Margin Top 10
Margin Top 11

Bottom Spacing

Margin Bottom 0
Margin Bottom 1
Margin Bottom 2
Margin Bottom 3
Margin Bottom 4
Margin Bottom 5
Margin Bottom 6
Margin Bottom 7
Margin Bottom 8
Margin Bottom 9
Margin Bottom 10
Margin Bottom 11
<div class="mt0">Margin Top 0</div>
<div class="mt1">Margin Top 1</div>
<div class="mt2">Margin Top 2</div>
<div class="mt3">Margin Top 3</div>
<div class="mt4">Margin Top 4</div>
<div class="mt5">Margin Top 5</div>
<div class="mt6">Margin Top 6</div>
<h4 class="mt4 mb1">Bottom Spacing</h4>
<div class="mb0">Margin Bottom 0</div>
<div class="mb1">Margin Bottom 1</div>
<div class="mb2">Margin Bottom 2</div>
<div class="mb3">Margin Bottom 3</div>
<div class="mb4">Margin Bottom 4</div>
<div class="mb5">Margin Bottom 5</div>
<div class="mb6">Margin Bottom 6</div>

Lists

  • List Item 1
  • List Item 2
  • List Item 3
  • List Item 4
    • Sub List Item 1
    • Sub List Item 2
    • Sub List Item 3
    • Sub List Item 4
    • Sub List Item 5
  • List Item 6
  1. List Item 1
  2. List Item 2
  3. List Item 3
  4. List Item 4
    1. Sub List Item 1
    2. Sub List Item 2
    3. Sub List Item 3
    4. Sub List Item 4
    5. Sub List Item 5
  5. List Item 6
  • List Item 1
  • List Item 2
  • List Item 3
  • List Item 4
    • Sub List Item 1
    • Sub List Item 2
    • Sub List Item 3
    • Sub List Item 4
    • Sub List Item 5
  • List Item 6
<ul class="bullet-a">
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
<li>List Item 4
<ul>
<li>Sub List Item 1</li>
<li>Sub List Item 2</li>
<li>Sub List Item 3</li>
<li>Sub List Item 4</li>
<li>Sub List Item 5</li>
</ul>
</li>
<li>List Item 6</li>
</ul>
<ul class="list-a">
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
<li>List Item 4
<ul>
<li>Sub List Item 1</li>
<li>Sub List Item 2</li>
<li>Sub List Item 3</li>
<li>Sub List Item 4</li>
<li>Sub List Item 5</li>
</ul>
</li>
<li>List Item 6</li>
</ul>

Buttons

Disabled Button

Expanded Button

<a class="button large" href="#">Primary Large</a>
<a class="button" href="#">Primary Default</a>
<a class="button tiny" href="#">Primary Tiny</a>
<a class="button secondary large" href="#">Secondary Large</a>
<a class="button secondary" href="#">Secondary Default</a>
<a class="button secondary tiny" href="#">Secondary Tiny</a>
<a class="button tertiary large" href="#">Tertiary Large</a>
<a class="button tertiary" href="#">Tertiary Default</a>
<a class="button tertiary tiny" href="#">Tertiary Tiny</a>
<a class="button disabled" href="#">Disabled Button</a>
<a class="button expand" href="#">Expanded Button</a>

Images & Text Blocks

Weekly Gatherings

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit autem nihil ad debitis vero, minima. Nisi id sit a tenetur!

Ipsum quia, blanditiis nihil, beatae dolorem, maiores cupiditate eum quas fugit excepturi nostrum ea repudiandae facilis impedit ut! Perspiciatis, perferendis!

About Chosen

Ipsum quia, blanditiis nihil, beatae dolorem, maiores cupiditate eum quas fugit excepturi nostrum ea repudiandae facilis impedit ut! Perspiciatis, perferendis!

What to Expect

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit autem nihil ad debitis vero, minima. Nisi id sit a tenetur!

Ipsum quia, blanditiis nihil, beatae dolorem, maiores cupiditate eum quas fugit excepturi!

Section w/ Heading Block No Background

Optional Subtitle

Experience the World

Teaching through God's Word chapter by chapter, verse by verse.

Learn More

Pattern Background Section w/ Heading Block

Optional Subtitle

Experience the World

Teaching through God's Word chapter by chapter, verse by verse.

Background Section w/Heading Block

Optional Subtitle

Experience Fellowship

Jesus is our common ground, the foundation of our community. Join us as we seek to grow together in God's grace and love.

Learn More

Chevron Background Section w/Heading Block

Optional Subtitle

Experience Fellowship

Jesus is our common ground, the foundation of our community. Join us as we seek to grow together in God's grace and love.

Learn More

Chevron Section Header

Optional Subtitle

Experience the World

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus molestiae similique laudantium sint eaque sapiente quis placeat culpa asperiores pariatur. dolor sit amet, consectetur.

Section With Heading and Negative Margin Image

Rest Assured

Children’s Ministries is provided for all kids from nursery through fifth grade at the Calvary Beaverton 10am Sunday service at Southridge High School.

Image Tab Carousel

Explore all of our uplifting ministries
Explore all of our uplifting ministries
Explore all of our uplifting ministries
Explore all of our uplifting ministries
Explore all of our uplifting ministries

Full Width CTA Right

Location Calvary Chapel Southeast Portland

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores, quia, quasi recusandae sint labore consequuntur eum vitae quibusdam eius modi non magnam illo laudantium magni doloremque aspernatur suscipit hic officiis ex nisi officia.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores, quia, quasi recusandae sint labore consequuntur eum vitae quibusdam eius modi non magnam illo laudantium magni doloremque aspernatur suscipit hic officiis ex nisi officia.

Learn More

Full Width CTA Left

Location Calvary Chapel Southeast Portland

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores, quia, quasi recusandae sint labore consequuntur eum vitae quibusdam eius modi non magnam illo laudantium magni doloremque aspernatur suscipit hic officiis ex nisi officia.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores, quia, quasi recusandae sint labore consequuntur eum vitae quibusdam eius modi non magnam illo laudantium magni doloremque aspernatur suscipit hic officiis ex nisi officia.

Learn More

Full Width CTA Purple

Senior Pastor Rich Jones 1

If you should have any questions regarding this ministry, please feel free to contact our Senior Pastor.

Contact:
(123) 123-1234
Email

Book Items

Women's Group

01 - Example Group Name
01 - Example Group Name Tuesdays @ 9 - 11 am View Details
02 - Example Group Name
02 - Example Group Name Tuesdays @ 9 - 11 am View Details
03 - Example Group Name
03 - Example Group Name Tuesdays @ 9 - 11 am View Details
04 - Example Group Name
04 - Example Group Name Tuesdays @ 9 - 11 am View Details
05 - Example Group Name
05 - Example Group Name Tuesdays @ 9 - 11 am View Details

Forms

<form>
<div class="row">
<div class="large-12 columns">
<label>Input Label
<input type="text" placeholder="large-12.columns">
</label>
</div>
</div>
<div class="row">
<div class="large-4 columns">
<label>Input Label
<input type="text" placeholder="large-4.columns">
</label>
</div>
<div class="large-4 columns">
<label>Input Label
<input type="text" placeholder="large-4.columns">
</label>
</div>
<div class="large-4 columns">
<label>Input Label
<input type="text" placeholder="large-4.columns">
</label>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<label>Select Box
<select>
<option value="husker">Husker</option>
<option value="starbuck">Starbuck</option>
<option value="hotdog">Hot Dog</option>
<option value="apollo">Apollo</option>
</select>
</label>
</div>
</div>
<div class="row row-checkbox">
<div class="large-6 columns">
<label>Choose Your Favorite</label>
<label class="input-radio">
<input type="radio" name="pokemon" value="Red" id="pokemonRed">
Red</label>
<label class="input-radio">
<input type="radio" name="pokemon" value="Blue" id="pokemonBlue">
Blue</label>
</div>
<div class="large-6 columns">
<label>Check these out</label>
<label class="input-checkbox">
<input id="checkbox1" type="checkbox">
Checkbox 1</label>
<label class="input-checkbox">
<input id="checkbox2" type="checkbox">
Checkbox 2</label>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<label>Textarea Label
<textarea rows="8" placeholder="small-12.columns"></textarea>
</label>
</div>
</div>
<div class="row">
<div class="large-12 columns">
<button type="submit" class="button">Submit</button>
</div>
</div>
</form>

Block Grids

<div class="row xsmall-up-1 small-up-2 medium-up-3 large-up-4">
<div class="column"> <img src="http://placehold.it/350x300" class="mb3 border"> </div>
<div class="column"> <img src="http://placehold.it/350x300" class="mb3 border"> </div>
<div class="column"> <img src="http://placehold.it/350x300" class="mb3 border"> </div>
<div class="column"> <img src="http://placehold.it/350x300" class="mb3 border"> </div>
<div class="column"> <img src="http://placehold.it/350x300" class="mb3 border"> </div>
<div class="column"> <img src="http://placehold.it/350x300" class="mb3 border"> </div>
<div class="column"> <img src="http://placehold.it/350x300" class="mb3 border"> </div>
</div>

Alerts

This is an example successful alert message that would be used for forms or login messages more info

This is an example info alert message that would be used for forms or login messages more info

This is an example warning alert message that would be used for forms or login messages more info

This is an example danger alert message that would be used for forms or login messages more info

<div class="alert alert-success">
<p>This is an example successful alert message that would be used for forms or login messages <a href="#">more info</a> </p>
</div>
<div class="alert alert-info">
<p>This is an example info alert message that would be used for forms or login messages <a href="#">more info</a> </p>
</div>
<div class="alert alert-warning">
<p>This is an example warning alert message that would be used for forms or login messages <a href="#">more info</a> </p>
</div>
<div class="alert alert-danger">
<p>This is an example danger alert message that would be used for forms or login messages <a href="#">more info</a> </p>
</div>

Slide Content

Slide Toggle With Link

Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

More Info

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Slide Toggle With Button

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

More Info

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.

<h3>Slide Toggle With Link</h3>
<p>Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus
laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula,
eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<div class="slide-toggle-container">
<p> <a class="slide-toggle" href="#">More Info</a> </p>
<div class="slide-content">
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
</div>
</div>
<h3>Slide Toggle With Button</h3>
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<div class="slide-toggle-container"> <a class="slide-toggle button" href="#"> More Info</a>
<div class="slide-content">
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
<p>Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.</p>
</div>
</div>

Accordion

FAQ Question 1. Pellentesque dapibus hendrerit tortor. Donec vitae orci sed dolor?
Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.
FAQ Question 2. Pellentesque dapibus hendrerit tortor. Donec vitae orci sed dolor?
Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.
FAQ Question 3. Pellentesque dapibus hendrerit tortor. Donec vitae orci sed dolor?
Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.
<dl class="accordion">
<dt>FAQ Question 1. Pellentesque dapibus hendrerit tortor. Donec vitae orci sed dolor?</dt>
<dd>Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.</dd>
<dt>FAQ Question 2. Pellentesque dapibus hendrerit tortor. Donec vitae orci sed dolor?</dt>
<dd>Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.</dd>
<dt>FAQ Question 3. Pellentesque dapibus hendrerit tortor. Donec vitae orci sed dolor?</dt>
<dd>Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.</dd>
</dl>

Vertical Tabs

  • Tab 1
  • Tab 2
  • Tab 3

Chicago has a number of successful incubators that help entrepreneurs get their start-ups off the ground, but incubation is only the beginning. We help entrepreneurs go beyond the basics, providing engagement and insight on how to execute a successful business plan, grow your team, and cultivate better products and services.

Accelerators provide instruction and create opportunities for investment. While The Cultivator creates similar opportunities, we do not “graduate” companies after a few months or weeks of instruction. The Cultivator partners with growing businesses that can benefit from the accountabilities, measurement, experience, guidance, and investment of our Members.

The Cultivator has an active investment fund which we use to accelerate the growth and potential of companies that partner with us, but our investment goes beyond capital. We help business owners make the most of their resources, including capital, talent, and tech. Our holistic approach to business development enables entrepreneurs to do more with the resources they already have while considering new, viable alternatives when needed.

<div id="js-tabs-vertical">
<ul class="resp-tabs-list js-tabs-a">
<li>Tab 1</li>
<li>Tab 2</li>
<li>Tab 3</li>
</ul>
<div class="resp-tabs-container js-tabs-a">
<div>
<p>Chicago has a number of successful incubators that help entrepreneurs get their start-ups off the ground, but incubation is only the beginning. We help
entrepreneurs go beyond the basics, providing engagement and insight on how to execute a successful business plan, grow your team, and cultivate better
products and services.</p>
</div>
<div>
<p>Accelerators provide instruction and create opportunities for investment. While The Cultivator creates similar opportunities, we do not “graduate” companies
after a few months or weeks of instruction. The Cultivator partners with growing businesses that can benefit from the accountabilities, measurement,
experience, guidance, and investment of our Members.</p>
</div>
<div>
<p>The Cultivator has an active investment fund which we use to accelerate the growth and potential of companies that partner with us, but our investment
goes beyond capital. We help business owners make the most of their resources, including capital, talent, and tech. Our holistic approach to business
development enables entrepreneurs to do more with the resources they already have while considering new, viable alternatives when needed.</p>
</div>
</div>
</div>

Horizontal Tabs

  • Tab 1
  • Tab 2
  • Tab 3

Chicago has a number of successful incubators that help entrepreneurs get their start-ups off the ground, but incubation is only the beginning. We help entrepreneurs go beyond the basics, providing engagement and insight on how to execute a successful business plan, grow your team, and cultivate better products and services.

Accelerators provide instruction and create opportunities for investment. While The Cultivator creates similar opportunities, we do not “graduate” companies after a few months or weeks of instruction. The Cultivator partners with growing businesses that can benefit from the accountabilities, measurement, experience, guidance, and investment of our Members.

The Cultivator has an active investment fund which we use to accelerate the growth and potential of companies that partner with us, but our investment goes beyond capital. We help business owners make the most of their resources, including capital, talent, and tech. Our holistic approach to business development enables entrepreneurs to do more with the resources they already have while considering new, viable alternatives when needed.

<div id="js-tabs-horizontal">
<ul class="resp-tabs-list js-tabs-a resp-htabs">
<li>Tab 1</li>
<li>Tab 2</li>
<li>Tab 3</li>
</ul>
<div class="resp-tabs-container js-tabs-a">
<div>
<p>Chicago has a number of successful incubators that help entrepreneurs get their start-ups off the ground, but incubation is only the beginning. We help
entrepreneurs go beyond the basics, providing engagement and insight on how to execute a successful business plan, grow your team, and cultivate better
products and services.</p>
</div>
<div>
<p>Accelerators provide instruction and create opportunities for investment. While The Cultivator creates similar opportunities, we do not “graduate” companies
after a few months or weeks of instruction. The Cultivator partners with growing businesses that can benefit from the accountabilities, measurement,
experience, guidance, and investment of our Members.</p>
</div>
<div>
<p>The Cultivator has an active investment fund which we use to accelerate the growth and potential of companies that partner with us, but our investment
goes beyond capital. We help business owners make the most of their resources, including capital, talent, and tech. Our holistic approach to business
development enables entrepreneurs to do more with the resources they already have while considering new, viable alternatives when needed.</p>
</div>
</div>
</div>

Tables

Table Header Table Header Table Header Table Header
Content Goes Here This is longer content Donec id elit non mi porta gravida at eget metus. Content Goes Here Content Goes Here
Content Goes Here This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. Content Goes Here Content Goes Here
Content Goes Here This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. Content Goes Here Content Goes Here
<table class="table">
<thead>
<tr>
<th width="200">Table Header</th>
<th>Table Header</th>
<th width="150">Table Header</th>
<th width="150">Table Header</th>
</tr>
</thead>
<tbody>
<tr>
<td>Content Goes Here</td>
<td>This is longer content Donec id elit non mi porta gravida at eget metus.</td>
<td>Content Goes Here</td>
<td>Content Goes Here</td>
</tr>
<tr>
<td>Content Goes Here</td>
<td>This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus.</td>
<td>Content Goes Here</td>
<td>Content Goes Here</td>
</tr>
<tr>
<td>Content Goes Here</td>
<td>This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus.</td>
<td>Content Goes Here</td>
<td>Content Goes Here</td>
</tr>
</tbody>
</table>

Shortcodes

Weekly Schedule

Shortcode: [times]

Calvary Chapel Hillsboro

Times & Locations


Social Links

Shortcode: [social]


Campus

This is controlled from theme settings.

Shortcode: [campus]

Photo of Calvary Chapel campus

Calvary Chapel Hillsboro

  • 6550 SE Alexander Street
    Hillsboro, Oregon 97123

What We Believe

Shortcode: [what-we-believe]


Prayers

Shortcode: [prayer]

Christy - Stayton

Please pray for my stepsister Lori. She has been intubated due to COVID. Lori has Downs with health complications.. She has the purest heart for Jesus

Prayer sent January-02-2022

Susan - HILLSBORO

Please pray for Kris who is very, very ill with COVID. Please pray for his oxygen levels to go back up. <3

Prayer sent December-29-2021

Mike

Please pray for Kyran. He's entering the second year of his battle with stage 4 colon & liver cancer. He has a lot of ups and downs but his numbers are bad again. Any prayers would be greatly appreciated. Thank you!!

Prayer sent December-28-2021

Sandra

Please pray that Sandra's house in Iowa will sell this spring and that she will find a new home that she can afford in Oregon. 

Prayer sent December-28-2021

Denise - Hillsboro

A patient who's been in a local hospital with covid, since March of this year, asked me if I could request prayer for her, for healing.

Prayer sent December-27-2021

Aaron - Forest Grove

Please pray for my uncle. They have given him a few weeks to live due to a malignant brain tumor. Also pray for my aunt for comfort & peace.

Prayer sent December-27-2021

Becky - Oregon

I just lost a job that I love and got transferred into another department in the company. Please pray if it's the Lord's will that he will restore my job back.

Prayer sent December-21-2021


Get Involved

Shortcode: [get-involved]

This will be full width if inserted in a content block on a page.

I’m New Here

I’m New Here

If you plan to be a part of Calvary Chapel Worship Center and want to stay updated with church events and information please submit your contact information and we will add you to our internal email list.

Growth Groups

Growth Groups

Growth Groups are small fellowships of believers who meet weekly to grow spiritually, build relationships, and to minister to each other. Our vision is to get connected relationally in groups for the purpose of growing in our relationship to Jesus Christ. It’s also an opportunity to love one another and to build up and edify one another as we grow as a disciple of our Lord.

View Groups
Interested in leading a growth group? Find Out How

Summer Classes

Summer Classes

Short-term summer classes are a great way to keep connected and grow spiritually together!

View Classes
Interested in leading a summer class? Find Out How

All Serving Opportunities

All Serving Opportunities

There are a number of ministries that serve our church internally and reach out to our community where you can serve! To view a full list of ministry volunteer needs and opportunities, please click the button below.

View Serving Opportunities Get Involved

Serve in Children’s Ministry

Serve in Children’s Ministry

No experience is needed, just a heart to answer the call. We have training and curriculum prepared for you to succeed in children’s ministry.

(Note: participation dependent on background check)

Adult Volunteer Application More Information

Serve in Middle School Ministry

Serve in Middle School Ministry

If you are interested in serving as a volunteer in our Middle School Ministry, please fill out and submit the form by clicking the button below and Andrew May will be in contact with you soon.

Serve in Middle School Ministry Volunteer

Serve in High School Ministry

Serve in High School Ministry

If you are interested in serving as a volunteer in our High School Ministry, please fill out and submit the form by clicking the button below and Mike Dodd will be in contact with you soon.

(Note: participation dependent on background check)

Serve in High School Ministry Volunteer

Team Leadership

Shortcode: [leadership]

This will be full width if inserted in a content block on a page.

Click or use arrows to navigate through

Growth Groups

Shortcode: [growth-groups]

Mixed Adults

Biblical Study of 1 & 2 Peter Tuesdays, 7:00pm (Starts: January 11 – ongoing, join at any time) View Details
Letter to the Hebrews Tuesdays, 6:30pm (Starts: January 25) View Details
Financial Peace University Thursdays, 6:30 PM (Starts: January 27) View Details
Pathway to Freedom: Study of the Ten Commandments Thursdays, 6:30pm (Starts: January 27) View Details
Griefshare Tuesdays, 6:30 PM (Starts: February 1) View Details
The Gospel of Matthew Tuesdays, 7:00 PM (Starts: February 15) View Details
Standing Firm in the Face of Opposition Thursdays, 6:30pm (Starts: February 3) View Details
Is Genesis History? Thursdays, 6:30 PM (Starts: February 3) View Details
Don’t Give the Enemy a Seat at Your Table Sundays, 6:00 PM (Starts: February 6) View Details
DivorceCare Tuesdays, 6:30pm (Starts: February 8) View Details
Young Adults Missional Communities Sunday, Tuesday, Thursday (Ongoing, join at any time) View Details

Women's Group

The Book of James: Growing in Wisdom & Faith Tuesdays, 9am - Tuesdays, 7:00pm - Thursdays, 6:30pm (Starts: January 25/27) View Details
At His Feet Prayer Ministry Wednesdays, 4:30pm (Ongoing, join at any time) View Details
At His Feet Prayer Ministry Fridays, 10:00am (Ongoing, join at any time) View Details
Prodigals Prayer Group Fridays, 11:00am (Ongoing, join at any time) View Details

Men's Group

My Brother’s Keeper Tuesdays, 6:30pm (Ongoing, join at any time) View Details
Men’s Discipleship Thursday Nights Thursdays, 7:00pm (Ongoing, join at any time) View Details
Saturday Men’s Group Saturdays, 8:00am (Ongoing, join at any time) View Details
For Men Only Ongoing; Can be joined at anytime View Details

Recent Messages Sliders

Shortcode: [recent-messages-sliders]