View file TeraHoster/TeraHoster html-Version/Enterprise-Version/web-development.html

File size: 42.72Kb
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <!-- seo tools -->
    <meta content="TeraHoster is a professional,clean,unique and modern hosting HTML5 Template" name="description">
    <meta content="TeraHoster,design,html5,hosting template,hosting,whmcs,domain" name="keywords">
    <meta content="ThemeKolor" name="author">
    <!-- seo tools -->
    <!-- page title -->
    <title>TeraHoster - Web Development and Design</title>
    <!-- page title -->
    <!-- favicon -->
    <link href="favicon.ico" rel="shortcut icon" type="image/x-icon">
    <link href="favicon.ico" rel="icon" type="image/x-icon">
    <!-- bootstrap css -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <!-- default css / Style Pages -->
    <link href="style/style.css" rel="stylesheet" type="text/css">
    <link href="style/navigation.css" rel="stylesheet">
    <link href="style/preloader.css" rel="stylesheet">
    <link href="style/megamenu-style.css" rel="stylesheet">
    <link href="style/color-switcher/color-switcher.css" rel="stylesheet">
    <!-- responsive css -->
    <link href="style/responsive.css" rel="stylesheet" type="text/css">
    <!-- animations -->
    <link href="style/animate.css" rel="stylesheet" type="text/css">
    <!-- fontawesome -->
    <link href="fonts/font-awesome.min.css" rel="stylesheet" type="text/css">
    <!-- google fonts -->
    <link href="https://fonts.googleapis.com/css?family=Maven+Pro:400,500,700,900|Noto+Sans:400,700|Nunito+Sans:400,400i,600,600i,700,700i,800,900,900i" rel="stylesheet">
</head>

