Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec commodo arcu eu ultrices pellentesque. Aliquam ultricies elit tempor molestie rutrum. Maecenas pharetra sem eu accumsan dignissim. Duis vel purus commodo, semper elit vel, porttitor sem.
Main Page 1
Section top bar
Pellentesque nec nulla sagittis
Ut ultrices diam quis purus lobortis, quis viverra mauris feugiat. Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros

Donec malesuada augue non erat dictum, vitae efficitur
Maecenas vulputate tortor sit amet egestas rhoncus
Dictum erat vitae
Ut ultrices diam quis purus lobortis, quis viverra mauris feugiat. Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros
User Settings
Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros
Viverra mauris feugiat
Nulla sagittis, ut ultrices diam quis purus lobortis, quis viverra mauris feugiat. Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros
Pellentesque nec nulla
Nulla sagittis, ut ultrices diam quis purus lobortis, quis viverra mauris feugiat. Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros
Latest News
Maecenas efficitur libero a augue maximus
Counter Box
This flexibility gives you the ultimate freedom
Awards & Certyfications
Changing the options for each once added
Different Layouts
Different theme and content layouts for different app
PSDs Included
Layered and organized
Color Management Sections
Compatible color templates and advanced color management
Our Team
Nunc sollicitudin vulputate mattis

Jonathan Test
Author
Wnde omnis iste natus error sit voluptatem accusantium doloremque laudantium

Jonathan Test
Author
Wnde omnis iste natus error sit voluptatem accusantium doloremque laudantium

Jonathan Test
Author
Wnde omnis iste natus error sit voluptatem accusantium doloremque laudantium

Jonathan Test
Author
Wnde omnis iste natus error sit voluptatem accusantium doloremque laudantium
Slider Sections
Different theme and content layouts for different app
Articles List
Maecenas vulputate tortor sit amet egestas rhoncus
Aliquam varius turpis vel scelerisque molestie Donec ac libero tellus.

