Untitled

{% load staticfiles %}

<!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>My Blog</title>
        <link href="{% static "css/bootstrap.css" %}" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css?family=Dancing+Script" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css?family=Libre+Baskerville" rel="stylesheet">
        <link rel="stylesheet" type="text/css" href="{% static "css/style.css" %}">
    </head>

    <body>
        <div class="container-fluid">
            <header>
                <div class="row">
                    <div class="col-lg-12">

                        <!--Ссылки, навигация-->
                        <div class="row nav">
                            <div class="col-lg-12">
                                <ul>
                                    <li>
                                        <a href="#services">SERVICES</a>
                                    </li>
                                    <li>
                                        <a href="#portfolio">PORTFOLIO</a>
                                    </li>
                                    <li>
                                        <a href="#about">ABOUT</a>
                                    </li>
                                    <li>
                                        <a href="#contact">CONTACT</a>
                                    </li>
                                    <li>
                                        <a href="/blog">BLOG</a>
                                    </li>
                                </ul>
                            </div>
                        </div>


                        <!--Заголовки-->
                        <div class="row headlines">
                            <div class="col-lg-12">
                                <p class="main">Welcome To My Blog!</p>
                                <p class="secondary">IT`S NICE TO SEE YOU</p>
                            </div>
                        </div>


                            <!--Кнопка-->
                        <div class="row">
                                <div class="col-lg-12 tellmore">
                                    <a href="/blog" class="btn btn-warning goblog" role="button">Tell Me More</a>
                                </div>
                        </div>

                    </div>
                </div>
            </header>
        </div>

        <div class="container-fluid">
            <div id="body">
                <div class="row">

                    <!--SERVICES-->
                    <div id="services" class="col-lg-12">
                        <div class="row">

                            <h1>SERVICES</h1>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing.</p>
                            <br>
                            <br>

                            <div class="col-lg-4">
                                <img src="{% static "img/icons/web.png" %}">
                                <h3>Web Development</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nemo, commodi dolorum est fuga minus temporibus quisquam veniam, consectetur consequatur adipisci!</p>
                            </div>

                            <div class="col-lg-4">
                                <img src="{% static "img/icons/software.png" %}">
                                <h3>Software Engineering</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi quidem praesentium, hic beatae, necessitatibus fugiat!</p>
                            </div>

                            <div class="col-lg-4">
                                <img src="{% static "img/icons/commerce.png" %}">
                                <h3>E-Commerce</h3>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum, esse quo. In architecto eveniet nisi error similique.</p>
                            </div>
                        </div>
                    </div>

                    <!--PORTFOLIO-->
                    <div id="portfolio" class="col-lg-12">
                        <div class="row">
                            <h1>PORTFOLIO</h1>
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Natus.</p>
                            <br>
                            <br>

                            <div class="container">
                                <div class="row">

                                    <div class="col-md-4">
                                        <img src="{% static "img/guitarPort.jpg" %}">
                                        <h3>Vinil Guital Pickguagd</h3>
                                        <p>Guitar Design</p>
                                    </div>

                                    <div class="col-md-4">
                                        <img src="{% static "img/sitePort.jpg" %}">
                                        <h3>Travel Is Beatiful</h3>
                                        <p>Site Design</p>
                                    </div>

                                    <div class="col-md-4">
                                        <img src="{% static "img/codePort.jpg" %}">
                                        <h3>Code On</h3>
                                        <p>Software</p>
                                    </div>
                                </div>
                                <br>
                                <br>

                                <div class="row">
                                    <div class="col-md-4">
                                        <img src="{% static "img/site1Port.jpg" %}">
                                        <h3>Presentation</h3>
                                        <p>Site Design</p>
                                    </div>

                                    <div class="col-md-4">
                                        <img src="{% static "img/site2Port.jpg" %}">
                                        <h3>Your Favourive Car</h3>
                                        <p>Site Design</p>
                                    </div>

                                    <div class="col-md-4">
                                        <img src="{% static "img/site3Port.jpg" %}">
                                        <h3>Wanna Live Here</h3>
                                        <p>Site Design</p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>

                    <!--ABOUT ME (BLOG)-->
                    <div id="about" class="col-lg-12">
                        <div class="container">
                            <div class="row">
                                    <div class="col-lg-12">
                                        <h1>ABOUT</h1>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam possimus reprehenderit deserunt impedit, doloribus mollitia enim cupiditate alias dolore, quasi facere esse, nisi eos nam at autem tempore est culpa voluptate similique sed adipisci aliquid. At quibusdam eius repudiandae nulla cupiditate modi sit beatae odit non commodi dolorem dolore sapiente ut praesentium a, totam, numquam cumque nihil animi doloribus perferendis voluptates dicta delectus. Impedit nihil labore quia, vitae, molestiae ducimus.</p>
                                        <!--<a href="/blog" class="btn btn-warning goblog" role="button" >Tell Me More</a>-->
                                        <div class="row">
                                            <div class="col-lg-12 tellmore">
                                                <a href="/blog" class="btn btn-warning goblog" role="button" style="margin-top: 20px; margin-bottom: 25px; font-size: 15px;">Tell Me More</a>
                                            </div>
                                        </div>
                                    </div>
                            </div>
                        </div>
                    </div>

                    <!--CONTACT-->
                    <div id="contact" class="col-lg-12">
                        <h1>CONTACT ME</h1>
                        <form>
                            <div class="row">
                                <div class="col-lg-6">
                                    <input type="text" placeholder=" Your name *" name="name">
                                    <br>
                                    <input type="email" placeholder=" Your e-mail *" name="email">
                                    <br>
                                    <input type="text" placeholder=" Your phone *" name="phone">
                                    <br>
                                </div>
                                <div class="col-lg-6">
                                    <textarea name="message" placeholder=" Your message *"></textarea>
                                 </div>
                            </div>

                            <div class="row">
                                <div class="col-lg-12">
                                    <input type="submit" class="btn btn-warning submit">
                                </div>
                            </div>
                        </form>
                    </div>

                </div>
            </div>
        </div>

        <footer>
            <div class="row">
                <div class="col-lg-6">
                    <p>Copyright &#169 by Zakhar Ovcharov   </p>
                </div>
                <div class="col-lg-6">
                    <a href="http://twitter.com"><img src="{% static "img/icons/twitter.png" %}"></a>
                    <a href="http://facebook.com"><img src="{% static "img/icons/facebook.png" %}"></a>
                    <a href="http://dropbox.com"><img src="{% static "img/icons/dropbox.png" %}"></a>
                </div>
            </div>
        </footer>
        <script src="js/bootstrap.min.js"></script>
    </body>
</html>