<!DOCTYPE html>
<html lang="en">
<!-- Mirrored from brick.qtcmedia.com/html/index-6.html by HTTrack Website Copier/3.x [XR&CO'2014], Thu, 07 Mar 2019 04:14:13 GMT -->
<head>
<meta charset="UTF-8">
<title>The Birck Architechture & Construction - HTML Template</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1" name="viewport" />
<meta content="" name="description" />
<meta content="" name="author" />
<!-- BEGIN GLOBAL MANDATORY STYLES -->
<link href="plugins/normalize.css" rel="stylesheet" type="text/css">
<link href="plugins/uikit-2.27.2/css/uikit.min.css" rel="stylesheet" type="text/css">
<link href="plugins/font-awesome-4.7/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="plugins/flat-icon/flaticon.css" rel="stylesheet" type="text/css">
<link href="plugins/slick-master/slick/slick.css" rel="stylesheet" type="text/css">
<!-- END GLOBAL MANDATORY STYLES -->
<!-- BEGIN PAGE COMPONENTS UIKIT -->
<link href="plugins/uikit-2.27.2/css/components/sticky.min.css" rel="stylesheet" type="text/css">
<link href="plugins/uikit-2.27.2/css/components/slider.min.css" rel="stylesheet" type="text/css">
<!-- END PAGE COMPONENTS UIKIT -->
<!-- BEGIN REVOLUTION SLIDER -->
<link rel="stylesheet" href="plugins/revolution/css/settings.css">
<link rel="stylesheet" href="plugins/revolution/css/layers.css">
<link rel="stylesheet" href="plugins/revolution/css/navigation.css">
<!-- END REVOLUTION SLIDER -->
<!-- BEGIN TEMPLATE LAYOUT STYLES -->
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsive.css">
<!-- END TEMPLATE LAYOUT STYLES -->
<link rel="shortcut icon" href="images/favicon.ico" />
</head>
<body>
<!-- BEGIN HEADER -->
<header class="header-v5" data-uk-sticky="{top: -500, animation: 'uk-animation-slide-top'}">
<div id="justify_mega" class="header">
<div class="top-bar">
<div class="uk-container uk-container-center uk-clearfix">
<div class="social">
<ul>
<li class="brick-hover-child-color-darkgreen"><a href="#"><span class="fa fa-facebook"></span></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="#"><span class="fa fa-vimeo"></span></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="#"><span class="fa fa-twitter"></span></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="#"><span class="fa fa-instagram"></span></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="#"><span class="fa fa-google"></span></a></li>
</ul>
</div>
<div class="contact-info">
<ul>
<li class="brick-hover-full-color-darkgree">
<a href="info%40qtcmedia.html"><p><span class="fa fa-envelope"></span>[email protected]</p></a>
</li>
<li class="brick-hover-full-color-darkgree">
<p class="brick-hover-color-darkgreen"><span class="fa fa-phone"></span>(+1) 000 444 999</p>
</li>
</ul>
</div>
</div>
</div>
<div class="uk-container uk-container-center">
<div class="logo brick-flex-box">
<a href="index.html"><img src="images/header/logo-drankgreen.png" alt=""></a>
</div>
<div class="search" data-uk-dropdown="{mode:'click', pos:'bottom-right'}">
<a href="shop.html" class="cart-icon brick-hover-color-darkgreen"><span class="fa fa-shopping-cart"></span></a>
<a href="#" class="search-icon brick-hover-color-darkgreen"><span class="fa fa-search"></span></a>
<div class="uk-dropdown">
<form id="search_form_one" class="uk-form" action="#" method="post">
<input type="text" placeholder="Search...">
</form>
</div>
<div class="toggle-icon">
<a href="#" class="brick-hover-color-darkgreen"><span class="fa fa-bars"></span></a>
</div>
</div>
<nav class="menu-primary uk-clearfix">
<ul class="uk-navbar-nav uk-flex uk-flex-center main-menu">
<li class="active uk-parent brick-hover-child-color-darkgreen" data-uk-dropdown="{remaintime:'0'}">
<a href="index.html">HOME</a>
<div class="uk-dropdown uk-dropdown-navbar uk-dropdown-bottom">
<ul class="uk-nav uk-nav-navbar">
<li class="brick-hover-child-color-darkgreen"><a href="index-2.html">HOME TWO<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="index-3.html">HOME THREE<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="index-4.html">HOME FOUR<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="index-5.html">HOME FIVE<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="index-6.html">HOME SIX<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</li>
<li class="uk-parent brick-hover-child-color-darkgreen" data-uk-dropdown="{remaintime:'0'}">
<a href="portfolio-1.html">PORTFOLIO</a>
<div class="uk-dropdown uk-dropdown-navbar uk-dropdown-bottom">
<ul class="uk-nav uk-nav-navbar">
<li class="brick-hover-child-color-darkgreen"><a href="portfolio-2.html">PORTFOLIO TWO<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="portfolio-detail.html">PORTFOLIO DETAIL<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</li>
<li class="brick-hover-child-color-darkgreen"><a href="contact.html">CONTACT</a></li>
<li class="uk-parent brick-hover-child-color-darkgreen" data-uk-dropdown="{remaintime:'0'}">
<a href="blog-1.html">BLOG</a>
<div class="uk-dropdown uk-dropdown-navbar uk-dropdown-bottom">
<ul class="uk-nav uk-nav-navbar">
<li class="brick-hover-child-color-darkgreen"><a href="blog-2.html">BLOG TWO<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="blog-3.html">BLOG THREE<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="blog-detail.html">BLOG DETAILS<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</li>
<li class="uk-parent brick-hover-child-color-darkgreen" data-uk-dropdown="{remaintime:'0'}">
<a href="shop.html">SHOP</a>
<div class="uk-dropdown uk-dropdown-navbar uk-dropdown-bottom">
<ul class="uk-nav uk-nav-navbar">
<li class="brick-hover-child-color-darkgreen"><a href="product-detail.html">PRODUCT DETAIL<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</li>
<li class="uk-parent brick-hover-child-color-darkgreen" data-uk-dropdown="{remaintime:'0'}">
<a>PAGES</a>
<div class="uk-dropdown uk-dropdown-navbar uk-dropdown-bottom">
<ul class="uk-nav uk-nav-navbar">
<li class="brick-hover-child-color-darkgreen"><a href="about.html">ABOUT US<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="our-team.html">OUR TEAM<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="clients-say.html">CLIENTS SAY<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="faq.html">FAQ's<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="coming-soon.html">COMING SOON<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="maintenance.html">MAINTENANCE PAGE<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</li>
<li class="mega-menu uk-parent brick-hover-child-color-darkgreen" data-uk-dropdown="{remaintime:'0', justify:'#justify_mega'}">
<a href="#">MEGA</a>
<div class="uk-dropdown">
<div class="uk-container uk-container-center">
<div class="uk-grid">
<div class="uk-width-medium-1-4 uk-width-small-1-1 uk-width-1-1">
<div class="submenu">
<div class="submenu-title">
<h5>SUB MENU 01</h5>
</div>
<ul>
<li class="brick-hover-child-color-darkgreen"><a href="#">Sub menu 01-01<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="#">Sub menu 01-02<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</div>
<div class="uk-width-medium-1-4 uk-width-small-1-1 uk-width-1-1">
<div class="submenu">
<div class="submenu-title">
<h5>SUB MENU 02</h5>
<div class="omb-line omb-line-orange"></div>
</div>
<ul>
<li class="brick-hover-child-color-darkgreen"><a href="#">Sub menu 02-01<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="#">Sub menu 02-02<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</div>
<div class="uk-width-medium-1-4 uk-width-small-1-1 uk-width-1-1">
<div class="submenu">
<div class="submenu-title">
<h5>SUB MENU 03</h5>
<div class="omb-line omb-line-orange"></div>
</div>
<ul>
<li class="brick-hover-child-color-darkgreen"><a href="#">Sub menu 03-01<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="#">Sub menu 03-02<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</div>
<div class="uk-width-medium-1-4 uk-width-small-1-1 uk-width-1-1">
<div class="submenu">
<div class="submenu-title">
<h5>SUB MENU 04</h5>
<div class="omb-line omb-line-orange"></div>
</div>
<ul>
<li class="brick-hover-child-color-darkgreen"><a href="#">Sub menu 04-01<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
<li class="brick-hover-child-color-darkgreen"><a href="#">Sub menu 04-02<i class="fa fa-hand-o-right brick-color-darkgreen"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</nav>
</div>
</div>
<div class="mobile-menu">
<nav class="nav-holder">
<ul>
<li class="has-submenu brick-hover-child-color-darkgreen">
<a href="index.html">HOME</a>
<ul class="submenu">
<li class="brick-hover-child-color-darkgreen"><a href="index-2.html">Home two</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="index-3.html">Home three</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="index-4.html">Home four</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="index-5.html">Home five</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="index-6.html">Home six</a></li>
</ul>
</li>
<li class="has-submenu brick-hover-child-color-darkgreen">
<a href="portfolio-1.html">PORTFOLIO</a>
<ul class="submenu">
<li class="brick-hover-child-color-darkgreen"><a href="portfolio-2.html">Portfolio two</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="portfolio-detail.html">Portfolio detail </a></li>
</ul>
</li>
<li class="brick-hover-child-color-darkgreen"><a href="contact.html">CONTACT</a></li>
<li class="has-submenu brick-hover-child-color-darkgreen">
<a href="blog-1.html">BLOG</a>
<ul class="submenu">
<li class="brick-hover-child-color-darkgreen"><a href="blog-2.html">Blog two</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="blog-3.html">Blog three</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="blog-detail.html">Blog detail</a></li>
</ul>
</li>
<li class="has-submenu brick-hover-child-color-darkgreen">
<a href="shop.html">SHOP</a>
<ul class="submenu">
<li class="brick-hover-child-color-darkgreen"><a href="product-detail.html">Product detail</a></li>
</ul>
</li>
<li class="has-submenu brick-hover-child-color-darkgreen">
<a>PAGES</a>
<ul class="submenu">
<li class="brick-hover-child-color-darkgreen"><a href="about.html">About us</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="our-team.html">Our team</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="clients-say.html">Clients say</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="faq.html">FAQ's</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="coming-soon.html">Coming soon</a></li>
<li class="brick-hover-child-color-darkgreen"><a href="maintenance.html">Maintenance page</a></li>
</ul>
</li>
</ul>
</nav>
</div>
</header>
<!-- END HEADER -->
<!-- BEGIN CONTAINER -->
<!-- BEGIN SLIDER -->
<section class="rev_slider_wrapper slider-home-six">
<div id="slider_home_six" class="rev_slider" data-version="5.0">
<ul>
<li data-transition="zoomout" data-slotamount="default" data-easein="Power4.easeInOut" data-easeout="Power4.easeInOut" data-masterspeed="2000" data-rotate="0" data-fstransition="fade" data-fsmasterspeed="1500" data-fsslotamount="7" data-saveperformance="off" >
<img src="images/slider/06.jpg" alt="" data-bgposition="center center" data-bgfit="cover" data-bgrepeat="no-repeat" data-bgparallax="10" class="rev-slidebg" data-no-retina/>
<div class="tp-caption tp-resizeme banner-caption-h1"
data-x="center"
data-hoffset="0"
data-y="center"
data-voffset="['-97','-97','-97','-97']"
data-transform_idle="o:1;"
data-transform_in="x:[-175%];y:0px;z:0;rX:0;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;opacity:0.01;s:3000;e:Power3.easeOut;"
data-transform_out="s:1000;e:Power3.easeInOut;s:1000;e:Power3.easeInOut;"
data-mask_in="x:[100%];y:0;s:inherit;e:inherit;"
data-splitin="none"
data-splitout="none"
data-responsive_offset="on"
data-start="700">
EVEN A <strong>BRICK</strong>
</div>
<div class="tp-caption tp-resizeme banner-caption-p"
data-x="center"
data-hoffset="0"
data-y="center"
data-voffset="['-18','-18','-18','-18']"
data-transform_idle="o:1;"
data-transform_in="x:[-175%];y:0px;z:0;rX:0;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;opacity:0.01;s:3000;e:Power3.easeOut;"
data-transform_out="s:1000;e:Power3.easeInOut;s:1000;e:Power3.easeInOut;"
data-mask_in="x:[100%];y:0;s:inherit;e:inherit;"
data-splitin="none"
data-splitout="none"
data-responsive_offset="on"
data-start="700">
wants to be something
</div>
<div class="tp-caption tp-resizeme banner-caption-button"
data-x="center"
data-hoffset="-105"
data-y="center"
data-voffset="['104','104','104','104']"
data-transform_idle="o:1;"
data-transform_in="x:[-175%];y:0px;z:0;rX:0;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;opacity:0.01;s:3000;e:Power3.easeOut;"
data-transform_out="s:1000;e:Power3.easeInOut;s:1000;e:Power3.easeInOut;"
data-mask_in="x:[100%];y:0;s:inherit;e:inherit;"
data-splitin="none"
data-splitout="none"
data-responsive_offset="on"
data-start="700">
<a href="#" class="quote">FREE QUOTE</a>
</div>
<div class="tp-caption tp-resizeme banner-caption-button"
data-x="center"
data-hoffset="105"
data-y="center"
data-voffset="['104','104','104','104']"
data-transform_idle="o:1;"
data-transform_in="x:[-175%];y:0px;z:0;rX:0;rY:0;rZ:0;sX:1;sY:1;skX:0;skY:0;opacity:0.01;s:3000;e:Power3.easeOut;"
data-transform_out="s:1000;e:Power3.easeInOut;s:1000;e:Power3.easeInOut;"
data-mask_in="x:[100%];y:0;s:inherit;e:inherit;"
data-splitin="none"
data-splitout="none"
data-responsive_offset="on"
data-start="700">
<a href="#" class="read-more">READ MORE</a>
</div>
</li>
</ul>
</div>
</section>
<!-- END SLIDER -->
<!-- BEGIN STEP -->
<section class="step brick-background-darkgreen">
<div class="uk-container uk-container-center">
<div class="box-step brick-background-darkgreen">
<div class="uk-grid">
<div class="uk-width-medium-1-3 uk-width-small-1-1 uk-width-1-1">
<div class="brick-flex-box">
<div class="box-number">
<h3>01</h3>
</div>
<div class="box-content">
<h3>CUSTOMERS</h3>
<p>Suspendisse felis sapien, viverra ut dictum vitae, ultricies sit amet mauris. Sed ac metus sit amet ex tempor.</p>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-1 uk-width-1-1">
<div class="brick-flex-box">
<div class="box-number">
<h3>02</h3>
</div>
<div class="box-content">
<h3>DESIGN</h3>
<p>Suspendisse felis sapien, viverra ut dictum vitae, ultricies sit amet mauris. Sed ac metus sit amet ex tempor.</p>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-1 uk-width-1-1">
<div class="brick-flex-box">
<div class="box-number">
<h3>03</h3>
</div>
<div class="box-content">
<h3>CONSTRUCTION</h3>
<p>Suspendisse felis sapien, viverra ut dictum vitae, ultricies sit amet mauris. Sed ac metus sit amet ex tempor.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- END STEP -->
<!-- BEGIN ABOUT THE BRICK -->
<section class="about-the-brick set-padding">
<div class="uk-container uk-container-center">
<div class="title">
<h3>ABOUT THE BRICK</h3>
<p>Phasellus commodo nibh a lacus convallis, ut scelerisque augue convallis. Integer molestie purus vel ligula efficitur pulvinar. Vivamus congue mauris ut sapien iaculis, id malesuada metus rhoncus. Morbi pulvinar mattis ipsum at facilisis. Donec eleifend eros et ante interdum posuere.</p>
</div>
<div class="box">
<div class="box-img">
<img src="images/index-6/about-the-brick.png" alt="">
<div class="box-content top-left">
<a href="#" class="brick-hover-child-color-darkgreen"><h3>BUILDING</h3></a>
<p>Vivamus neque ipsum, auctor sit <br> amet orci eget, sodales posuere eros.</p>
</div>
<div class="box-content top-center">
<a href="#" class="brick-hover-child-color-darkgreen"><h3>CREATIVE</h3></a>
<p>Vivamus neque ipsum, auctor sit <br> amet orci eget, sodales posuere eros.</p>
</div>
<div class="box-content top-right">
<a href="#" class="brick-hover-child-color-darkgreen"><h3>PROFESSIONAL</h3></a>
<p>Vivamus neque ipsum, auctor sit <br> amet orci eget, sodales posuere eros.</p>
</div>
<div class="box-content bottom-left">
<a href="#" class="brick-hover-child-color-darkgreen"><h3>CONSTRUCTION</h3></a>
<p>Vivamus neque ipsum, auctor sit <br> amet orci eget, sodales posuere eros.</p>
</div>
<div class="box-content bottom-right">
<a href="#" class="brick-hover-child-color-darkgreen"><h3>DESIGNER</h3></a>
<p>Vivamus neque ipsum, auctor sit <br> amet orci eget, sodales posuere eros.</p>
</div>
</div>
</div>
</div>
</section>
<!-- END ABOUT THE BRICK -->
<!-- BEGIN OUR SERVICES -->
<section class="our-services-v5 our-services-v2 set-padding">
<div class="uk-container uk-container-center">
<div class="uk-grid">
<div class="uk-width-medium-1-3 uk-width-small-1-2 uk-width-1-1">
<div class="box brick-hover-full-color-darkgree">
<div class="box-icon">
<span class="flaticon flaticon-concrete-mixer"></span>
</div>
<div class="box-content">
<div class="box-content-h3">
<a href="#"><h3>Construction</h3></a>
</div>
<div class="box-content-p">
<p>Praesent ut est dui integer augue eros, dapibus sit amet tincidunt sed, blandit id elit. Mauris leo justo, suscipit id diam vel.</p>
</div>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-2 uk-width-1-1">
<div class="box brick-hover-full-color-darkgree">
<div class="box-icon">
<span class="flaticon flaticon-crane"></span>
</div>
<div class="box-content">
<div class="box-content-h3">
<a href="#"><h3>Building</h3></a>
</div>
<div class="box-content-p">
<p>Praesent ut est dui integer augue eros, dapibus sit amet tincidunt sed, blandit id elit. Mauris leo justo, suscipit id diam vel.</p>
</div>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-2 uk-width-1-1">
<div class="box brick-hover-full-color-darkgree">
<div class="box-icon">
<span class="flaticon flaticon-compass"></span>
</div>
<div class="box-content">
<div class="box-content-h3">
<a href="#"><h3>Architecture</h3></a>
</div>
<div class="box-content-p">
<p>Praesent ut est dui integer augue eros, dapibus sit amet tincidunt sed, blandit id elit. Mauris leo justo, suscipit id diam vel.</p>
</div>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-2 uk-width-1-1">
<div class="box brick-hover-full-color-darkgree">
<div class="box-icon">
<span class="flaticon flaticon-paint-brush"></span>
</div>
<div class="box-content">
<div class="box-content-h3">
<a href="#"><h3>Design</h3></a>
</div>
<div class="box-content-p">
<p>Praesent ut est dui integer augue eros, dapibus sit amet tincidunt sed, blandit id elit. Mauris leo justo, suscipit id diam vel.</p>
</div>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-2 uk-width-1-1">
<div class="box brick-hover-full-color-darkgree">
<div class="box-icon">
<span class="flaticon flaticon-set-square"></span>
</div>
<div class="box-content">
<div class="box-content-h3">
<a href="#"><h3>Rebuild</h3></a>
</div>
<div class="box-content-p">
<p>Praesent ut est dui integer augue eros, dapibus sit amet tincidunt sed, blandit id elit. Mauris leo justo, suscipit id diam vel.</p>
</div>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-2 uk-width-1-1">
<div class="box brick-hover-full-color-darkgree">
<div class="box-icon">
<span class="flaticon flaticon-truck"></span>
</div>
<div class="box-content">
<div class="box-content-h3">
<a href="#"><h3>Transport</h3></a>
</div>
<div class="box-content-p">
<p>Praesent ut est dui integer augue eros, dapibus sit amet tincidunt sed, blandit id elit. Mauris leo justo, suscipit id diam vel.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- END OUR SERVICES -->
<!-- BEGIN OUR SKILLS -->
<section class="our-skills set-padding">
<div class="uk-container uk-container-center">
<div class="uk-grid">
<div class="uk-width-medium-2-4 uk-width-small-1-1 uk-width-1-1">
<div class="box">
<h3>OUR SKILLS</h3>
<strong>Suspendisse ullamcorper aliquet malesuada. Nullam sed nunc vel mauris eleifend condimentum a sit amet ante.</strong>
<p>Donec sed purus elit. Sed quam magna, rhoncus sit amet ultricies vel, maximus non dui. Suspendisse pretium, lorem eget commodo luctus, dolor leo commodo ex, a euismod leo ex nec quam.</p>
<div class="box-skills">
<div class="skill-bar" data-percent="90%">
<h5 class="title">PHOTOSHOP</h5>
<h5 class="count">90%</h5>
<div class="count-bar"></div>
</div>
<div class="skill-bar" data-percent="80%">
<h5 class="title">ILLUSTRATOR</h5>
<h5 class="count">80%</h5>
<div class="count-bar"></div>
</div>
<div class="skill-bar" data-percent="85%">
<h5 class="title">DEVELOPMENT</h5>
<h5 class="count">85%</h5>
<div class="count-bar"></div>
</div>
</div>
</div>
</div>
<div class="uk-width-medium-1-4 uk-width-small-1-2 uk-width-1-1">
<div class="box-img">
<img src="images/index-6/our-skill-1.jpg" alt="">
</div>
</div>
<div class="uk-width-medium-1-4 uk-width-small-1-2 uk-width-1-1">
<div class="box-img">
<img src="images/index-6/our-skill-2.jpg" alt="">
</div>
</div>
</div>
</div>
</section>
<!-- END OUR SKILLS -->
<!-- BEGIN CAROUSEL -->
<section class="carousel brick-background-f8f8f8">
<div class="uk-container uk-container-center">
<div data-uk-slider="{center: true, autoplay: true, autoplayInterval: 4000}">
<div class="uk-slider-container">
<ul class="uk-slider uk-grid uk-grid-match uk-grid-width-medium-1-5 uk-grid-width-small-1-3 uk-grid-width-1-1">
<li>
<div class="box-img">
<img src="images/index-1/carousel-1.png" alt="">
</div>
</li>
<li>
<div class="box-img">
<img src="images/index-1/carousel-2.png" alt="">
</div>
</li>
<li>
<div class="box-img">
<img src="images/index-1/carousel-3.png" alt="">
</div>
</li>
<li>
<div class="box-img">
<img src="images/index-1/carousel-4.png" alt="">
</div>
</li>
<li>
<div class="box-img">
<img src="images/index-1/carousel-1.png" alt="">
</div>
</li>
</ul>
</div>
</div>
</div>
</section>
<!-- END CAROUSEL -->
<!-- BEGIN HAPPY CLIENTS SAY -->
<section class="clients-say-v2 set-padding">
<div class="uk-container uk-container-center">
<div class="brick-title-v4">
<div class="brick-title-h3">
<h3>HAPPY CLIENTS SAY</h3>
</div>
<div class="brick-title-p">
<p>Integer posuere ligula nibh, eu faucibus est accumsan eu. In posuere</p>
</div>
<div class="brick-title-line">
<div class="brick-title-line-color brick-title-line-color-left brick-background-darkgreen"></div>
<div class="brick-title-line-color brick-title-line-color-right brick-background-1b2725"></div>
</div>
</div>
<div class="clients-say-slick-v2">
<ul class="slick-slider slick-clients-say-v2">
<li>
<div class="box">
<div class="box-content">
<p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sodales libero at diam convallis, id rhoncus mauris tristique. Aliquam interdum, quam in ornare convallis, tellus odio porta purus, nec iaculis dolor sem ac lacus."</p>
</div>
<div class="box-img">
<a href="#"><img src="images/index-6/clients-say-1.png" alt=""></a>
</div>
</div>
</li>
<li>
<div class="box">
<div class="box-content">
<p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sodales libero at diam convallis, id rhoncus mauris tristique. Aliquam interdum, quam in ornare convallis, tellus odio porta purus, nec iaculis dolor sem ac lacus."</p>
</div>
<div class="box-img">
<a href="#"><img src="images/index-6/clients-say-2.png" alt=""></a>
</div>
</div>
</li>
<li>
<div class="box">
<div class="box-content">
<p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sodales libero at diam convallis, id rhoncus mauris tristique. Aliquam interdum, quam in ornare convallis, tellus odio porta purus, nec iaculis dolor sem ac lacus."</p>
</div>
<div class="box-img">
<a href="#"><img src="images/index-6/clients-say-3.png" alt=""></a>
</div>
</div>
</li>
<li>
<div class="box">
<div class="box-content">
<p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sodales libero at diam convallis, id rhoncus mauris tristique. Aliquam interdum, quam in ornare convallis, tellus odio porta purus, nec iaculis dolor sem ac lacus."</p>
</div>
<div class="box-img">
<a href="#"><img src="images/index-6/clients-say-2.png" alt=""></a>
</div>
</div>
</li>
<li>
<div class="box">
<div class="box-content">
<p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean sodales libero at diam convallis, id rhoncus mauris tristique. Aliquam interdum, quam in ornare convallis, tellus odio porta purus, nec iaculis dolor sem ac lacus."</p>
</div>
<div class="box-img">
<a href="#"><img src="images/index-6/clients-say-1.png" alt=""></a>
</div>
</div>
</li>
</ul>
</div>
</div>
</section>
<!-- END HAPPY CLIENTS SAY -->
<!-- BEGIN PROJECTS -->
<section class="our-project-v2">
<div data-uk-slider="{autoplay: true, autoplayInterval: 4000}">
<div class="uk-slider-container">
<ul class="uk-slider uk-grid uk-grid-collapse uk-grid-width-medium-1-3 uk-grid-width-small-1-2 uk-grid-width-1-1">
<li>
<div class="box">
<div class="box-img">
<img src="images/index-6/our-project-1.jpg" alt="">
</div>
<div class="brick-flex-box">
<div class="box-content">
<a href="#" class="brick-hover-child-color-0ba2a5"><h3>CREATIVE PROJECT</h3></a>
<p>Design</p>
</div>
</div>
</div>
</li>
<li>
<div class="box">
<div class="box-img">
<img src="images/index-6/our-project-2.jpg" alt="">
</div>
<div class="brick-flex-box">
<div class="box-content">
<a href="#" class="brick-hover-child-color-0ba2a5"><h3>CREATIVE PROJECT</h3></a>
<p>Design</p>
</div>
</div>
</div>
</li>
<li>
<div class="box">
<div class="box-img">
<img src="images/index-6/our-project-3.jpg" alt="">
</div>
<div class="brick-flex-box">
<div class="box-content">
<a href="#" class="brick-hover-child-color-0ba2a5"><h3>CREATIVE PROJECT</h3></a>
<p>Design</p>
</div>
</div>
</div>
</li>
<li>
<div class="box">
<div class="box-img">
<img src="images/index-6/our-project-2.jpg" alt="">
</div>
<div class="brick-flex-box">
<div class="box-content">
<a href="#" class="brick-hover-child-color-0ba2a5"><h3>CREATIVE PROJECT</h3></a>
<p>Design</p>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</section>
<!-- END PROJECTS -->
<!-- END LATEST NEWS -->
<section class="latest-news-v3 set-padding set-min-height-text">
<div class="uk-container uk-container-center">
<div class="brick-title-v4">
<div class="brick-title-h3">
<h3>LATEST NEWS</h3>
</div>
<div class="brick-title-p">
<p>Integer posuere ligula nibh, eu faucibus est accumsan eu. In posuere</p>
</div>
<div class="brick-title-line">
<div class="brick-title-line-color brick-title-line-color-left brick-background-darkgreen"></div>
<div class="brick-title-line-color brick-title-line-color-right brick-background-1b2725"></div>
</div>
</div>
<div data-uk-slider="{autoplay: false, autoplayInterval: 4000}">
<div class="uk-slider-container">
<ul class="uk-slider uk-grid uk-grid-collapse uk-grid-width-medium-1-3 uk-grid-width-small-1-2 uk-grid-width-1-1">
<li>
<div class="box set-height-group">
<div class="box-img">
<a href="#"><img src="images/index-6/latest-news-1.jpg" alt=""></a>
</div>
<div class="box-content">
<div class="box-content-p">
<p class="brick-color-darkgreen">Construction</p>
</div>
<div class="box-content-title set-height">
<a href="#" class="brick-hover-child-color-darkgreen"><h3 class="basic-height">Explains simple house construction tips for new House</h3></a>
</div>
</div>
</div>
</li>
<li>
<div class="box set-height-group">
<div class="box-img">
<a href="#"><img src="images/index-6/latest-news-2.jpg" alt=""></a>
</div>
<div class="box-content">
<div class="box-content-p">
<p class="brick-color-darkgreen">Construction</p>
</div>
<div class="box-content-title set-height">
<a href="#" class="brick-hover-child-color-darkgreen"><h3 class="basic-height">10 Survival tips for Architecture Students, The Life of a Designer</h3></a>
</div>
</div>
</div>
</li>
<li>
<div class="box set-height-group">
<div class="box-img">
<a href="#"><img src="images/index-6/latest-news-3.jpg" alt=""></a>
</div>
<div class="box-content">
<div class="box-content-p">
<p class="brick-color-darkgreen">Construction</p>
</div>
<div class="box-content-title set-height">
<a href="#" class="brick-hover-child-color-darkgreen"><h3 class="basic-height">5 Kick Ass Tips for Architecture Students from the Experts</h3></a>
</div>
</div>
</div>
</li>
<li>
<div class="box set-height-group">
<div class="box-img">
<a href="#"><img src="images/index-6/latest-news-2.jpg" alt=""></a>
</div>
<div class="box-content">
<div class="box-content-p">
<p class="brick-color-darkgreen">Construction</p>
</div>
<div class="box-content-title set-height">
<a href="#" class="brick-hover-child-color-darkgreen"><h3 class="basic-height">10 Survival tips for Architecture Students, The Life of a Designer</h3></a>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</section>
<!-- BEGIN LATEST NEWS -->
<!-- END CONTAINER -->
<!-- BEGIN FOOTER -->
<footer class="footer-v3">
<div class="footer">
<div class="uk-container uk-container-center">
<div class="uk-grid">
<div class="uk-width-medium-1-3 uk-width-small-1-1 uk-width-1-1">
<div class="box">
<div class="box-logo">
<a href="index.html"><img src="images/footer/logo-darkgreen.png" alt=""></a>
</div>
<div class="box-content">
<div class="box-content-p">
<p>Vestibulum iaculis rhoncus lacus, eu venenat massa hendrerit non. Sed dignissim nec duised dignissim. Etiam nec arcu mauris. Donec rhon cus lorem quam, a mollis tellus.</p>
</div>
<div class="box-content-social">
<ul>
<li class="brick-hover-child-color-0ba2a5"><a href="#"><span class="fa fa-facebook"></span></a></li>
<li class="brick-hover-child-color-0ba2a5"><a href="#"><span class="fa fa-vimeo"></span></a></li>
<li class="brick-hover-child-color-0ba2a5"><a href="#"><span class="fa fa-twitter"></span></a></li>
<li class="brick-hover-child-color-0ba2a5"><a href="#"><span class="fa fa-instagram"></span></a></li>
<li class="brick-hover-child-color-0ba2a5"><a href="#"><span class="fa fa-google"></span></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-1 uk-width-1-1">
<div class="box">
<div class="box-title">
<h3>NEWS FROM TWITTER</h3>
</div>
<div class="box-content">
<div class="box-content-contact">
<ul>
<li><p><span class="fa fa-twitter brick-color-0ba2a5"></span>Infographic: <i class="brick-color-0ba2a5">#Architechture</i> vs <i class="brick-color-0ba2a5">#Art</i>, which one do you choose?</p></li>
<li><p><span class="fa fa-twitter brick-color-0ba2a5"></span>When you choose <i class="brick-color-0ba2a5">#Life</i> or <i class="brick-color-0ba2a5">#Money</i>, which one do you choose?</p></li>
</ul>
</div>
</div>
</div>
</div>
<div class="uk-width-medium-1-3 uk-width-small-1-1 uk-width-1-1">
<div class="box">
<div class="box-title">
<h3>MAIN OFFICE</h3>
</div>
<div class="box-content">
<div class="box-content-office">
<ul>
<li><span class="fa fa-phone"></span><p>(+1) 000 444 999</p></li>
<li><span class="fa fa-map-marker"></span><p>Haviva Holcomb, P.O. Box 642 3450 In Road Isle of Palms New York 03828</p></li>
<li><a href="info%40qtcmedia.html"><span class="fa fa-envelope"></span><p class="brick-hover-color-0ba2a5">[email protected]</p></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="copyright brick-background-1b2725">
<p>©<span>The Brick</span>, All rights reserved</p>
</div>
</footer>
<!-- END FOOTER -->
<div class="brick-backtotop brick-background-darkgreen" data-uk-smooth-scroll><span class="fa fa-arrow-up"></span></div>
<!-- BEGIN JQUERY JS -->
<script src="plugins/jquery/jquery-1.12.4.min.js"></script>
<script src="plugins/uikit-2.27.2/js/uikit.min.js" type="text/javascript"></script>
<script src="plugins/jquery-waypoints/2.0.3/waypoints.min.js" type="text/javascript"></script>
<script src="plugins/jquery-count-to-number/jquery.counterup.min.js" type="text/javascript"></script>
<script src="plugins/slick-master/slick/slick.min.js" type="text/javascript"></script>
<!-- END JQUERY JS -->
<!-- BEGIN COMPONENT UIKIT-->
<script src="plugins/uikit-2.27.2/js/components/sticky.min.js" type="text/javascript"></script>
<script src="plugins/uikit-2.27.2/js/components/slider.min.js" type="text/javascript"></script>
<!-- END COMPONENT UIKIT-->
<!-- BEGIN REVOLUTION SLIDER -->
<script src="plugins/revolution/js/jquery.themepunch.tools.min.js"></script>
<script src="plugins/revolution/js/jquery.themepunch.revolution.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.actions.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.carousel.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.kenburn.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.layeranimation.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.migration.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.navigation.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.parallax.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.slideanims.min.js"></script>
<script src="plugins/revolution/js/extensions/revolution.extension.video.min.js"></script>
<!-- END REVOLUTION SLIDER -->
<!-- BEGIN MAIN JS -->
<script src="js/main.js"></script>
<!-- END MAIN JS -->
</body>
<!-- Mirrored from brick.qtcmedia.com/html/index-6.html by HTTrack Website Copier/3.x [XR&CO'2014], Thu, 07 Mar 2019 04:15:00 GMT -->
</html>
|