Files
demo_sites/templates/template_3/site/index-architect.html
2026-05-17 18:29:30 -05:00

830 lines
51 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Home</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Abril+Fatface%7CLato:300i,400,900%7CMontserrat:100,300,400,500,600,700,900">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style-3.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="preloader loaded">
<div class="preloader-body">
<div class="cssload-container">
<div class="cssload-speeding-wheel"></div>
</div>
<p>Loading...</p>
</div>
</div>
<div class="page">
<!-- Page Header-->
<header class="section page-header">
<!-- RD Navbar-->
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-classic" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-fixed" data-lg-device-layout="rd-navbar-fixed" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-lg-stick-up-offset="50px" data-xl-stick-up-offset="50px" data-xxl-stick-up-offset="50px" data-lg-stick-up="true" data-xl-stick-up="true" data-xxl-stick-up="true">
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<!-- RD Navbar Panel-->
<div class="rd-navbar-panel">
<!-- RD Navbar Toggle-->
<button class="rd-navbar-toggle" data-rd-navbar-toggle=".rd-navbar-nav-wrap"><span></span></button>
<!-- RD Navbar Brand-->
<div class="rd-navbar-brand"><a class="brand" href="index.html"><img class="brand-logo-light" src="images/architect/logo-inverse-140x37.png" alt="" width="140" height="37" srcset="images/architect/logo-retina-inverse-280x74.png 2x"/></a></div>
</div>
<div class="rd-navbar-nav-wrap">
<!-- RD Navbar Nav-->
<ul class="rd-navbar-nav">
<li class="rd-nav-item"><a class="rd-nav-link" href="#about">About</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#projects">projects</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#services">services</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#portfolio">portfolio</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#testimonials">Testimonials</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#contacts">Contacts</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- Swiper-->
<section class="section swiper-container swiper-slider swiper-slider-1 box-hero-header-var-3" data-swiper='{"autoplay":{"delay":6000},"effect":"fade","simulateTouch":false,"loop":false}'>
<div class="swiper-wrapper text-left">
<div class="swiper-slide" id="section-ripples-1" data-slide-bg="images/architect/slide-1.jpg">
<div class="swiper-slide-caption section-xxl context-dark">
<div class="container">
<div class="row">
<div class="col-xl-7 overflow-hidden">
<p class="subtitle" data-caption-animate="fadeInLeft" data-caption-delay="100">industry leading services</p>
<h1 data-caption-animate="fadeInLeft" data-caption-delay="350">Top-notch</h1>
<h2 data-caption-animate="fadeInLeft" data-caption-delay="450">architectural solutions</h2>
<div class="group-sm"><a class="button button-primary button-nina" href="#" data-caption-animate="fadeInLeft" data-caption-delay="550" data-custom-scroll-to="services">Our services</a><a class="button button-default-outline button-icon button-icon-right" href="#" data-caption-animate="fadeInLeft" data-caption-delay="550" data-toggle="modal" data-target="#modalvideo"><span class="icon mdi mdi-play"></span>play</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide context-dark" id="section-ripples-2" data-slide-bg="images/architect/slide-1.jpg">
<div class="swiper-slide-caption section-xxl">
<div class="container">
<div class="row">
<div class="col-lg-7 overflow-hidden">
<p class="subtitle" data-caption-animate="fadeInLeft" data-caption-delay="100">reliable buildings for you</p>
<h1 data-caption-animate="fadeInLeft" data-caption-delay="350">New Space</h1>
<h2 data-caption-animate="fadeInLeft" data-caption-delay="450">for all your ideas</h2>
<div class="group-sm"><a class="button button-primary button-nina" href="#" data-caption-animate="fadeInLeft" data-caption-delay="550" data-custom-scroll-to="services">Our services</a><a class="button button-default-outline button-icon button-icon-right" href="#" data-caption-animate="fadeInLeft" data-caption-delay="550" data-toggle="modal" data-target="#modalvideo"><span class="icon mdi mdi-play"></span>play</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--about-->
<section class="section bg-default text-left section-md" id="about" data-type="anchor">
<div class="container">
<div class="row flex-md-row-reverse align-items-xl-stretch row-50">
<div class="col-md-6">
<div class="pl-xl-5 pt-xl-3 pb-xl-3">
<h4 class="heading-decoration-line font-weight-bold">Every Client Always Becomes Our Friend</h4>
<p>We specialize in providing architectural services to public agencies and private clients throughout the USA. With over 35 years of professional experience, we are well known for providing highly competent design solutions.</p>
<div class="group-xl group-middle">
<article class="box-counter">
<div class="box-counter__wrap">
<div class="counter">13</div>
<p class="box-counter__title">Years of Experience</p>
</div>
</article>
<article class="box-counter">
<div class="box-counter__wrap">
<div class="counter">99</div>
<p class="box-counter__title">Successful Projects</p>
</div>
</article>
</div>
<hr>
</div>
</div>
<div class="col-md-6">
<div class="box-double"></div>
</div>
</div>
</div>
</section>
<!-- projects-->
<section class="section section-md context-dark bg-image text-center" id="projects" data-type="anchor" style="background-image: url(images/architect/pattern-bg.jpg)">
<div class="container">
<p class="subtitle">latest projects</p>
<h2>We Turn Ideas Into Works of Art</h2>
</div>
<!-- Owl Carousel-->
<div class="owl-carousel carousel-project" data-owl='{"dots":true,"nav":true,"center":true,"navText":["prev","next"]}' data-items="1" data-md-items="1" data-stage-padding="15" data-md-stage-padding="150" data-xl-stage-padding="200" data-xxl-stage-padding="350" data-loop="true" data-autoplay="true" data-margin="30" data-xl-margin="0" data-xxl-margin="0" data-mouse-drag="false">
<div class="box-project">
<div class="box-project-image"><img src="images/architect/project-1-632x375.jpg" alt="" width="632" height="375"/>
</div>
<div class="box-project-body">
<div class="box-project-inner">
<h5 class="box-project-title"><a href="#">3046 Wilson Road</a></h5>
<div class="box-project-subtitle">exterior design</div>
</div>
<div class="box-project-social"><span class="icon icon-lg linearicons-share2" data-project-toggle></span>
<ul class="list-inline-sm box-project-icon-list">
<li><a class="icon-sm mdi mdi-facebook novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-twitter novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-google-plus novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-vimeo novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-youtube-play novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-pinterest novi-icon icon" href="#"></a></li>
</ul>
</div>
</div>
</div>
<div class="box-project">
<div class="box-project-image"><img src="images/architect/project-2-632x375.jpg" alt="" width="632" height="375"/>
</div>
<div class="box-project-body">
<div class="box-project-inner">
<h5 class="box-project-title"><a href="#">3335 Crummit Lane</a></h5>
<div class="box-project-subtitle">Interior design</div>
</div>
<div class="box-project-social"><span class="icon icon-lg linearicons-share2" data-project-toggle></span>
<ul class="list-inline-sm box-project-icon-list">
<li><a class="icon-sm mdi mdi-facebook novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-twitter novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-google-plus novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-vimeo novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-youtube-play novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-pinterest novi-icon icon" href="#"></a></li>
</ul>
</div>
</div>
</div>
<div class="box-project">
<div class="box-project-image"><img src="images/architect/project-3-632x375.jpg" alt="" width="632" height="375"/>
</div>
<div class="box-project-body">
<div class="box-project-inner">
<h5 class="box-project-title"><a href="#">4005 Jessie Street</a></h5>
<div class="box-project-subtitle">project management</div>
</div>
<div class="box-project-social"><span class="icon icon-lg linearicons-share2" data-project-toggle></span>
<ul class="list-inline-sm box-project-icon-list">
<li><a class="icon-sm mdi mdi-facebook novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-twitter novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-google-plus novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-vimeo novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-youtube-play novi-icon icon" href="#"></a></li>
<li><a class="icon-sm mdi mdi-pinterest novi-icon icon" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- process-->
<section class="section section-md bg-default text-center" id="services" data-type="anchor">
<div class="container">
<p class="subtitle"><span>our services</span></p>
<h2>Leading Architectural Solutions</h2>
<p>We provide services that transform our clients ambitions into <br class="d-none d-md-inline-block"> elegantly useful and appealing human environments.</p>
<div class="row row-30 justify-content-center">
<div class="col-md-6 col-xl-4">
<div class="box-process">
<div class="box-process-header"><span class="icon icon-circle icon-primary icon-md icon-effect-4 icon-effect-4--mod-4 linearicons-pencil-ruler"></span>
<h5>Interior Design</h5>
</div>
<div class="box-process-body">
<p>We design interior spaces that improve collaboration and inspire occupants.</p>
<ul class="list-marked">
<li>Space Planning</li>
<li>Decorator Services</li>
<li>Custom Furnishings</li>
<li>Lighting Installation</li>
</ul>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4">
<div class="box-process">
<div class="box-process-header"><span class="icon icon-circle icon-primary icon-md icon-effect-4 icon-effect-4--mod-4 linearicons-home3"></span>
<h5>Exterior Design</h5>
</div>
<div class="box-process-body">
<p>Our company builds exteriors that impress our clients and their guests.</p>
<ul class="list-marked">
<li>Complete Turnkey Service</li>
<li>Landscape Plans</li>
<li>Custom Pools Design</li>
<li>Outdoor Living Rooms Design</li>
</ul>
</div>
</div>
</div>
<div class="col-md-6 col-xl-4">
<div class="box-process">
<div class="box-process-header"><span class="icon icon-circle icon-primary icon-md icon-effect-4 icon-effect-4--mod-4 linearicons-brush2"></span>
<h5>Repair Services</h5>
</div>
<div class="box-process-body">
<p>Need a quick repair or renovation service? We are here to help!</p>
<ul class="list-marked">
<li>Home Additions</li>
<li>Basement Finishing</li>
<li>Bathroom Remodeling</li>
<li>Kitchen Remodeling</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<!--cta-->
<section class="section parallax-container context-dark" data-parallax-img="images/architect/cta-bg.jpg">
<div class="parallax-content section-md">
<div class="container section-cta text-center">
<div class="row justify-content-center">
<div class="col-lg-8">
<p class="subtitle">design the house of your dream</p>
<h2>It's Time For The First Step</h2>
<p>Lets discuss how you want your dream house to <br class="d-none d-xl-inline-block"> look like. Contact us today to get started.</p><a class="button button-primary button-nina" href="#" data-custom-scroll-to="contacts">Contact us</a>
</div>
</div>
</div>
</div>
</section>
<section class="section section-md bg-default text-center" id="portfolio" data-type="anchor">
<div class="container">
<p class="subtitle"><span>our portfolio</span></p>
<h2>Work Done With Love</h2>
<div class="isotope-wrap">
<ul class="list-nav isotope-filters-responsive">
<li>
<p>Choose your category:</p>
</li>
<li class="block-top-level">
<!-- Isotope Filters-->
<button class="isotope-filters-toggle button button-sm button-primary" data-custom-toggle="#isotope-1" data-custom-toggle-hide-on-blur="true">Filter<span class="caret"></span></button>
<div class="isotope-filters" id="isotope-1">
<ul class="inline-list">
<li><a class="active" data-isotope-filter="*" data-isotope-group="gallery" href="#">All</a></li>
<li><a data-isotope-filter="Category 1" data-isotope-group="gallery" href="#">interior</a></li>
<li><a data-isotope-filter="Category 2" data-isotope-group="gallery" href="#">exterior </a></li>
<li><a data-isotope-filter="Category 3" data-isotope-group="gallery" href="#">other</a></li>
</ul>
</div>
</li>
</ul>
<div class="isotope row row-30" data-isotope-layout="fitRows" data-isotope-group="gallery">
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 1"><a class="box-portfolio" href="#">
<figure><img src="images/architect/portfolio-1-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">3922 James Avenue</h5>
<p class="portfolio-subtitle">landscape design</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 1"><a class="box-portfolio" href="#">
<figure><img src="images/architect/portfolio-2-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">1746 Grant Drive</h5>
<p class="portfolio-subtitle">custom Furnishing</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 1"><a class="box-portfolio" href="#">
<figure><img src="images/architect/portfolio-3-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">1832 Maud Street</h5>
<p class="portfolio-subtitle">Remodeling</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 2"><a class="box-portfolio" href="#">
<figure><img src="images/architect/portfolio-4-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">4356 Modoc Alley</h5>
<p class="portfolio-subtitle">project management</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="*">
<div class="portfolio-centered"><span class="icon icon-lg linearicons-quote-open"></span>
<h5><span class="font-weight-normal">Lets Discuss</span> <span class="font-family-cursive">Your </span><span class="font-weight-normal">Project</span>
</h5><a class="button button-default-outline button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 2"><a class="box-portfolio" href="#">
<figure><img src="images/architect/portfolio-5-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">225 Cedarstone Drive</h5>
<p class="portfolio-subtitle">interior architecture</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 3"><a class="box-portfolio" href="#">
<figure><img src="images/architect/portfolio-6-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">3046 Wilson Road</h5>
<p class="portfolio-subtitle">exterior design</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 3"><a class="box-portfolio" href="#">
<figure><img src="images/architect/portfolio-7-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">3335 Crummit Lane</h5>
<p class="portfolio-subtitle">Interior design</p>
</div></a>
</div>
<div class="col-12 col-md-6 col-lg-4 isotope-item" data-filter="Category 3"><a class="box-portfolio" href="#">
<figure><img src="images/architect/portfolio-8-370x280.jpg" alt="" width="370" height="280"/>
</figure>
<div class="caption">
<h5 class="portfolio-title">4922 Hall Drive</h5>
<p class="portfolio-subtitle">Lighting</p>
</div></a>
</div>
</div>
</div>
</div>
</section>
<!-- Services-->
<section class="section section-md bg-gray-100">
<div class="container">
<div class="row row-50 justify-content-center services-container">
<div class="col-12">
<div class="box-strategy">
<div class="box-strategy-inner box-strategy-title">
<h4>Our Strategy</h4>
</div>
<div class="box-strategy-inner box-strategy-body">
<p>Every project we work on includes hours of design, prototyping, <br class="d-none d-xl-inline-block"> and discussion. Still, it can be described in 3 simple steps.</p><a class="button button-gray-800-outline button-icon button-icon-right" href="#" data-toggle="modal" data-target="#appointment">free consultation</a>
</div>
</div>
<hr>
</div>
<div class="col-sm-6 col-lg-4">
<div class="box-service">
<div class="box-service-heading"><span class="icon icon-circle icon-primary icon-md icon-effect-7 linearicons-aim"></span>
<h5>Defining Goals</h5>
</div>
<div class="box-service-body">
<p>During the initial consultation, we define the goals for achieving successful results.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="box-service">
<div class="box-service-heading"><span class="icon icon-circle icon-primary icon-md icon-effect-7 linearicons-compass"></span>
<h5>Create Prototypes</h5>
</div>
<div class="box-service-body">
<p>After that, we create 3D prototypes that are later discussed with the client.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="box-service">
<div class="box-service-heading"><span class="icon icon-circle icon-primary icon-md icon-effect-7 linearicons-check"></span>
<h5>Successful Completion</h5>
</div>
<div class="box-service-body">
<p>After our architects complete their job, we are ready to bring our designs to life.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section section-md context-dark bg-image text-center container-decoration" id="testimonials" data-type="anchor" style="background-image: url(images/architect/pattern-bg.jpg)">
<div class="container-decoration-inner inner-left">
<div class="wow fadeInUp"><img src="images/architect/client-1-183x47.png" alt="" width="183" height="47"/>
</div>
<div class="wow fadeInUp" data-wow-delay="0.3s"><img src="images/architect/client-2-148x100.png" alt="" width="148" height="100"/>
</div>
<div class="wow fadeInUp" data-wow-delay="0.6s"><img src="images/architect/client-1-158x73.png" alt="" width="158" height="73"/>
</div>
</div>
<div class="container-decoration-inner inner-right">
<div class="wow fadeInUp" data-wow-delay="0.15s"><img src="images/architect/client-4-128x94.png" alt="" width="128" height="94"/>
</div>
<div class="wow fadeInUp" data-wow-delay="0.45s"><img src="images/architect/client-5-153x45.png" alt="" width="153" height="45"/>
</div>
<div class="wow fadeInUp" data-wow-delay="0.75s"><img src="images/architect/client-6-128x56.png" alt="" width="128" height="56"/>
</div>
</div>
<div class="container">
<p class="subtitle">testimonials</p>
<h2>What People Say</h2>
<div class="owl-carousel carousel-testimonials" data-owl='{"dots":true}' data-items="1" data-md-items="2" data-stage-padding="15" data-loop="true" data-autoplay="true" data-margin="60">
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/architect/testimonials-1-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>I am amazed at how quickly you put together a furniture plan, paint plan and managed all the various components as we get closer to the deadline.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Alice Parker</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/architect/testimonials-2-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Ive used your services plenty of times and Im very satisfied with your work. I have to say that your work is not only excellent but extremely beautiful.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Steve Thomas</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/architect/testimonials-1-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>I am amazed at how quickly you put together a furniture plan, paint plan and managed all the various components as we get closer to the deadline.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Alice Parker</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/architect/testimonials-2-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Ive used your services plenty of times and Im very satisfied with your work. I have to say that your work is not only excellent but extremely beautiful.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Steve Thomas</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/architect/testimonials-1-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>I am amazed at how quickly you put together a furniture plan, paint plan and managed all the various components as we get closer to the deadline.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Alice Parker</cite><span>Customer</span>
</p>
</div>
</div>
<div class="box-testimonials">
<div class="box-testimonials-image"><img class="rounded-circle" src="images/architect/testimonials-2-131x131.jpg" alt="" width="131" height="131"/>
</div>
<div class="box-testimonials-body">
<p>Ive used your services plenty of times and Im very satisfied with your work. I have to say that your work is not only excellent but extremely beautiful.</p>
</div>
<div class="box-testimonials-footer">
<p>
<cite>Steve Thomas</cite><span>Customer</span>
</p>
</div>
</div>
</div>
</div>
</section>
<!-- pricing-->
<section class="section section-md bg-default" id="pricing" data-type="anchor">
<div class="container text-center">
<p class="subtitle"><span>our pricing</span></p>
<h2>A Variety of Options </h2>
<p>Transform your everyday environment with these 3 different sets of architecture services <br class="d-none d-md-inline-block"> offered at affordable price. Every pricing package can be customized according to your wishes. </p>
<div class="row row-30">
<div class="col">
<div class="box-pricing">
<div class="box-pricing-header">
<h5 class="title">Basic</h5><span class="icon icon-circle linearicons-pencil-ruler2"></span>
</div>
<div class="box-pricing-body">
<div class="price-box"><span>25</span><span>/ sq.m.</span></div>
<ul class="pricing-list">
<li>Interior Design</li>
<li>Space Planning</li>
<li>Decorating Service</li>
<li>Project Management</li>
</ul><a class="button button-default-outline button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
</div>
<div class="col">
<div class="box-pricing"><span class="label label-popular">popular</span>
<div class="box-pricing-header">
<h5 class="title">Standard</h5><span class="icon icon-circle linearicons-home3"></span>
</div>
<div class="box-pricing-body">
<div class="price-box"><span>59</span><span>/ sq.m.</span></div>
<ul class="pricing-list">
<li>Interior Architecture</li>
<li>Exterior Design</li>
<li>Renovation Service</li>
<li>Lighting Installation</li>
</ul><a class="button button-default-outline button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
</div>
<div class="col">
<div class="box-pricing">
<div class="box-pricing-header">
<h5 class="title">Premium</h5><span class="icon icon-circle linearicons-couch"></span>
</div>
<div class="box-pricing-body">
<div class="price-box"><span>90</span><span>/ sq.m.</span></div>
<ul class="pricing-list">
<li>Exterior & Landscape Design</li>
<li>Planning & Development</li>
<li>Custom Furniture</li>
<li>Refurbishing</li>
</ul><a class="button button-default-outline button-nina" href="#" data-toggle="modal" data-target="#appointment">get started</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section section-md bg-gray-100" id="blog" data-type="anchor">
<div class="container text-center">
<p class="subtitle"><span>latest news</span></p>
<h2>Company Blog</h2>
<div class="row row-30">
<div class="col-md-6 col-lg-5">
<div class="box-post-classic">
<div class="box-post-classic-body">
<time class="box-post-meta" datetime="2018">December 3, 2020</time>
<h6 class="box-post-title"><a href="#">Architectural Innovations</a></h6>
<p class="box-post-text">Lots of companies tend to be “architecturally innovative” but what does it really mean? Our...</p>
</div>
</div>
<div class="box-post-classic"><a class="box-post-classic-image" href="#"><img src="images/architect/blog-1-470x256.jpg" alt="" width="470" height="256"/></a>
<div class="box-post-classic-body">
<time class="box-post-meta" datetime="2018">December 3, 2020</time>
<h5 class="box-post-title"><a href="#">The Easter Eggs of Architecture</a></h5>
<p class="box-post-text">We cover an example of a pleasant design surprise in one of our projects.</p>
</div>
</div>
</div>
<div class="col-md-6 col-lg-7">
<div class="row row-30">
<div class="col-12">
<div class="box-post-modern"><a class="box-post-modern-image" href="#"><img src="images/architect/blog-2-666x485.jpg" alt="" width="666" height="485"/></a>
<div class="box-post-modern-body">
<time class="box-post-meta" datetime="2018">December 17, 2020</time>
<h5 class="box-post-title"><a href="#">Light Fixture Favorites From Our Winter Selection</a></h5>
<p class="box-post-text">Looking for a little lighting design inspiration? Browse these unique modern light fixtures.</p><a class="button button-primary button-nina" href="#">read more</a>
</div>
</div>
</div>
<div class="col-lg-7"><a class="box-post-quote" href="#">
<p class="box-post-quote-inner">Get inspired checking the best and coolest interior ideas.</p><span class="box-post-cite">Steve Smith</span></a></div>
<div class="col-lg-5">
<div class="box-post-instagram instafeed" data-lightgallery="group">
<div class="thumbnail-instafeed"><a class="instagram-link" data-lightgallery="item" href="images/lawyer/blog-3-640x640.jpg"><img class="instagram-image" src="images/lawyer/blog-3-640x640.jpg" alt=""/></a>
<div class="caption">
<ul class="list-inline inline-list-xxs">
<li><span class="novi-icon icon mdi mdi-magnify-plus"></span></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--cta-->
<section class="section parallax-container context-dark" data-parallax-img="images/architect/subscribe-bg.jpg">
<div class="parallax-content section-md">
<div class="container text-center">
<div class="row justify-content-center">
<div class="col-lg-8 col-xl-7">
<p class="subtitle">newsletter</p>
<h2>Stay Informed with the Latest News</h2>
<p>Get our news & updates into your inbox.</p>
<!-- RD Mailform-->
<form class="rd-form rd-mailform rd-form-inline" data-form-output="form-output-global" data-form-type="subscribe" method="post" action="bat/rd-mailform.php">
<div class="form-wrap">
<input class="form-input" id="subscribe-form-0-email" type="email" name="email" data-constraints="@Email @Required"/>
<label class="form-label" for="subscribe-form-0-email">Your E-mail</label>
</div>
<div class="form-button">
<button class="button button-primary button-nina" type="submit">Subscribe</button>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<section class="section section-md bg-default" id="contacts" data-type="anchor">
<div class="container text-center">
<p class="subtitle"><span>contact us</span></p>
<h2>Get in Touch with Us</h2>
<p>Send us a message to find out more about our services <br class="d-none d-md-inline-block"> or discuss the design of your home interior/exterior.</p>
<!-- RD Mailform-->
<form class="rd-form rd-mailform" data-form-output="form-output-global" data-form-type="contact" method="post" action="bat/rd-mailform.php">
<div class="row row-20">
<div class="col-md-4">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-name" type="text" name="name" data-constraints="@Required">
<label class="form-label mdi mdi-account-outline input__label--nao" for="contact-name">Your Name</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-md-4">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-email" type="email" name="email" data-constraints="@Email @Required">
<label class="form-label input__label--nao mdi mdi-email-outline" for="contact-email">E-mail</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-md-4">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-phone" type="text" name="phone" data-constraints="@Numeric">
<label class="form-label input__label--nao mdi mdi-tablet-android" for="contact-phone">Phone</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<textarea class="form-input input__field--nao" id="contact-message" name="message" data-constraints="@Required"></textarea>
<label class="form-label input__label--nao mdi mdi-message-text-outline" for="contact-message">Your Message</label>
<svg class="graphic graphic--nao" width="300%" height="50%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12 text-center form-button">
<button class="button button-primary button-nina" type="submit">Send Message</button>
</div>
</div>
</form>
</div>
</section>
<section class="google-map-container" data-center="6036 Richmond hwy., Alexandria, VA, 2230" data-styles="[{&quot;featureType&quot;:&quot;administrative&quot;,&quot;elementType&quot;:&quot;labels.text.fill&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#444444&quot;}]},{&quot;featureType&quot;:&quot;landscape&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#f2f2f2&quot;}]},{&quot;featureType&quot;:&quot;poi&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;off&quot;}]},{&quot;featureType&quot;:&quot;poi.business&quot;,&quot;elementType&quot;:&quot;geometry.fill&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;on&quot;}]},{&quot;featureType&quot;:&quot;road&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;saturation&quot;:-100},{&quot;lightness&quot;:45}]},{&quot;featureType&quot;:&quot;road.highway&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;simplified&quot;}]},{&quot;featureType&quot;:&quot;road.arterial&quot;,&quot;elementType&quot;:&quot;labels.icon&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;off&quot;}]},{&quot;featureType&quot;:&quot;transit&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;off&quot;}]},{&quot;featureType&quot;:&quot;water&quot;,&quot;elementType&quot;:&quot;all&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#b4d4e1&quot;},{&quot;visibility&quot;:&quot;on&quot;}]}]">
<div class="google-map"></div>
<ul class="google-map-markers">
<li data-location="6036 Richmond hwy., Alexandria, VA, 2230" data-description="6036 Richmond hwy., Alexandria, VA, 2230" data-icon="images/architect/gmap_marker.png" data-icon-active="images/architect/gmap_marker_active.png"></li>
</ul>
</section>
<!-- Page Footer-->
<footer class="section footer-classic context-dark bg-image" style="background-image: url(images/architect/pattern-bg.jpg)">
<div class="container">
<div class="row row-30">
<div class="col-md-4 col-xl-5">
<div class="pr-xl-4"><a class="brand" href="index.html"><img class="brand-logo-light" src="images/architect/logo-inverse-140x37.png" alt="" width="140" height="37" srcset="images/architect/logo-retina-inverse-280x74.png 2x"/></a>
<p>We are one of the leading interior/exterior design and remodeling studios available for all of your residential and commercial design needs.</p>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp; </span><span class="copyright-year"></span><span>&nbsp;</span><span>Waves</span><span>.&nbsp;</span><span>All Rights Reserved.</span></p>
</div>
</div>
<div class="col-md-4">
<h5>Contacts</h5>
<dl class="contact-list">
<dt>Address:</dt>
<dd>795 South Park Avenue, Melbourne, Australia</dd>
</dl>
<dl class="contact-list">
<dt>email:</dt>
<dd><a href="mailto:#">mail@demolink.org</a></dd>
</dl>
<dl class="contact-list">
<dt>phones:</dt>
<dd><a href="tel:#">8 800 56789011</a> <span>or</span> <a href="tel:#">8 800 99789077</a>
</dd>
</dl>
</div>
<div class="col-md-4 col-xl-3">
<h5>Links</h5>
<ul class="nav-list">
<li><a href="#">About</a></li>
<li><a href="#">Projects</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contacts</a></li>
<li><a href="#">Pricing</a></li>
</ul>
</div>
</div>
</div>
<div class="row no-gutters social-container">
<div class="col"><a class="social-inner" href="#"><span class="icon mdi mdi-facebook"></span><span>Facebook</span></a></div>
<div class="col"><a class="social-inner" href="#"><span class="icon mdi mdi-instagram"></span><span>instagram</span></a></div>
<div class="col"><a class="social-inner" href="#"><span class="icon mdi mdi-twitter"></span><span>twitter</span></a></div>
<div class="col"><a class="social-inner" href="#"><span class="icon mdi mdi-youtube-play"></span><span>google</span></a></div>
</div>
</footer>
<div class="modal fade" id="modalvideo" role="dialog">
<div class="modal-dialog modal-dialog_custom modal-dialog_custom-details">
<!-- Modal content-->
<div class="modal-dialog__inner">
<button class="close" type="button" data-dismiss="modal"></button>
<div class="modal-dialog__content">
<div class="modal-dialog__content-inner">
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" id="video" width="560" height="315" src="https://www.youtube.com/embed/-AhmuMqZB0s" allowfullscreen></iframe>
</div>
</div>
<div class="modal-dialog__content-inner">
<h4>Reliable Solutions</h4>
<p>Waves offers a vast set of services and solutions that help you achieve the desired result.</p>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="appointment" role="dialog">
<div class="modal-dialog modal-dialog_custom">
<!-- Modal content-->
<div class="modal-dialog__inner">
<button class="close" type="button" data-dismiss="modal"></button>
<div class="modal-dialog__content">
<h4>Make an Appointment</h4>
<!-- RD Mailform-->
<form class="rd-form rd-mailform" data-form-output="form-output-global" data-form-type="contact" method="post" action="bat/rd-mailform.php">
<div class="row row-20">
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-name-modal" type="text" name="name" data-constraints="@Required">
<label class="form-label mdi mdi-account-outline input__label--nao" for="contact-name-modal">Your Name</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-email-modal" type="email" name="email" data-constraints="@Email @Required">
<label class="form-label input__label--nao mdi mdi-email-outline" for="contact-email-modal">E-mail</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<input class="form-input input__field--nao" id="contact-phone-modal" type="text" name="phone" data-constraints="@Numeric">
<label class="form-label input__label--nao mdi mdi-tablet-android" for="contact-phone-modal">Phone</label>
<svg class="graphic graphic--nao" width="300%" height="100%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12">
<div class="form-wrap form-wrap-icon input--nao">
<textarea class="form-input input__field--nao" id="contact-message-modal" name="message" data-constraints="@Required"></textarea>
<label class="form-label input__label--nao mdi mdi-message-text-outline" for="contact-message-modal">Your Message</label>
<svg class="graphic graphic--nao" width="300%" height="50%" viewbox="0 0 1200 60" preserveaspectratio="none">
<path d="M0,56.5c0,0,298.666,0,399.333,0C448.336,56.5,513.994,46,597,46c77.327,0,135,10.5,200.999,10.5c95.996,0,402.001,0,402.001,0"></path>
</svg>
</div>
</div>
<div class="col-12 text-center form-button">
<button class="button button-primary button-nina" type="submit">Send Message</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>