Nunc sit amet ipsum vestibulum, posuere felis id, vulputate erat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec commodo arcu eu ultrices pellentesque. Aliquam ultricies elit tempor molestie rutrum. Maecenas pharetra sem eu accumsan dignissim. Duis vel purus commodo, semper elit vel, porttitor sem.
Consectetur adipiscing elit donec commodo arcu

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec commodo arcu eu ultrices pellentesque. Aliquam ultricies elit tempor molestie rutrum. Maecenas pharetra sem eu accumsan dignissim. Duis vel purus commodo, semper elit vel, porttitor sem.
Testimonials List
Tortor sit amet egestas rhoncus
After trying a few other themes (where half of the promised features werent working), I have found the perfect theme for my portfolio website.
After trying a few other themes (where half of the promised features werent working)
Lorem Ipsum Content I have found
After trying a few other themes (where half of the promised features werent working), I have found the perfect theme for my portfolio website.
Pricing boxes
I have found the perfect
Regular Version
- Up to 20 users
- 50GB
- Statistics and tracking
Regular Version
- Up to 20 users
- 50GB
- Statistics and tracking
Regular Version
- Up to 20 users
- 50GB
- Statistics and tracking
Regular Version
- Up to 20 users
- 50GB
- Statistics and tracking
Contact Form Section
I have found the perfect
Markup: ..\..\styleguide\templates\pages\main-page-1.html
<body class="rocksite-p-main-page-1">
<div class="rocksite-s-top-bar rocksite-p-main-page-1-s1">
<div class="container">
<div class="rocksite-o-top-bar ">
<div class="rocksite-o-top-bar__language_menu">
</div>
<div class="rocksite-o-top-bar__nav_menu">
<ul class="rocksite-m-nav-menu -horizontal -invert -classic-item rocksite-m-nav-menu">
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Contact Us</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">About Us</a>
</li>
</ul>
</div>
<div class="rocksite-o-top-bar__info">
Lorem ipsum dolor sit amet, consectetur adipiscing elit
</div>
<div class="rocksite-o-top-bar__social-menu">
<a href="#" class="rocksite-a-button-icon -transparent -invert -small"><i class="fab fa-linkedin-in"></i> <span>214 K</span>
</a>
<a href="#" class="rocksite-a-button-icon -transparent -invert -small"><i class="fa fa-envelope"></i> <span>214 K</span>
</a>
<a href="#" class="rocksite-a-button-icon -transparent -invert -small"><i class="fab fa-twitter"></i> <span>214 K</span>
</a>
<a href="#" class="rocksite-a-button-icon -transparent -invert -small"><i class="fab fa-facebook-f"></i> <span>214 K</span>
</a>
</div>
</div>
</div>
</div>
<header class="rocksite-s-main-header -border-bottom rocksite-p-main-page-1-s2">
<div class="container">
<div class="rocksite-o-navbar-main u-fill-overlay js-menu-to-resize ">
<div class="rocksite-o-navbar-main__header">
<h4 class="rocksite-a-logo" itemprop="headline">
<a href="#" title="" rel="home" class="rocksite-a-logo__link">
<img src="../assets/images/logo.png" alt="" class="rocksite-a-logo__link__image">
</a>
</h4>
</div>
<ul class="rocksite-m-nav-menu -dropdown-menu">
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Home Page</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">About Us</a>
</li>
<li class="rocksite-m-nav-menu__item -has-children "><a
href="#" class="rocksite-m-nav-menu__link">Services</a>
<ul class="rocksite-m-nav-menu__sub-nav">
<li class="rocksite-m-nav-menu__sub-nav__item"><a
href="#" class="rocksite-m-nav-menu__sub-nav__link">Submenu 1</a></li>
<li class="rocksite-m-nav-menu__sub-nav__item"><a
href="#" class="rocksite-m-nav-menu__sub-nav__link">Submenu 2</a></li>
<li class="rocksite-m-nav-menu__sub-nav__item"><a
href="#" class="rocksite-m-nav-menu__sub-nav__link">Submenu 3</a></li>
</ul>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Our Offer</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Contact Us</a>
</li>
<li class="rocksite-m-nav-menu__item js-expand-search -icon-item"><a
href="#" class="rocksite-m-nav-menu__link"><i class="fa fa-search"></i></a>
</li>
</ul>
<div class="rocksite-o-navbar-main__search-bar js-search-box-to-expand u-hidden u-fill-overlay__inner -right">
<div class="rocksite-o-search-navbar">
<a href="#" class="rocksite-a-button-icon rocksite-o-search-navbar__close -transparent js-close-search"><i class="la la-close"></i> <span>214 K</span>
</a>
<form role="search" method="get" id="searchform-content"
class="rocksite-m-input-connections -searchform rocksite-o-search-navbar__search-box" action="//127.0.0.1:3000/wordpress4.8/">
<div class="rocksite-m-input-connections__group">
<input type="text" value="" name="s" class="rocksite-m-input-connections__group__input" placeholder="Search">
<span class="rocksite-m-input-connections__group__btn">
<button class="rocksite-a-button-icon -secondary">
<i class="la la-search"></i>
</button>
</span>
</div>
</form>
</div>
</div>
</div>
</div>
</header>
<section class="rocksite-s-default rocksite-p-main-page-1-s3" style="background-color:#f8f8f8">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="rocksite-m-hero-content ">
<header class="rocksite-m-hero-content__header">
<span class="rocksite-m-hero-content__header__above_title">Prus lobortis</span>
<h2 class="rocksite-m-hero-content__header__title">Pellentesque nec nulla sagittis</h2>
</header>
<div class="rocksite-m-hero-content__content">
<p>Ut ultrices diam quis purus lobortis, quis viverra mauris feugiat. Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros</p>
</div>
<div class="rocksite-m-hero-content__footer">
<a href="#" class="rocksite-a-button -primary">
Read more
</a>
<a href="#" class="rocksite-a-button -ghost">
Contact Us
</a>
</div>
</div>
</div>
<div class="col-md-6">
<img src="../assets/images/pages/tablet-large.jpg" alt="large-image"/>
</div>
</div>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s4">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Donec malesuada augue non erat dictum, vitae efficitur</h2>
<p class="rocksite-o-section-header__subtitle"> Maecenas vulputate tortor sit amet egestas rhoncus</p>
</header>
<div class="row">
<div class="col-sm-3">
<div class="rocksite-m-info ">
<div class="rocksite-m-info__content">
<h3 class="rocksite-m-info__content__title">Dictum erat vitae</h3>
<p>Ut ultrices diam quis purus lobortis, quis viverra mauris feugiat. Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros</p>
</div>
<div class="rocksite-m-info__icon">
<span class="rocksite-a-icon -large"><i class="la la-bullhorn"></i></span>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-info ">
<div class="rocksite-m-info__content">
<h3 class="rocksite-m-info__content__title">User Settings</h3>
<p>Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros</p>
</div>
<div class="rocksite-m-info__icon">
<span class="rocksite-a-icon -large"><i class="la la-female"></i></span>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-info ">
<div class="rocksite-m-info__content">
<h3 class="rocksite-m-info__content__title">Viverra mauris feugiat</h3>
<p>Nulla sagittis, ut ultrices diam quis purus lobortis, quis viverra mauris feugiat. Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros</p>
</div>
<div class="rocksite-m-info__icon">
<span class="rocksite-a-icon -large"><i class="la la-user-plus"></i></span>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-info ">
<div class="rocksite-m-info__content">
<h3 class="rocksite-m-info__content__title">Pellentesque nec nulla</h3>
<p>Nulla sagittis, ut ultrices diam quis purus lobortis, quis viverra mauris feugiat. Pellentesque nec nulla sagittis, dictum erat vitae, venenatis eros</p>
</div>
<div class="rocksite-m-info__icon">
<span class="rocksite-a-icon -large"><i class="la la-hand-pointer-o"></i></span>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s5">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Latest News</h2>
<p class="rocksite-o-section-header__subtitle">Maecenas efficitur libero a augue maximus</p>
</header>
<div class="row">
<div class="col-sm-3">
<div class="rocksite-m-card ">
<div class="rocksite-m-card__content">
<h5 class="rocksite-m-card__content__title"><a href="#">Duis vitae lobortis odio, sed convallis lacus</a></h5>
<div class="rocksite-m-card__content__meta">
<span class="rocksite-m-meta-label"><i class="la la-calendar"></i> <a href="#"
rel="bookmark">
<time class="entry-date published updated" datetime="2015-08-23T21:33:31+00:00">August 21</time>
</a></span> <span class="rocksite-m-meta-label">Published by: <a
href="#" title="Posts by admin" rel="author">admin</a> </span>
</div>
<div class="rocksite-m-card__content__button">
<a href="#" class="rocksite-a-button-icon "><i class="la la-arrow-right"></i> <span>214 K</span>
</a>
</div>
</div>
<div class="rocksite-m-card__thumbnail">
<a href="#" class="rocksite-m-card__thumbnail__link"><img src="../assets/images/pages/news1.jpg" alt="Image"></a>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-card ">
<div class="rocksite-m-card__content">
<h5 class="rocksite-m-card__content__title"><a href="#">Duis vitae lobortis odio, sed convallis lacus</a></h5>
<div class="rocksite-m-card__content__meta">
<span class="rocksite-m-meta-label"><i class="la la-calendar"></i> <a href="#"
rel="bookmark">
<time class="entry-date published updated" datetime="2015-08-23T21:33:31+00:00">August 21</time>
</a></span> <span class="rocksite-m-meta-label">Published by: <a
href="#" title="Posts by admin" rel="author">admin</a> </span>
</div>
<div class="rocksite-m-card__content__button">
<a href="#" class="rocksite-a-button-icon "><i class="la la-arrow-right"></i> <span>214 K</span>
</a>
</div>
</div>
<div class="rocksite-m-card__thumbnail">
<a href="#" class="rocksite-m-card__thumbnail__link"><img src="../assets/images/pages/news2.jpg" alt="Image"></a>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-card ">
<div class="rocksite-m-card__content">
<h5 class="rocksite-m-card__content__title"><a href="#">Duis vitae lobortis odio, sed convallis lacus</a></h5>
<div class="rocksite-m-card__content__meta">
<span class="rocksite-m-meta-label"><i class="la la-calendar"></i> <a href="#"
rel="bookmark">
<time class="entry-date published updated" datetime="2015-08-23T21:33:31+00:00">August 21</time>
</a></span> <span class="rocksite-m-meta-label">Published by: <a
href="#" title="Posts by admin" rel="author">admin</a> </span>
</div>
<div class="rocksite-m-card__content__button">
<a href="#" class="rocksite-a-button-icon "><i class="la la-arrow-right"></i> <span>214 K</span>
</a>
</div>
</div>
<div class="rocksite-m-card__thumbnail">
<a href="#" class="rocksite-m-card__thumbnail__link"><img src="../assets/images/pages/news3.jpg" alt="Image"></a>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-card ">
<div class="rocksite-m-card__content">
<h5 class="rocksite-m-card__content__title"><a href="#">Duis vitae lobortis odio, sed convallis lacus</a></h5>
<div class="rocksite-m-card__content__meta">
<span class="rocksite-m-meta-label"><i class="la la-calendar"></i> <a href="#"
rel="bookmark">
<time class="entry-date published updated" datetime="2015-08-23T21:33:31+00:00">August 21</time>
</a></span> <span class="rocksite-m-meta-label">Published by: <a
href="#" title="Posts by admin" rel="author">admin</a> </span>
</div>
<div class="rocksite-m-card__content__button">
<a href="#" class="rocksite-a-button-icon "><i class="la la-arrow-right"></i> <span>214 K</span>
</a>
</div>
</div>
<div class="rocksite-m-card__thumbnail">
<a href="#" class="rocksite-m-card__thumbnail__link"><img src="../assets/images/pages/news4.jpg" alt="Image"></a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s6">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Counter Box</h2>
<p class="rocksite-o-section-header__subtitle">This flexibility gives you the ultimate freedom</p>
</header>
<div class="row">
<div class="col-sm-3">
<div class="rocksite-m-counter-box">
<div class="rocksite-m-counter-box__content">
<span class="rocksite-m-counter-box__content__counter">1123</span>
<p class="rocksite-m-counter-box__content__prefix">Awards & Certyfications</p>
<p class="rocksite-m-counter-box__content__sufix">Changing the options for each once added</p>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-counter-box">
<div class="rocksite-m-counter-box__content">
<span class="rocksite-m-counter-box__content__counter">100</span>
<p class="rocksite-m-counter-box__content__prefix">Different Layouts</p>
<p class="rocksite-m-counter-box__content__sufix">Different theme and content layouts for different app</p>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-counter-box">
<div class="rocksite-m-counter-box__content">
<span class="rocksite-m-counter-box__content__counter">520</span>
<p class="rocksite-m-counter-box__content__prefix">PSDs Included</p>
<p class="rocksite-m-counter-box__content__sufix">Layered and organized</p>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-counter-box">
<div class="rocksite-m-counter-box__content">
<span class="rocksite-m-counter-box__content__counter">30</span>
<p class="rocksite-m-counter-box__content__prefix">Color Management Sections</p>
<p class="rocksite-m-counter-box__content__sufix">Compatible color templates and advanced color management</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s7">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Our Team</h2>
<p class="rocksite-o-section-header__subtitle">Nunc sollicitudin vulputate mattis</p>
</header>
<div class="row">
<div class="col-sm-3">
<div class="rocksite-m-team ">
<div class="rocksite-m-team__image">
<img src="../assets/images/person-men.jpg" class="img-responsive" alt="">
</div>
<div class="rocksite-m-team__item">
<h4 class="rocksite-m-team__item__title">Jonathan Test</h4>
<p class="rocksite-m-team__item__subtitle">Author</p>
<p class="rocksite-m-team__item__content">Wnde omnis iste natus error sit voluptatem accusantium doloremque laudantium</p>
</div>
<ul class="rocksite-m-team__shares rocksite-m-nav-menu -horizontal -icons">
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -email">
<i class="fa fa-envelope"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -twitter">
<i class="fab fa-twitter"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -facebook">
<i class="fab fa-facebook-f"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -gplus">
<i class="fab fa-google-plus-g"></i>
</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-team ">
<div class="rocksite-m-team__image">
<img src="../assets/images/person-men.jpg" class="img-responsive" alt="">
</div>
<div class="rocksite-m-team__item">
<h4 class="rocksite-m-team__item__title">Jonathan Test</h4>
<p class="rocksite-m-team__item__subtitle">Author</p>
<p class="rocksite-m-team__item__content">Wnde omnis iste natus error sit voluptatem accusantium doloremque laudantium</p>
</div>
<ul class="rocksite-m-team__shares rocksite-m-nav-menu -horizontal -icons">
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -email">
<i class="fa fa-envelope"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -twitter">
<i class="fab fa-twitter"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -facebook">
<i class="fab fa-facebook-f"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -gplus">
<i class="fab fa-google-plus-g"></i>
</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-team ">
<div class="rocksite-m-team__image">
<img src="../assets/images/person-men.jpg" class="img-responsive" alt="">
</div>
<div class="rocksite-m-team__item">
<h4 class="rocksite-m-team__item__title">Jonathan Test</h4>
<p class="rocksite-m-team__item__subtitle">Author</p>
<p class="rocksite-m-team__item__content">Wnde omnis iste natus error sit voluptatem accusantium doloremque laudantium</p>
</div>
<ul class="rocksite-m-team__shares rocksite-m-nav-menu -horizontal -icons">
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -email">
<i class="fa fa-envelope"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -twitter">
<i class="fab fa-twitter"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -facebook">
<i class="fab fa-facebook-f"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -gplus">
<i class="fab fa-google-plus-g"></i>
</a>
</li>
</ul>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-team ">
<div class="rocksite-m-team__image">
<img src="../assets/images/person-men.jpg" class="img-responsive" alt="">
</div>
<div class="rocksite-m-team__item">
<h4 class="rocksite-m-team__item__title">Jonathan Test</h4>
<p class="rocksite-m-team__item__subtitle">Author</p>
<p class="rocksite-m-team__item__content">Wnde omnis iste natus error sit voluptatem accusantium doloremque laudantium</p>
</div>
<ul class="rocksite-m-team__shares rocksite-m-nav-menu -horizontal -icons">
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -email">
<i class="fa fa-envelope"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -twitter">
<i class="fab fa-twitter"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -facebook">
<i class="fab fa-facebook-f"></i>
</a>
</li>
<li class="rocksite-m-nav-menu__item"><a href="#" class="rocksite-a-button-social -gplus">
<i class="fab fa-google-plus-g"></i>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s8">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Slider Sections</h2>
<p class="rocksite-o-section-header__subtitle">Different theme and content layouts for different app</p>
</header>
<div class="rocksite-o-slider-box">
<div class="rocksite-o-slider-box__list js-slider">
<div class="rocksite-o-slider-box__list__item">
<div class="rocksite-m-content-banner -large-banner">
<div class="rocksite-m-content-banner__image">
<img src="../assets/images/pages/slider1.jpg" alt="Test Image"/>
</div>
<div class="rocksite-m-content-banner__wrapper">
<div class="rocksite-m-content-banner__wrapper__item">
<h5 class="rocksite-m-content-banner__wrapper__item__title"><a href="#">Duis vitae lobortis odio, sed convallis lacus</a></h5>
<div class="rocksite-m-content-banner__wrapper__item__content">
<p>Sed euismod blandit leo. Mauris malesuada mi id mi lacinia scelerisque. Vivamus nec nibh nec sem sagittis mollis et luctus neque. Morbi eget ligula euismod, auctor dui at, suscipit est. In a tristique leo, eu tristique augue. Quisque et placerat velit.</p>
</div>
</div>
</div>
</div>
</div>
<div class="rocksite-o-slider-box__list__item">
<div class="rocksite-m-content-banner -right-side-text">
<div class="rocksite-m-content-banner__image">
<img src="../assets/images/pages/slider2.jpg" alt="Test Image"/>
</div>
<div class="rocksite-m-content-banner__wrapper">
<div class="rocksite-m-content-banner__wrapper__item">
<h5 class="rocksite-m-content-banner__wrapper__item__title"><a href="#">Vivamus nec nibh nec sem sagittis mollis et luctus neque.</a></h5>
<div class="rocksite-m-content-banner__wrapper__item__content">
<p>Sed euismod blandit leo. Mauris malesuada mi id mi lacinia scelerisque. Vivamus nec nibh nec sem sagittis mollis et luctus neque. Morbi eget ligula euismod, auctor dui at, suscipit est. In a tristique leo, eu tristique augue. Quisque et placerat velit.</p>
</div>
</div>
</div>
</div>
</div>
<div class="rocksite-o-slider-box__list__item">
<div class="rocksite-m-content-banner -large-banner">
<div class="rocksite-m-content-banner__image">
<img src="../assets/images/pages/slider3.jpg" alt="Test Image"/>
</div>
<div class="rocksite-m-content-banner__wrapper">
<div class="rocksite-m-content-banner__wrapper__item">
<h5 class="rocksite-m-content-banner__wrapper__item__title"><a href="#">Vivamus nec nibh nec sem sagittis mollis et luctus neque.</a></h5>
<div class="rocksite-m-content-banner__wrapper__item__content">
<p>Sed euismod blandit leo. Mauris malesuada mi id mi lacinia scelerisque. Vivamus nec nibh nec sem sagittis mollis et luctus neque. Morbi eget ligula euismod, auctor dui at, suscipit est. In a tristique leo, eu tristique augue. Quisque et placerat velit.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s9">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Articles List</h2>
<p class="rocksite-o-section-header__subtitle"> Maecenas vulputate tortor sit amet egestas rhoncus</p>
</header>
<article class="rocksite-o-content -article-short-vertical">
<header class="rocksite-o-content__header">
<h3 class="rocksite-o-content__header__title">
<a href=""
title="Permalink Aliquam varius turpis vel scelerisque molestie Donec ac libero tellus."
rel="bookmark">Aliquam varius turpis vel scelerisque molestie Donec ac libero tellus.</a>
</h3>
</header>
<div class="rocksite-o-content__thumbnail">
<div class="rocksite-m-thumbnail">
<img width="1000" height="520" src="../assets/images/large-thumbnail.jpeg" alt="">
</div>
</div>
<div class="rocksite-o-content__entry entry-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec commodo arcu eu ultrices pellentesque. Aliquam ultricies elit tempor molestie rutrum. Maecenas pharetra sem eu accumsan dignissim. Duis vel purus commodo, semper elit vel, porttitor sem.</p>
<div class="rocksite-o-content__entry__more">
<a href="#" class="rocksite-a-button -article-short-vertical">
Continue reading
<i class="la la-arrow-right"></i>
</a>
</div>
</div>
</article>
<article class="rocksite-o-content -article-short-vertical">
<header class="rocksite-o-content__header">
<h3 class="rocksite-o-content__header__title">
<a href=""
title="Permalink Nunc sit amet ipsum vestibulum, posuere felis id, vulputate erat."
rel="bookmark">Nunc sit amet ipsum vestibulum, posuere felis id, vulputate erat.</a>
</h3>
</header>
<div class="rocksite-o-content__thumbnail">
<div class="rocksite-m-thumbnail">
<img width="1000" height="520" src="../assets/images/large-thumbnail.jpeg" alt="">
</div>
</div>
<div class="rocksite-o-content__entry entry-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec commodo arcu eu ultrices pellentesque. Aliquam ultricies elit tempor molestie rutrum. Maecenas pharetra sem eu accumsan dignissim. Duis vel purus commodo, semper elit vel, porttitor sem.</p>
<div class="rocksite-o-content__entry__more">
<a href="#" class="rocksite-a-button -article-short-vertical">
Continue reading
<i class="la la-arrow-right"></i>
</a>
</div>
</div>
</article>
<article class="rocksite-o-content -article-short-vertical">
<header class="rocksite-o-content__header">
<h3 class="rocksite-o-content__header__title">
<a href=""
title="Permalink Consectetur adipiscing elit donec commodo arcu"
rel="bookmark">Consectetur adipiscing elit donec commodo arcu</a>
</h3>
</header>
<div class="rocksite-o-content__thumbnail">
<div class="rocksite-m-thumbnail">
<img width="1000" height="520" src="../assets/images/large-thumbnail.jpeg" alt="">
</div>
</div>
<div class="rocksite-o-content__entry entry-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec commodo arcu eu ultrices pellentesque. Aliquam ultricies elit tempor molestie rutrum. Maecenas pharetra sem eu accumsan dignissim. Duis vel purus commodo, semper elit vel, porttitor sem.</p>
<div class="rocksite-o-content__entry__more">
<a href="#" class="rocksite-a-button -article-short-vertical">
Continue reading
<i class="la la-arrow-right"></i>
</a>
</div>
</div>
</article>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s10">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Testimonials List</h2>
<p class="rocksite-o-section-header__subtitle">Tortor sit amet egestas rhoncus</p>
</header>
<div class="row">
<div class="col-sm-3">
<div class="rocksite-m-testimonial ">
<div class="rocksite-m-testimonial__content">
<p>After trying a few other themes (where half of the promised features werent working), I have found the perfect theme for my portfolio website.</p>
</div>
<footer class="rocksite-m-testimonial__footer">
<div class="rocksite-m-testimonial__footer__image">
<img src="../assets/images/pages/testimonials/person1.jpg" />
</div>
<div class="rocksite-m-testimonial__footer__content">
<h5 class="rocksite-m-testimonial__footer__content__title">
Ann Profeska</h5>
<span class="rocksite-m-testimonial__footer__content__subtitle">CEO Brand</span>
</div>
</footer>
</div> </div>
<div class="col-sm-3">
<div class="rocksite-m-testimonial ">
<div class="rocksite-m-testimonial__content">
<p>After trying a few other themes (where half of the promised features werent working)</p>
</div>
<footer class="rocksite-m-testimonial__footer">
<div class="rocksite-m-testimonial__footer__image">
<img src="../assets/images/pages/testimonials/person2.jpg" />
</div>
<div class="rocksite-m-testimonial__footer__content">
<h5 class="rocksite-m-testimonial__footer__content__title">
Ann Profeska</h5>
<span class="rocksite-m-testimonial__footer__content__subtitle">Author</span>
</div>
</footer>
</div> </div>
<div class="col-sm-3">
<div class="rocksite-m-testimonial ">
<div class="rocksite-m-testimonial__content">
<p>Lorem Ipsum Content I have found</p>
</div>
<footer class="rocksite-m-testimonial__footer">
<div class="rocksite-m-testimonial__footer__image">
<img src="../assets/images/pages/testimonials/person3.jpg" />
</div>
<div class="rocksite-m-testimonial__footer__content">
<h5 class="rocksite-m-testimonial__footer__content__title">
Cyndi Wallace</h5>
<span class="rocksite-m-testimonial__footer__content__subtitle">Author</span>
</div>
</footer>
</div> </div>
<div class="col-sm-3">
<div class="rocksite-m-testimonial ">
<div class="rocksite-m-testimonial__content">
<p>After trying a few other themes (where half of the promised features werent working), I have found the perfect theme for my portfolio website.</p>
</div>
<footer class="rocksite-m-testimonial__footer">
<div class="rocksite-m-testimonial__footer__image">
<img src="../assets/images/pages/testimonials/person4.jpg" />
</div>
<div class="rocksite-m-testimonial__footer__content">
<h5 class="rocksite-m-testimonial__footer__content__title">
Peter Smooth</h5>
<span class="rocksite-m-testimonial__footer__content__subtitle">Webdeveloper</span>
</div>
</footer>
</div> </div>
</div>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s11">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Pricing boxes</h2>
<p class="rocksite-o-section-header__subtitle">I have found the perfect</p>
</header>
<div class="row">
<div class="col-sm-3">
<div class="rocksite-m-pricing-box ">
<h4 class="rocksite-m-pricing-box__title">
Regular Version
</h4>
<div class="rocksite-m-pricing-box__price">
<span class="rocksite-m-pricing-box__price__currency">$</span><span class="rocksite-m-pricing-box__price__amount">120</span>
<span class="rocksite-m-pricing-box__price__period"> / monthly</span>
</div>
<ul class="rocksite-m-pricing-box__features">
<li>Up to 20 users</li>
<li>50GB</li>
<li>Statistics and tracking</li>
</ul>
<div class="rocksite-m-pricing-box__footer">
<a href="#" class="rocksite-a-button -primary">
Click me
</a>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-pricing-box ">
<h4 class="rocksite-m-pricing-box__title">
Regular Version
</h4>
<div class="rocksite-m-pricing-box__price">
<span class="rocksite-m-pricing-box__price__currency">$</span><span class="rocksite-m-pricing-box__price__amount">120</span>
<span class="rocksite-m-pricing-box__price__period"> / monthly</span>
</div>
<ul class="rocksite-m-pricing-box__features">
<li>Up to 20 users</li>
<li>50GB</li>
<li>Statistics and tracking</li>
</ul>
<div class="rocksite-m-pricing-box__footer">
<a href="#" class="rocksite-a-button -primary">
Click me
</a>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-pricing-box ">
<h4 class="rocksite-m-pricing-box__title">
Regular Version
</h4>
<div class="rocksite-m-pricing-box__price">
<span class="rocksite-m-pricing-box__price__currency">$</span><span class="rocksite-m-pricing-box__price__amount">120</span>
<span class="rocksite-m-pricing-box__price__period"> / monthly</span>
</div>
<ul class="rocksite-m-pricing-box__features">
<li>Up to 20 users</li>
<li>50GB</li>
<li>Statistics and tracking</li>
</ul>
<div class="rocksite-m-pricing-box__footer">
<a href="#" class="rocksite-a-button -primary">
Click me
</a>
</div>
</div>
</div>
<div class="col-sm-3">
<div class="rocksite-m-pricing-box ">
<h4 class="rocksite-m-pricing-box__title">
Regular Version
</h4>
<div class="rocksite-m-pricing-box__price">
<span class="rocksite-m-pricing-box__price__currency">$</span><span class="rocksite-m-pricing-box__price__amount">120</span>
<span class="rocksite-m-pricing-box__price__period"> / monthly</span>
</div>
<ul class="rocksite-m-pricing-box__features">
<li>Up to 20 users</li>
<li>50GB</li>
<li>Statistics and tracking</li>
</ul>
<div class="rocksite-m-pricing-box__footer">
<a href="#" class="rocksite-a-button -primary">
Click me
</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="rocksite-s-default rocksite-p-main-page-1-s12">
<div class="container">
<header class="rocksite-o-section-header u-align-center">
<h2 class="rocksite-o-section-header__title">Contact Form Section</h2>
<p class="rocksite-o-section-header__subtitle">I have found the perfect</p>
</header>
<div class="row">
<div class="col-sm-6">
<form action="/wordpress4.8/forms/#wpcf7-f1885-p1886-o1" method="post" class="rocksite-o-form wpcf7-form">
<div class="rocksite-o-form__line">
<div class="rocksite-m-label-input ">
<label for="input_text" class="rocksite-m-label-input__label">Your Name</label>
<input type="text" value="" id="input_text" name="your-name" placeholder="" class="rocksite-a-input rocksite-m-label-input__input">
</div>
</div>
<div class="rocksite-o-form__line">
<div class="rocksite-m-label-input ">
<label for="input_surname" class="rocksite-m-label-input__label">Your Surname</label>
<input type="text" value="" id="input_surname" name="your-surnname" placeholder="" class="rocksite-a-input rocksite-m-label-input__input">
</div>
</div>
<div class="rocksite-o-form__line">
<div class="rocksite-m-label-input ">
<label for="input_email" class="rocksite-m-label-input__label">Your E-mail</label>
<input type="email" value="" id="input_email" name="your-surnname" placeholder="" class="rocksite-a-input rocksite-m-label-input__input">
</div>
</div>
<div class="rocksite-o-form__line">
<div class="rocksite-m-label-textarea ">
<label for="input_text" class="rocksite-m-label-textarea__label">Your Message</label>
<textarea class="rocksite-a-textarea rocksite-m-label-textarea__textarea" id="input_text" name="your-message" rows="" placeholder="" aria-invalid="false"></textarea>
</div>
</div>
<div class="rocksite-o-form__btn-line -btn-right">
<button class="rocksite-a-input-button " type="submit">Send Message</button>
</div>
</form>
</div>
</div>
</div>
</section>
<section class="rocksite-s-footer rocksite-p-main-page-1-footer-1">
<div class="container">
<div class="row">
<div class="col-lg-3">
<div id="nav_menu-1" class="rocksite-o-widget -widget_nav_menu -dark -footer">
<header class="rocksite-o-widget__header"><h3 class="rocksite-o-widget__header__title">First Column</h3></header>
<div class="menu-menu-sidebar-page-container">
<ul class="rocksite-m-nav-menu -dark -footer">
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Home Page</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">About Us</a>
</li>
<li class="rocksite-m-nav-menu__item -has-children "><a
href="#" class="rocksite-m-nav-menu__link">Services</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Our Offer</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Contact Us</a>
</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-3">
<div id="nav_menu-1" class="rocksite-o-widget -widget_nav_menu -dark -footer">
<header class="rocksite-o-widget__header"><h3 class="rocksite-o-widget__header__title">Second Column</h3></header>
<div class="menu-menu-sidebar-page-container">
<ul class="rocksite-m-nav-menu -dark -footer">
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Contact Me</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">About Me</a>
</li>
<li class="rocksite-m-nav-menu__item -has-children "><a
href="#" class="rocksite-m-nav-menu__link">Services</a>
</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-3">
<div id="nav_menu-1" class="rocksite-o-widget -widget_nav_menu -dark -footer">
<header class="rocksite-o-widget__header"><h3 class="rocksite-o-widget__header__title">Third Column</h3></header>
<div class="menu-menu-sidebar-page-container">
<ul class="rocksite-m-nav-menu -dark -footer">
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Pages</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Categories</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Depth</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Advanced</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Menu Description</a>
</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-3">
<div id="nav_menu-1" class="rocksite-o-widget -widget_nav_menu -dark -footer">
<header class="rocksite-o-widget__header"><h3 class="rocksite-o-widget__header__title">Fourth Column</h3></header>
<div class="menu-menu-sidebar-page-container">
<ul class="rocksite-m-nav-menu -dark -footer">
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Contact Me</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">About Me</a>
</li>
<li class="rocksite-m-nav-menu__item "><a
href="#" class="rocksite-m-nav-menu__link">Home</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
</body>
../source/scss/components/pages/_main-page-1.scss
, line 1