<body>

    <!-- preloader -->
    <div id="preloader">
        <div class="text-center " id="status">
            <img src="Preloader.svg" alt="Preloader" class="img-responsive" style="margin: 0 auto">
        </div>
    </div>
    <!-- preloader -->

    <!--START OF TOP-BAR -->
    <div class="container-fluid top-bar">
        <div class="container">
            <div class="col-sm-5 col-xs-5 top-list">
                <ul>
                    <li>
                        <a href="#"><i aria-hidden="true" class="fa fa-facebook fa-md hvr-grow"></i></a>
                    </li>
                    <li>
                        <a href="#"><i aria-hidden="true" class="fa fa-twitter fa-md hvr-grow"></i></a>
                    </li>
                    <li>
                        <a href="#"><i aria-hidden="true" class="fa fa-google-plus fa-md hvr-grow"></i></a>
                    </li>
                    <li>
                        <a href="#"><i aria-hidden="true" class="fa fa-linkedin fa-md hvr-grow"></i></a>
                    </li>
                </ul>
            </div>
            <div class="col-sm-7 col-xs-7 top-list-right">
                <ul>
                    <li class="account"><a href="#">My Account</a></li>
                    <li class="toplist-3"><a href="about.html">About</a></li>
                    <li class="toplist-5"><a href="contact.html">Contact</a></li>
                    <li class="toplist-2">hello@themekolor.co</li>
                </ul>
            </div>
        </div>
    </div>
    <!--END OF TOP-BAR  -->
    <!-- Start Navigation -->
    <nav class="navbar navbar-default navbar-sticky navbar-mobile bootsnav">
        <div class="container">
            <!-- Start Atribute Navigation -->
            <div class="attr-nav">
                <ul>
                    <li class="side-menu"><a href="#"><i class="fa fa-bars"></i></a></li>
                </ul>
            </div>
            <!-- End Atribute Navigation -->

            <!-- Start Header Navigation -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-menu">
                    <i class="fa fa-bars"></i>
                </button>
                <a class="navbar-brand" href="index.html"><img src="img/logo/logo2.png" class="logo" alt=""></a>
            </div>
            <!-- End Header Navigation -->

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="navbar-menu">
                <ul class="nav navbar-nav navbar-right" data-in="" data-out="fadeOut">
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Home</a>
                        <ul class="dropdown-menu">
                            <li><a href="http://themekolor.co/2018/index.html">New For 2018</a></li>
                            <li class="active"><a href="http://themekolor.co/enterprise/index.html">Enterprise Version</a></li>
                            <li><a href="http://themekolor.host">WHMCS Version</a></li>
                        </ul>
                    </li>
                    <li class="dropdown megamenu-fw">
                        <a href="#" class="dropdown-toggle before" data-toggle="dropdown">Hosting</a>
                        <ul class="dropdown-menu megamenu-content" role="menu">
                            <li>
                                <div class="row">
                                    <div class="col-menu col-md-3">
                                        <h6 class="title">Wordpress Hosting</h6>
                                        <div class="content">
                                            <img src="img/megamenu/wp.jpg" alt="ColorHosting" class="img-responsive">
                                            <h5>Starting from <b>$29.99</b></h5>
                                            <p>High performance hosting</p>
                                            <a href="wordpress-hosting.html" class="button btn btn-outline">Buy Now</a>
                                        </div>
                                    </div>
                                    <!-- end col-3 -->
                                    <div class="col-menu col-md-3">
                                        <h6 class="title">Cloud Hosting</h6>
                                        <div class="content">
                                            <img src="img/megamenu/cloud.jpg" alt="ColorHosting" class="img-responsive">
                                            <h5>Starting from <b>$11.99</b></h5>
                                            <p>High performance Cloud hosting</p>
                                            <a href="cloud-hosting.html" class="button btn btn-outline">Buy Now</a>
                                        </div>
                                    </div>
                                    <!-- end col-3 -->
                                    <div class="col-menu col-md-3">
                                        <h6 class="title">Virtual servers</h6>
                                        <div class="content">
                                            <img src="img/megamenu/vps.jpg" alt="ColorHosting" class="img-responsive">
                                            <h5>Starting from <b>$19.99</b></h5>
                                            <p>High performance VPS hosting</p>
                                            <a href="vps-hosting.html" class="button btn btn-outline">Buy Now</a>
                                        </div>
                                    </div>
                                    <div class="col-menu col-md-3">
                                        <h6 class="title">Dedicated Servers</h6>
                                        <div class="content dedicated">
                                            <h2>SALE 50%</h2>
                                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                            <a href="dedicated.html" class="button btn btn-outline">Read More</a>
                                        </div>
                                    </div>
                                    <!-- end col-3 -->
                                </div>
                                <!-- end row -->
                            </li>
                        </ul>
                    </li>
                    <li class="active">
                        <a href="web-development.html">Web Design <span class="new">NEW</span></a>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Features</a>
                        <ul class="dropdown-menu">
                            <li><a href="testimonials.html">Testimonials</a></li>
                            <li><a href="boxes.html">Style Boxes</a></li>
                            <li><a href="headers.html">Page Headers</a></li>
                            <li><a href="pricing.html">Pricing Tables</a></li>
                            <li><a href="contact.html">Working Contact Form</a></li>
                        </ul>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Pages</a>
                        <ul class="dropdown-menu">
                            <li><a href="error404.html">404 Error</a></li>
                            <li><a href="about.html">About Us</a></li>
                            <li><a href="contact.html">Contact Page</a></li>
                            <li><a href="web-development.html">Web Development</a></li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">Hosting</a>
                                <ul class="dropdown-menu">
                                    <li><a href="wordpress-hosting.html">Wordpress Hosting</a></li>
                                    <li><a href="cloud-hosting.html">Cloud Hosting</a></li>
                                    <li><a href="dedicated.html">Dedicated Servers</a></li>
                                    <li><a href="vps-hosting.html">Virtual Servers</a></li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                    <li><a href="contact.html">Contact</a></li>
                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </div>

        <!-- Side Menu -->
        <div class="side">
            <a href="#" class="close-side"><i class="fa fa-times"></i></a>
            <div class="widget">
                <h6 class="title">OUR COMPANY</h6>
                <ul class="link">
                    <li><a href="#">About</a></li>
                    <li><a href="#">Services</a></li>
                    <li><a href="#">Blog</a></li>
                    <li><a href="#">Portfolio</a></li>
                    <li><a href="#">Contact</a></li>
                </ul>
            </div>
            <div class="widget">
                <h6 class="title">WHY TERAHOSTER</h6>
                <ul class="link">
                    <li><a href="#">Modern and Clean</a></li>
                    <li><a href="#">Smooth Scroll</a></li>
                    <li><a href="#">Parallax Effect</a></li>
                    <li><a href="#">Easy to Costumize</a></li>
                    <li><a href="#">Multiple Pages</a></li>
                </ul>
            </div>
        </div>
        <!-- End Side Menu -->
    </nav>
    <!-- End Navigation -->

    <!-- start of section -->
    <section class="web-header" data-speed="0.4">
        <div class="container">
            <div class="col-sm-6 col-xs-12">
                <div class="box-container fadesimple">
                    <h3>Some major reasons</h3>
                    <h2>Why we are the best</h2>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio numquam quo iure dolor nisi obcaecati maiores, officia incidunt. Assumenda inventore eaque ratione beatae animi dolore optio atque, tenetur in molestias!officia incidunt.
                        Assumenda inventore eaque ratione beatae animi dolore optio atque, tenetur in molestias!</p>
                    <a href="#" class="btn button btn-2">Get a free Quote</a>
                </div>
            </div>
            <div class="col-sm-6"></div>
        </div>
    </section>
    <!-- end of section -->

    <!-- start of section -->
    <section class="why-tera">
        <div class="container">
            <div class="default-title">
                <h3>What Makes Tera Hoster Awesome</h3>
                <p>We are so proud that we have greatest services</p>
            </div>
            <div class="col-sm-4">
                <div class="box sl1 fadesimple">
                    <h4 class="wt-1">Big DataCenter</h4>
                    <hr>
                    <ul class="wt-list">
                        <li class="wtl-1">1gb/s port internet</li>
                        <li class="wtl-2">Based on Cloud Technology</li>
                        <li class="wtl-3">Latest Web Servers</li>
                        <li class="wtl-4">Professional Teamwork</li>
                    </ul>
                    <a href="#" class="btn button btn-lg btn-2 red">Read More</a>
                    <a href="#" class="btn button btn-lg btn-2">Buy Now</a>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="box sl2 fadesimple">
                    <h4 class="wt-2">Latest Servers</h4>
                    <hr>
                    <ul class="wt-list">
                        <li class="wtl-5">Multi Core CPU</li>
                        <li class="wtl-6">Based on SSD Space</li>
                        <li class="wtl-7">10TB Guranted Bandwidth</li>
                        <li class="wtl-8">Unlimited Free Support</li>
                    </ul>
                    <a href="#" class="btn button btn-lg btn-2 red">Read More</a>
                    <a href="#" class="btn button btn-lg btn-2">Buy Now</a>
                </div>
            </div>
            <div class="col-sm-4">
                <div class="box sl3 fadesimple">
                    <h4 class="wt-3">Web Development</h4>
                    <hr>
                    <ul class="wt-list">
                        <li class="wtl-9">Modern and Clean</li>
                        <li class="wtl-10">Latest web framework</li>
                        <li class="wtl-11">Professional Code</li>
                        <li class="wtl-12">Unique Web Design</li>
                    </ul>
                    <a href="#" class="btn button btn-lg btn-2 red">Read More</a>
                    <a href="#" class="btn button btn-lg btn-2">Buy Now</a>
                </div>
            </div>
        </div>
    </section>
    <!-- end of section -->

    <!-- start of section -->
    <section class="arrow-bg">
        <div class="arrow-f5-top"></div>
    </section>
    <section id="df-media">
        <div class="container">
            <div class="row">
                <div class="col-sm-6 fadesimple">
                    <img alt="Dedicated Hosting" src="img/other/03.png" class="img-responsive">
                </div>
                <div class="col-sm-6 fadesimple">
                    <div class="default-title">
                        <h3>Powerful SSD Virtual <span>Hosting</span></h3>
                    </div>
                    <ul>
                        <li>Unlimited Banwidth with 1gb/s network connection</li>
                        <li>Unlimited SSD Space with latest technology</li>
                        <li>Professional E-mail Hosting</li>
                        <li>All servers are protected by powerful anti-DDos</li>
                    </ul>
                    <a href="#" class="btn button btn-2 red btn-lg">Buy Now</a>
                    <a href="#" class="btn button btn-2 btn-lg">Read More</a>
                </div>
            </div>
        </div>
    </section>
    <!-- section end -->


    <!-- section start -->
    <section class="timeline">
        <div class="container">
            <ul class="timeline">
                <li>
                    <div class="timeline-badge"><i class="fa fa-paint-brush" aria-hidden="true"></i></div>
                    <div class="timeline-panel fadesimple">
                        <div class="timeline-heading">
                            <h4 class="timeline-title">Web Design</h4>
                        </div>
                        <div class="timeline-body">
                            <p>Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio..</p>
                        </div>
                    </div>
                </li>
                <li class="timeline-inverted fadesimple">
                    <div class="timeline-badge"><i class="fa fa-html5" aria-hidden="true"></i></div>
                    <div class="timeline-panel">
                        <div class="timeline-heading">
                            <h4 class="timeline-title">Web Development</h4>
                        </div>
                        <div class="timeline-body">
                            <p>Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio, in elementis mé pra quem é amistosis
                                quis leo.</p>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="timeline-badge"><i class="fa fa-shopping-basket" aria-hidden="true"></i></div>
                    <div class="timeline-panel fadesimple">
                        <div class="timeline-heading">
                            <h4 class="timeline-title">e-Commerce and Security</h4>
                        </div>
                        <div class="timeline-body">
                            <p>Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio.</p>
                        </div>
                    </div>
                </li>
                <li class="timeline-inverted fadesimple">
                    <div class="timeline-badge"><i class="fa fa-code" aria-hidden="true"></i></div>
                    <div class="timeline-panel">
                        <div class="timeline-heading">
                            <h4 class="timeline-title">Web App Development</h4>
                        </div>
                        <div class="timeline-body">
                            <p>Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio, in elementis mé pra quem é amistosis
                                quis leo.</p>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="timeline-badge"><i class="fa fa-server" aria-hidden="true"></i></div>
                    <div class="timeline-panel fadesimple">
                        <div class="timeline-heading">
                            <h4 class="timeline-title">Web Hosting and Domain</h4>
                        </div>
                        <div class="timeline-body">
                            <p>Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis, nisi eros vermeio, in elementis mé pra quem é amistosis quis leo.</p>
                        </div>
                    </div>
                </li>
                <li class="timeline-inverted fadesimple">
                    <div class="timeline-badge"><i class="fa fa-lock" aria-hidden="true"></i></div>
                    <div class="timeline-panel">
                        <div class="timeline-heading">
                            <h4 class="timeline-title">Web Server Security</h4>
                        </div>
                        <div class="timeline-body">
                            <p>Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis.</p>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="timeline-badge"><i class="fa fa-wordpress" aria-hidden="true"></i></div>
                    <div class="timeline-panel fadesimple">
                        <div class="timeline-heading">
                            <h4 class="timeline-title">Wordpress Expert</h4>
                        </div>
                        <div class="timeline-body">
                            <p>Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis, nisi eros vermeio, in elementis mé pra quem é amistosis quis leo.</p>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </section>
    <!-- end of section -->

    <section class="search-bar sb2">
        <div class="container sb">
            <div class="col-sm-3">
                <img src="img/other/domain.png" class="img-responsive" alt="">
            </div>
            <div class="col-md-8">
                <!-- Search Form -->
                <form>
                    <!-- Search Field -->
                    <div class="row fadesimple">
                        <div class="default-title">
                            <h3>Begin the search for your domain</h3>
                            <p>Register your domain idea before anyone else does</p>
                        </div>
                        <div class="form-group">
                            <div class="input-group">
                                <input class="form-control bar" type="text" name="search" placeholder="Enter your domain name..." required/>
                                <span class="input-group-btn">
                            <button class="btn button btn-2 btn-lg">Serach Domain</button>
                                </span>
                            </div>
                            <div class="ltds">
                                <div class="col-sm-2 col-xs-1 border-right1">
                                    <p>.com <span>$12.99</span></p>
                                </div>
                                <div class="col-sm-2 col-xs-1 border-right2">
                                    <p>.org <span>$9.99</span></p>
                                </div>
                                <div class="col-sm-2 col-xs-1 border-right3">
                                    <p>.net <span>$11.99</span></p>
                                </div>
                                <div class="col-sm-2 col-xs-1 border-right4">
                                    <p>.info <span>$6.99</span></p>
                                </div>
                                <div class="col-sm-2 col-xs-1 border-right5">
                                    <p>.us <span>$9.99</span></p>
                                </div>
                                <div class="col-sm-2 col-xs-1 border-right6">
                                </div>
                            </div>
                        </div>
                    </div>

                </form>
                <!-- End of Search Form -->
            </div>
        </div>
    </section>
    <!-- end of section -->

    <!-- start of section -->
    <section class="media-code-2">
        <div class="container fadesimple wp-con1">
            <div class="row">
                <div class="col-sm-6 col-xs-6 mi">
                    <img src="img/hosting/03.png" class="img-responsive" alt="web development">
                </div>
                <div class="col-sm-6 col-xs-6 wp-text">
                    <h2>Professional and Modern Design</h2>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus quibusdam laudantium aliquam nesciunt veritatis minus, dolorum quas ut incidunt at alias repellat quam, sunt nisi, deserunt libero accusamus iste excepturi!</p>
                    <a href="#" class="btn button btn-2 red btn-lg">Read More</a>
                    <a href="#" class="btn btn-2 button btn-2 btn-lg">Buy Now</a>
                </div>
            </div>
        </div>
        <!-- container -->
    </section>
    <!-- end of section -->
    <section class="trng-bg for-df">
        <div class="trng trng-df"></div>
    </section>
    <!-- start of section -->
    <section class="media-code-1">
        <div class="container fadesimple wp-con1">
            <div class="row">
                <div class="col-sm-6 col-xs-6 wp-text">
                    <h2>Latest Cloud Hosting Technology</h2>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus quibusdam laudantium aliquam nesciunt veritatis minus, dolorum quas ut incidunt at alias repellat quam, sunt nisi, deserunt libero accusamus iste excepturi!</p>
                    <a href="#" class="btn button btn-2 red btn-lg">Read More</a>
                    <a href="#" class="btn btn-2 button btn-lg">Buy Now</a>
                </div>
                <div class="col-sm-6 col-xs-6 mi">
                    <img src="img/hosting/cloud.png" class="img-responsive" alt="Wordpress Hosting">
                </div>
            </div>
        </div>
        <!-- container -->
    </section>
    <!-- end of section -->

    <div class="line-part"></div>

    <!-- start of section -->
    <section id="cl-web">
        <div class="default-title">
            <h3>WHY TERA HOSTER</h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
        </div>
        <div class="container fadesimple">
            <div class="col-sm-12 fit-center-col-web">
                <div class="col-sm-12 col-xs-12 cl-box hvr-float-shadow">
                    <i class="fa fa-envelope fa-3x" aria-hidden="true"></i>
                    <h3>Support</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-cogs fa-3x" aria-hidden="true"></i>
                    <h3>Professional</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-heart fa-3x" aria-hidden="true"></i>
                    <h3>With Love</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-server fa-3x" aria-hidden="true"></i>
                    <h3>Fast Servers</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-cloud fa-3x" aria-hidden="true"></i>
                    <h3>Cloud Hosting</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-hdd-o fa-3x" aria-hidden="true"></i>
                    <h3>SSD Space</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-globe fa-3x" aria-hidden="true"></i>
                    <h3>Free domain</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-microchip fa-3x" aria-hidden="true"></i>
                    <h3>Xenon CPU</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-shopping-cart fa-3x" aria-hidden="true"></i>
                    <h3>e-Commerce</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
                <div class="col-sm-12 col-xs-6 cl-box hvr-float-shadow">
                    <i class="fa fa-line-chart fa-3x" aria-hidden="true"></i>
                    <h3>Live Stats</h3>
                    <p class="hidden-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                </div>
            </div>
        </div>
    </section>
    <!-- end of sction -->

    <div class="line-part"></div>

    <!-- contact us -->
    <section id="contact-us">
        <div class="default-title">
            <h3>GET A FREE QUOTE</h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
        </div>
        <!-- message content -->
        <div class="container fadesimple">
            <div class="col-sm-8">
                <form action="/php/contact.php" id="contact-form" method="post" name="contact-form">
                    <div class="messages"></div>
                    <div class="controls">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="form_name">Firstname *</label> <input class="form-control" data-error="Firstname is required." id="form_name" name="name" placeholder="Your firstname *" required="required" type="text">
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="form_lastname">Lastname *</label> <input class="form-control" data-error="Lastname is required." id="form_lastname" name="surname" placeholder="Your lastname *" required="required" type="text">
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="form_email">Email *</label> <input class="form-control" data-error="Valid email is required." id="form_email" name="email" placeholder="Your email *" required="required" type="email">
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="form_phone">Phone</label> <input class="form-control" id="form_phone" name="phone" placeholder="Your phone" type="tel">
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label for="form_message">Message *</label>
                                    <textarea class="form-control" data-error="Please,leave us a message." id="form_message" name="message" placeholder="Message*" required="required" rows="4"></textarea>
                                    <div class="help-block with-errors"></div>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <input class="btn btn-warning btn-send" type="submit" value="Send message">
                            </div>
                        </div>
                        <div class="row"></div>
                    </div>
                </form>
            </div>
            <!-- end of message content -->
            <div class="col-sm-4 contact-info">
                <!-- header contact info -->
                <div class="col-sm-12">
                    <hr>
                    <div class="col-sm-12">
                        <p class="email">hello@themekolor.co</p>
                        <p class="phone">Phone : 1-855-435-8226</p>
                        <p class="chat"><a href="#">Live Chat</a></p>
                        <p class="ticket"><a href="/contact.html">Send a Ticket</a></p>
                    </div>
                    <!-- end of header info -->
                </div>
            </div>
        </div>
        <!-- container -->
    </section>
    <!-- contact-us / end -->

    <!-- ===== FOOTER ===== -->
    <!-- start of section -->
    <section id="contact-parts">
        <div class="container-fluid">
            <div class="col-sm-6 contact-p1">
                <h2>CALL US : +1-855-435-8226</h2>
            </div>
            <div class="col-sm-6 contact-p2">
                <h2>hello@themekolor.co</h2>
            </div>
        </div>
    </section>
    <!-- end of first section -->
    <footer>
        <div class="container-fluid footer-fluid">
            <div class="container-fluid partners">
                <div class="col-sm-2 col-xs-6">
                    <img src="img/other/envato.png" class="img-responsive" alt="Hosting Template">
                </div>
                <div class="col-sm-2 col-xs-6">
                    <img src="img/other/envato.png" class="img-responsive" alt="Hosting Template">
                </div>
                <div class="col-sm-2 col-xs-6">
                    <img src="img/other/envato.png" class="img-responsive" alt="Hosting Template">
                </div>
                <div class="col-sm-2 col-xs-6">
                    <img src="img/other/envato.png" class="img-responsive" alt="Hosting Template">
                </div>
                <div class="col-sm-2 col-xs-6">
                    <img src="img/other/envato.png" class="img-responsive" alt="Hosting Template">
                </div>
                <div class="col-sm-2 col-xs-6">
                    <img src="img/other/envato.png" class="img-responsive" alt="Hosting Template">
                </div>
            </div>
            <div class="row">
                <!-- row -->
                <div class="col-lg-4 col-md-4 col-sm-3">
                    <!-- widgets column left -->
                    <ul class="list-unstyled clear-margins">
                        <!-- widgets -->
                        <li class="widget-container widget_nav_menu">
                            <!-- widgets list -->
                            <h2 class="title-widget">About Tera Hoster</h2>
                            <p>Tera Hoster is a clean,unique,colorful,professional and fully responsive Web Hosting Template.It looks perfect on all major browsers, tablets and smartphones.Tera Hoster is definitely a perfect solution for your web project.Buy
                                now and start doing business.</p>
                        </li>
                    </ul>
                </div>
                <!-- widgets column left end -->
                <div class="col-lg-2 col-md-2 col-sm-3 col-xs-6">
                    <!-- widgets column left -->
                    <ul class="list-unstyled clear-margins">
                        <!-- widgets -->
                        <li class="widget-container widget_nav_menu">
                            <!-- widgets list -->
                            <h2 class="title-widget">Services</h2>
                            <ul>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Web Hosting</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Managed Services</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  VPS Servers</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Dedicated Servers</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Cloud Hosting</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  e-Commerce Development</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Web Development</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-3 col-xs-6">
                    <!-- widgets column left -->
                    <ul class="list-unstyled clear-margins">
                        <!-- widgets -->
                        <li class="widget-container widget_nav_menu">
                            <!-- widgets list -->
                            <h2 class="title-widget">Hosting</h2>
                            <ul>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Virtual Servers</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Dedicated Servers</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Cloud Hosting</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Shared Hosting</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Wordpress Hosting</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  PrestaShop</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Magento</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i> Managed Servers</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
                <!-- widgets column left end -->
                <div class="col-lg-2 col-md-2 col-sm-3 col-xs-6">
                    <!-- widgets column left -->
                    <ul class="list-unstyled clear-margins">
                        <!-- widgets -->
                        <li class="widget-container widget_nav_menu">
                            <!-- widgets list -->
                            <h2 class="title-widget">Development</h2>
                            <ul>
                                <li><a href="#"><i class="fa fa-angle-right"></i> Web Design</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i> Web App Development</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i> e-Commerce</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i> Business Templates</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i> Theme Development</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i> Business Web Site</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  Wordpress Blogger</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>  News and Media</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
                <!-- widgets column left end -->
                <div class="col-lg-2 col-md-2 col-sm-6 col-xs-6">
                    <!-- widgets column center -->
                    <ul class="list-unstyled clear-margins">
                        <!-- widgets -->
                        <li class="widget-container widget_recent_news">
                            <!-- widgets list -->
                            <h2 class="title-widget">Contact </h2>
                            <div class="footerp">
                                <img src="img/logo/logowhite.png" class="img-responsive" alt="Hosting Template">
                                <br>
                                <h2 class="title-median">Hosting Company</h2>
                                <p>Email: <a href="mailto:hello@themekolor.co">info@themekolor.co</a></p>
                                <p>Helpline Numbers: +1-855-435-8226</p>
                                <p>California State Merced,W 16th ST</p>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </footer>

    <div class="footer-bottom">

        <div class="container">

            <div class="row">

                <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 half">

                    <div class="copyright">

                        © 2017, themekolor, All rights reserved

                    </div>

                </div>

                <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 half">

                    <div class="design">
                        <a href="#">Terms of Use</a> | <a href="#"> Privacy Policy</a> | <a href="#"> Sitemap</a>
                    </div>
                </div>

            </div>

        </div>

    </div>
    <!-- ===== FOOTER / END ===== -->

    <!-- javascript -->
    <script src="javascript/jquery-3.1.1.min.js"></script>
    <script src="javascript/jquery.scroll-with-ease.min.js"></script>
    <script src="javascript/contact.js"></script>
    <script src="javascript/color-switcher.js"></script>
    <script src="javascript/parallax.js"></script>
    <script src="javascript/bootsnav.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="javascript/javascript.js"></script>
    <!-- javascript -->
</body>

</html>