View file HostBlue/HostBlue Download/hostblue-html/index.html

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

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Blue - Responsive Hosting & Technology Site Template</title>
    <link href="https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,400i,500,600,700,800,900" rel="stylesheet">
    <link href="css/slicknav.min.css" rel="stylesheet">
    <link href="css/magnific-popup.css" rel="stylesheet">
    <link href="css/owl.carousel.min.css" rel="stylesheet">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/font-awesome.min.css" rel="stylesheet">
    <link href="css/animate.min.css" rel="stylesheet">
    <link href="style.css" rel="stylesheet">
    <link href="css/responsive.css" rel="stylesheet">
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->
</head>

<body>
    <!-- preloader start -->
    <div id="cssload-wrapper">
        <div class="cssload-loader">
            <div class="cssload-line"></div>
            <div class="cssload-line"></div>
            <div class="cssload-line"></div>
            <div class="cssload-line"></div>
            <div class="cssload-line"></div>
            <div class="cssload-line"></div>
            <div class="cssload-subline"></div>
            <div class="cssload-subline"></div>
            <div class="cssload-subline"></div>
            <div class="cssload-subline"></div>
            <div class="cssload-subline"></div>
            <div class="cssload-loader-circle-1">
                <div class="cssload-loader-circle-2"></div>
            </div>
            <div class="cssload-needle"></div>
            <div class="cssload-loading">loading</div>
        </div>
    </div>
    <!-- preloader End -->

    <!-- header start -->
    <div class="header-area">
        <div class="container">
            <div class="row">
                <div class="col-sm-1 col-xs-3 logo">
                    <a href="index.html"><img src="img/logo.png" data-retina="img/logo2.png" alt=""></a>
                </div>
                <div class="col-sm-8 col-xs-9 mainmenu">
                    <ul id="mainmenu">
                            <li><a href="#">Homepages</a>
                                <ul class="drop-menu">
                                    <li><a href="index.html">Home v1</a></li>
                                    <li><a href="index-2.html">Home v2</a></li>
                                </ul>
                            </li>
                            <li><a href="#">Company</a>
                                <ul class="drop-menu">
                                    <li><a href="about.html">About us</a></li>
                                    <li><a href="team.html">Team</a></li>
                                    <li><a href="jobs.html">Career</a></li>
                                </ul>
                            </li>
                            <li><a href="#">Products</a>
                                <ul class="drop-menu">
                                    <li><a href="product-details-1.html">Shared hosting</a></li>
                                    <li><a href="product-details-2.html">Cloud Hosting</a></li>
                                    <li><a href="product-details-3.html">Wordpress hosting</a></li>
                                    <li><a href="product-details-4.html">Dedicated hosting</a></li>
                                </ul>
                            </li>
                            <li><a href="domain.html">Domain</a></li>
                            <li><a href="services.html">Pricing</a></li>
                            <li><a href="#">Pages</a>
                            <ul class="drop-menu">
                                <li><a href="index.html">Home v1</a></li>
                                <li><a href="index-2.html">Home v2</a></li>
                                <li><a href="about.html">About us</a></li>
                                <li><a href="domain.html">Domain</a></li>
                                <li><a href="signup.html">SignUp</a></li>
                                <li><a href="login.html">Login</a></li>
                                <li><a href="faq.html">FAQ</a></li>
                                <li><a href="team.html">Team</a></li>
                                <li><a href="jobs.html">Career</a></li>
                                <li><a href="product-details.html">Product Details</a></li>
                                <li><a href="contact.html">Contact</a></li>
                            </ul>
                            </li>
                        </ul>
                </div>
                <div class="col-sm-3 col-xs-6 header-right">
                    <div class="login-btn-area"> <a href="#" class="login-btn">Log In</a> </div>
                    <div class="account-btn"> <a href="#" class="create-account-btn button-hover">create an account</a> </div>
                </div>
            </div>
        </div>
    </div>
    <!-- header End -->
    <!-- hero start -->
    <div class="hero-area">
        <div class="banner-area">
            <div class="container">
                <div class="row">
                    <div class="col-sm-6">
                        <div class="hero-area-content fadeIn wow" data-wow-delay="0.2s">
                            <h4>Starting at $2.95/month*</h4>
                            <h1>Award-winning<br> Web & WordPress Hosting</h1>
                            <ul class="hero-option-menu">
                                <li><span><i class="fa fa-check"></i></span>Free Domain</li>
                                <li><span><i class="fa fa-check"></i></span>Free Website Builder</li>
                                <li><span><i class="fa fa-check"></i></span>High Performance SSD Server</li>
                                <li><span><i class="fa fa-check"></i></span>Awesome customer support</li>
                            </ul>
                            <a href="" class="getstarted-btn button-hover hero-btn">Get Started Now</a> </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="hero-img"><img src="img/hero-img.png" alt=""></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- hero End -->
    <!-- pricing start -->
    <section class="pricing-area section-padding">
        <div class="container">
            <div class="section-heading">
                <div class="row">
                    <div class="col-md-12">
                        <div class="section-title-heading">
                            <h2>Affordable pricing for you</h2>
                            <p>Our WordPress hosting plans include easy setup, automated updates and backups, 100%
                                <br> network uptime with no bandwidth limitations and 24/7 WordPress support. Use any
                                <br> WordPress theme or plugin you want. <span class="blue-text">Starting at $7.95/mo</span></p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="switch-btn-area">
                <div class="row">
                    <div class="col-md-12">
                        <div class="switch-btns">
                            <!-- Rectangular switch -->
                            <label class="switch">
                                <input class="switch-input" type="checkbox" />
                                <span class="switch-label" data-on="Monthly" data-off="Yearly"></span> <span class="switch-handle button-hover"></span>
                                <span class="discount">Save 20% </span>
                            </label>
                        </div>
                    </div>
                </div>
            </div>
            <div class="price-area fadeIn wow" data-wow-delay="0.15s">
                <div class="row">
                    <div class="col-md-12 price-silder-wrapper">
                        <div class="single-price-slide">
                            <div class="single-price">
                                <div class="price-quality">
                                    <h4>Basic</h4>
                                    <h2>$3/mo</h2>
                                </div>
                                <div class="price-details">
                                    <ul>
                                        <li>20GB SSD</li>
                                        <li>Unlimited bandwidth</li>
                                        <li>Up to 3 websites</li>
                                    </ul>
                                    <div class="get-btn-area">
                                        <a href="" class="price-btn button-hover">Get Started Now</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="single-price-slide">
                            <div class="single-price">
                                <div class="price-quality">
                                    <h4>Premium</h4>
                                    <h2>$9/mo</h2>
                                </div>
                                <div class="price-details">
                                    <ul>
                                        <li>50GB SSD</li>
                                        <li>Unlimited bandwidth</li>
                                        <li>Up to 10 websites</li>
                                    </ul>
                                    <div class="get-btn-area">
                                        <a href="" class="price-btn button-hover">Get Started Now</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="single-price-slide">
                            <div class="single-price">
                                <div class="price-quality">
                                    <h4>Company</h4>
                                    <h2>$19/mo</h2>
                                </div>
                                <div class="price-details">
                                    <ul>
                                        <li>100GB SSD</li>
                                        <li>Unlimited bandwidth</li>
                                        <li>Up to 50 websites</li>
                                    </ul>
                                    <div class="get-btn-area">
                                        <a href="" class="price-btn button-hover">Get Started Now</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="single-price-slide">
                            <div class="single-price">
                                <div class="price-quality">
                                    <h4>Enterprise</h4>
                                    <h2>$49/mo</h2>
                                </div>
                                <div class="price-details">
                                    <ul>
                                        <li>1TB SSD</li>
                                        <li>Unlimited bandwidth</li>
                                        <li>Up to 100 websites</li>
                                    </ul>
                                    <div class="get-btn-area">
                                        <a href="" class="price-btn button-hover">Get Started Now</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- pricing End -->
    <!-- product start -->
    <section class="product-area section-padding">
        <div class="container">
            <div class="section-heading">
                <div class="row">
                    <div class="col-md-12">
                        <div class="section-title-heading">
                            <h2>Affordable pricing for you</h2>
                            <p>We have powerful products which can help you for managing your digital services.
                                <br>Start your journey by selecting one of our products and get promising and secure system for
                                <br> your digital products and services.</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="product-contents fadeIn wow" data-wow-delay="0.1s">
                <div class="row">
                    <div class="col-md-3 col-xs-6">
                        <a href="#" class="single-product">
                            <div class="single-product-img">
                                <img src="img/product-img1.png" alt="">
                            </div>
                            <h4>Cloud Hosting</h4>
                        </a>
                    </div>
                    <div class="col-md-3 col-xs-6">
                        <a href="#" class="single-product">
                            <div class="single-product-img">
                                <img src="img/product-img2.png" alt="">
                            </div>
                            <h4>Web Hosting</h4>
                        </a>
                    </div>
                    <div class="col-md-3 col-xs-6">
                        <a href="#" class="single-product">
                            <div class="single-product-img">
                                <img src="img/product-img3.png" alt="">
                            </div>
                            <h4>Shared Hosting</h4>
                        </a>
                    </div>
                    <div class="col-md-3 col-xs-6">
                        <a href="#" class="single-product">
                            <div class="single-product-img">
                                <img src="img/product-img4.png" alt="">
                            </div>
                            <h4>VPS Server</h4>
                        </a>
                    </div>
                    <div class="col-md-3 col-xs-6">
                        <a href="#" class="single-product">
                            <div class="single-product-img">
                                <img src="img/product-img5.png" alt="">
                            </div>
                            <h4>VPS Server</h4>
                        </a>
                    </div>

                </div>
            </div>
        </div>
    </section>
    <!-- product End -->
    <!-- service start -->
    <section class="service-area">
        <div class="container">
            <div class="row service-top-area">
                <div class="col-md-4 col-sm-6 fadeIn wow" data-wow-delay="0.12s">
                    <div class="single-service">
                        <div class="service-img">
                            <img src="img/service-img1.png" alt="">
                        </div>
                        <h3>Fastest Server</h3>
                        <p>The first and only all-SSD cloud. Whether it's our Droplet compute instances or Block Storage, everything runs on SSD.</p>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 fadeIn wow" data-wow-delay="0.13s">
                    <div class="single-service">
                        <div class="service-img">
                            <img src="img/service-img2.png" alt="">
                        </div>
                        <h3>99.99% Server Uptime</h3>
                        <p>The first and only all-SSD cloud. Whether it's our Droplet compute instances or Block Storage, everything runs on SSD.</p>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 fadeIn wow" data-wow-delay="0.14s">
                    <div class="single-service">
                        <div class="service-img">
                            <img src="img/service-img3.png" alt="">
                        </div>
                        <h3>Cloud Access</h3>
                        <p>The first and only all-SSD cloud. Whether it's our Droplet compute instances or Block Storage, everything runs on SSD.</p>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 fadeIn wow" data-wow-delay="0.16s">
                    <div class="single-service">
                        <div class="service-img">
                            <img src="img/service-img4.png" alt="">
                        </div>
                        <h3>Server Monitoring</h3>
                        <p>The first and only all-SSD cloud. Whether it's our Droplet compute instances or Block Storage, everything runs on SSD.</p>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 fadeIn wow" data-wow-delay="0.18s">
                    <div class="single-service">
                        <div class="service-img">
                            <img src="img/service-img5.png" alt="">
                        </div>
                        <h3>Easy Maintaince</h3>
                        <p>The first and only all-SSD cloud. Whether it's our Droplet compute instances or Block Storage, everything runs on SSD.</p>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 fadeIn wow" data-wow-delay="0.2s">
                    <div class="single-service">
                        <div class="service-img">
                            <img src="img/service-img6.png" alt="">
                        </div>
                        <h3>Secured Service</h3>
                        <p>The first and only all-SSD cloud. Whether it's our Droplet compute instances or Block Storage, everything runs on SSD.</p>
                    </div>
                </div>
            </div>
            <div class="service-btm-area">
                <div class="row">
                    <div class="col-md-9">
                        <div class="service-btm-text">
                            <h3>On our web server, feel safe like home! Besides we use SSD Hard Drive for <br> all our servers. Get super speed for your website. <span class="bold-text">Get started from $0.99/mo.</span></h3>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="service-get-btn">
                            <a href="#" class="getstarted-btn button-hover">Get started now</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- service End -->
    <!-- map start -->
    <section class="map-area">
        <div class="container section-padding">
            <div class="section-heading">
                <div class="row">
                    <div class="col-md-8 col-md-offset-2">
                        <div class="section-title-heading">
                            <h2>Our Global Footprint Brings The Cloud To You!</h2>
                            <p>We have powerful products which can help you for managing your digital services. Start your journey by selecting
                                <br> one of our products and get promising and secure system for your digital products and services.</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row fadeIn wow" data-wow-delay="0.1s">
                <div class="col-md-8 col-md-offset-2 map-location-area">
                    <div class="our-brances ">
                        <div class="single-location toronto">
                            <h6>Toronto</h6>
                            <div class="Dropdown-content">
                                <div class="map-dropdown-title">
                                    <p>Speed Test</p>
                                </div>
                                <div class="map-dropdown-address">
                                    <a href="#">NYC1</a>
                                    <br>
                                    <a href="#">NYC2</a>
                                    <br>
                                    <a href="">NYC3</a>
                                </div>
                            </div>
                        </div>
                        <div class="single-location sanfrancisco">
                            <h6>San Francisco</h6>
                            <div class="Dropdown-content">
                                <div class="map-dropdown-title">
                                    <p>Speed Test</p>
                                </div>
                                <div class="map-dropdown-address">
                                    <a href="#">NYC1</a>
                                    <br>
                                    <a href="#">NYC2</a>
                                    <br>
                                    <a href="">NYC3</a>
                                </div>
                            </div>
                        </div>
                        <div class="single-location newyork">
                            <h6>New York</h6>
                            <div class="Dropdown-content">
                                <div class="map-dropdown-title">
                                    <p>Speed Test</p>
                                </div>
                                <div class="map-dropdown-address">
                                    <a href="#">NYC1</a>
                                    <br>
                                    <a href="#">NYC2</a>
                                    <br>
                                    <a href="">NYC3</a>
                                </div>
                            </div>
                        </div>
                        <div class="single-location london">
                            <h6>London</h6>
                            <div class="Dropdown-content">
                                <div class="map-dropdown-title">
                                    <p>Speed Test</p>
                                </div>
                                <div class="map-dropdown-address">
                                    <a href="#">NYC1</a>
                                    <br>
                                    <a href="#">NYC2</a>
                                    <br>
                                    <a href="">NYC3</a>
                                </div>
                            </div>
                        </div>
                        <div class="single-location singapore">
                            <h6>Singapore</h6>
                            <div class="Dropdown-content">
                                <div class="map-dropdown-title">
                                    <p>Speed Test</p>
                                </div>
                                <div class="map-dropdown-address">
                                    <a href="#">NYC1</a>
                                    <br>
                                    <a href="#">NYC2</a>
                                    <br>
                                    <a href="">NYC3</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <a href="" class="getstarted-btn button-hover">Get Started Now</a>
                </div>
            </div>
        </div>
    </section>

    <!-- map End -->
    <!-- brand start -->
    <section class="brand-area section-padding">
        <div class="container">
            <div class="section-heading">
                <div class="row">
                    <div class="col-md-8 col-md-offset-2">
                        <div class="section-title-heading">
                            <h2>Join over 1,00,000 brands on Blue</h2>
                            <p>We have powerful products which can help you for managing your digital services. Start your journey by selecting
                                <br> one of our products and get promising and secure system for your digital products and services.</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="brand-area-top fadeIn wow" data-wow-delay="0.2s">
                <div class="row">
                    <div class="col-md-10 col-md-offset-1">
                        <div class="row">
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand">
                                    <img src="img/brand-img1.png" alt="">
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand">
                                    <img src="img/brand-img2.png" alt="">
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand">
                                    <img src="img/brand-img3.png" alt="">
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand">
                                    <img src="img/brand-img4.png" alt="">
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand">
                                    <img src="img/brand-img5.png" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="brand-area-bottom fadeIn wow" data-wow-delay="0.3s">
                <div class="row">
                    <div class="col-md-8 col-md-offset-2 col-sm-10 col-sm-offset-1">
                        <div class="row">
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand single-brand-bottom">
                                    <img src="img/brand-img6.png" alt="">
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand single-brand-bottom">
                                    <img src="img/brand-img7.png" alt="">
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand single-brand-bottom">
                                    <img src="img/brand-img8.png" alt="">
                                </div>
                            </div>
                            <div class="col-sm-3 col-xs-6">
                                <div class="single-brand single-brand-bottom">
                                    <img src="img/brand-img9.png" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <a href="" class="getstarted-btn button-hover">Get Started Now</a>
            </div>
        </div>
    </section>
    <!-- brand End -->
    <!-- footer start -->
    <footer class="footer-area">
        <div class="footer-widget-area">
            <div class="container">
                <div class="row">
                    <div class="col-sm-3">
                        <div class="single-widget fadeIn wow" data-wow-delay="0.3s">
                            <h3>Products</h3>
                            <ul>
                                <li><a href="#">Compute</a></li>
                                <li><a href="#">Storage</a></li>
                                <li><a href="#">Networking</a></li>
                                <li><a href="#">Load Balancer</a></li>
                                <li><a href="#">Monitoring</a></li>
                                <li><a href="#">Apps</a></li>
                                <li><a href="#">Teams</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="single-widget fadeIn wow" data-wow-delay="0.3s">
                            <h3>Resources</h3>
                            <ul>
                                <li><a href="#">FAQ</a></li>
                                <li><a href="#">API</a></li>
                                <li><a href="#">Vultr Docs</a></li>
                                <li><a href="#">Benchmarks</a></li>
                                <li><a href="#">Server Status</a></li>
                                <li><a href="#">Legal</a></li>
                                <li><a href="#">Toolbox</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="single-widget fadeIn wow" data-wow-delay="0.3s">
                            <h3>Information</h3>
                            <ul>
                                <li><a href="#">For Business</a></li>
                                <li><a href="#">Solutions</a></li>
                                <li><a href="#">Customers</a></li>
                                <li><a href="#">Pricing</a></li>
                                <li><a href="#">Contact Sales</a></li>
                                <li><a href="#">Hatch</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="single-widget fadeIn wow" data-wow-delay="0.3s">
                            <h3>Company</h3>
                            <ul>
                                <li><a href="#">About Us</a></li>
                                <li><a href="#">Our Team</a></li>
                                <li><a href="#">News</a></li>
                                <li><a href="#">Logos & Banners</a></li>
                                <li><a href="#">Careers</a></li>
                                <li><a href="#">SLA</a></li>
                                <li><a href="#">Contact</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="footer-bottom">
            <div class="container">
                <div class="row footer-bottom-content">
                    <div class="col-md-5">
                        <div class="footer-paragraph">
                            <p>Copyright 2017 © Blue Corporation. All rights reserved.</p>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="footer-middle">
                            <ul>
                                <li><a href="#">Terms of Services</a></li>
                                <li><a href="#">Privacy Policy</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="footer-social-icon">
                            <ul>
                                <li>
                                    <a href="#"> <i class="fa fa-facebook"></i></a>
                                </li>
                                <li>
                                    <a href="#"> <i class="fa fa-twitter"></i></a>
                                </li>
                                <li>
                                    <a href="#"> <i class="fa fa-linkedin"></i></a>
                                </li>
                                <li>
                                    <a href="#"> <i class="fa fa-google-plus"></i></a>
                                </li>
                                <li>
                                    <a href="#"> <i class="fa fa-pinterest"></i></a>
                                </li>

                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- footer End -->


    <script src="js/jquery-2.1.4.min.js"></script>
    <!--    <script src="js/jquery.magnific-popup.min.js"></script>-->
    <script src="js/jquery.slicknav.min.js"></script>
    <!--    <script src="js/isotope.pkgd.min.js"></script>-->
    <script src="js/owl.carousel.min.js"></script>
    <!-- ================= wow Js ======== -->
    <script src="js/wow.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/main.js"></script>
</body>

</html>