View file MTX Club/Template/single-event-big.html

File size: 16.45Kb
<!DOCTYPE html>
<!--[if lt IE 10]> <html  lang="en" class="iex"> <![endif]-->
<!--[if (gt IE 10)|!(IE)]><!-->
<html lang="en">
<!--<![endif]-->
<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>Events | Nightlife demo | Framework Y</title>
    <meta name="description" content="Single big famous event and show HTML template dark black design and style.">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    <link rel="stylesheet" href="scripts/bootstrap/css/bootstrap.css">
    <script src="scripts/script.js"></script>
    <link rel="stylesheet" href="css/content-box.css">
    <link rel="stylesheet" href="css/components.css">
    <link rel="stylesheet" href="scripts/magnific-popup.css">
    <link rel="stylesheet" href="scripts/flexslider/flexslider.css">
    <link rel="stylesheet" href="css/fullpage.twoside.css">
    <link rel="icon" href="images/favicon.png">
    <link rel="stylesheet" href="style.css">
    <!-- Extra optional content header -->
</head>
<body class="big-event">
    <div id="preloader"></div>
    <header class="fixed-top scroll-change" data-menu-anima="fade-left">
        <div class="navbar navbar-default navbar-fixed-top" role="navigation">
            <div class="navbar-main navbar-middle">
                <div class="container">
                    <div class="scroll-hide">
                        <div class="container">
                            <a class="navbar-brand center" href="#">
                                <img src="images/logo.png" alt="logo" />
                            </a>
                        </div>
                    </div>
                    <div class="navbar-header">
                        <a class="navbar-brand" href="index.html"><img src="images/logo.png" alt="logo" /></a>
                        <button type="button" class="navbar-toggle">
                            <i class="fa fa-bars"></i>
                        </button>
                    </div>
                    <div class="collapse navbar-collapse">
                        <ul class="nav navbar-nav no-margins">
                            <li><a href="index.html">Home</a></li>
                            <li class="dropdown">
                                <a href="events.html" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">Events <i class="caret"></i></a>
                                <ul class="dropdown-menu multi-level">
                                    <li><a href="events.html">All events</a></li>
                                    <li><a href="single-event.html">Single event</a></li>
                                    <li><a href="single-event-big.html">Big single event</a></li>
                                </ul>
                            </li>
                            <li><a href="gallery.html">Gallery</a></li>
                            <li class="scroll-show"><a href="index.html"><img src="images/logo-small.png" alt="logo"></a></li>
                            <li><a href="products.html">Products</a></li>
                            <li><a href="blog.html">Blog</a></li>
                            <li><a href="contacts.html">Contacts</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <div class="background-page">
        <div class="flexslider slider" data-options="directionNav:false,animation:fade,slideshowSpeed:5000">
            <ul class="slides">
                <li>
                    <div class="bg-cover" style="background-image:url('images/events/hd-1.jpg')"></div>
                </li>
                <li>
                    <div class="bg-cover" style="background-image:url('images/events/hd-2.jpg')"></div>
                </li>
                <li>
                    <div class="bg-cover" style="background-image:url('images/events/hd-3.jpg')"></div>
                </li>
            </ul>
        </div>
    </div>
    <div class="sec-twoside">
        <div class="row">
            <div class="half-side left">
                <div class="content">
                    <h1 class="text-xl">68° SPLASH<br />FUNNY PARTY</h1>
                    <p>12 JANUARY 2017 FROM 10PM</p>
                    <hr class="h" />
                    <div class="countdown text-s" data-time="01/12/2017 10:30:00" data-utc-offset="-5">
                        <div>
                            <span class="text-xl">-</span>
                        </div>
                        <div>
                            <span class="days countdown-values text-m">00</span><br /><span class="countdown-label">Days</span>
                        </div>
                        <div>
                            <span class="hours countdown-values text-m">00</span><br /><span class="countdown-label">Hours</span>
                        </div>
                        <div>
                            <span class="minutes countdown-values text-m">00</span><br /><span class="countdown-label">Mins</span>
                        </div>
                        <div>
                            <span class="seconds countdown-values text-m">00</span><br /><span class="countdown-label">Secs</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="half-side right">
                <div class="content">
                    <!-- MAIN RIGHT CONTENT -->
                    <div id="twosides-menu">
                        <div class="twoside-open"><hr />Details</div>
                        <div class="twoside-open"><hr />Gallery</div>
                        <div class="twoside-open"><hr />Location</div>
                    </div>
                </div>
            </div>
            <div id="twosides-main">
                <div class="section center-box">
                    <div class="content">
                        <div class="row">
                            <div class="col-md-6">
                                <p>DETAILS</p>
                                <h2>68° SPLASH FUNNY PARTY</h2>
                                <hr class="h" />
                                <ul class="list-texts">
                                    <li><b>Date:</b>   12/01/2017</li>
                                    <li><b>Time:</b>  19:00</li>
                                    <li><b>Address:</b> 2 Elizabeth St, Melbourne, 3000 Australia</li>
                                    <li><b>Tickets:</b> <a href="#">contact@eprom.com</a></li>
                                    <li><b>Tel:</b> (123) 563-9899-234</li>
                                    <li><b>Categories:</b> Festivals</li>
                                </ul>
                            </div>
                            <div class="col-md-6">
                                <div class="scroll-content" data-height="338" data-options="size:2px">
                                    <p>
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque porttitor fermentum ullamcorper. Aliquam erat volutpat. Nullam purus metus, interdum ac lacinia non, sodales non arcu. In eleifend vestibulum eleifend. Maecenas ut felis mi, vitae pharetra justo. Ut lacus lacus, fermentum sed tincidunt eget, suscipit nec orci. Sed pellentesque dapibus tellus in semper. Aenean faucibus aliquet turpis, id fermentum sem consectetur id. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis faucibus euismod nunc scelerisque tincidunt.
                                        Phasellus ligula sem, laoreet luctus luctus sed, pharetra in mi. Aenean accumsan gravida convallis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus congue tellus lectus, quis sodales sem. Ut nec nisl id sem ultricies malesuada. Nunc eu justo mauris, non lobortis dolor. Nunc id condimentum leo. Vestibulum tortor eros, mollis ac tempor et, commodo eu tellus. Curabitur a leo non nunc tristique tincidunt. Donec enim eros, blandit pharetra dapibus ullamcorper, aliquet sit amet diam. Aenean tempus laoreet adipiscing. Vivamus eleifend pretium pellentesque.
                                    </p>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
                <div class="section center-box">
                    <div class="content">
                        <div class="grid-list gallery">
                            <div class="grid-box row" data-lightbox-anima="show-scale">
                                <div data-sort="1" class="grid-item col-md-4">
                                    <a class="img-box i-bottom" href="images/gallery/image-1.jpg">
                                        <i class="fa fa-camera"></i>
                                        <img alt="" src="images/gallery/thumb-1.jpg" />
                                    </a>
                                </div>
                                <div data-sort="2" class="grid-item col-md-4">
                                    <a class="img-box mfp-iframe i-bottom" href="https://www.youtube.com/watch?v=Wd7H311MrWA">
                                        <i class="fa fa-film"></i>
                                        <img alt="" src="images/gallery/thumb-9.jpg" />
                                    </a>
                                </div>
                                <div data-sort="3" class="grid-item col-md-4 cat1">
                                    <a class="img-box i-bottom" href="images/gallery/image-2.jpg">
                                        <i class="fa fa-camera"></i>
                                        <img alt="" src="images/gallery/thumb-2.jpg" />
                                    </a>
                                </div>
                                <div data-sort="4" class="grid-item col-md-4 ">
                                    <a class="img-box i-bottom" href="images/gallery/image-3.jpg">
                                        <i class="fa fa-camera"></i>
                                        <img alt="" src="images/gallery/thumb-3.jpg" />
                                    </a>
                                </div>
                                <div data-sort="5" class="grid-item col-md-4">
                                    <a class="img-box i-bottom" href="images/gallery/image-4.jpg">
                                        <i class="fa fa-camera"></i>
                                        <img alt="" src="images/gallery/thumb-4.jpg" />
                                    </a>
                                </div>
                                <div data-sort="6" class="grid-item col-md-4">
                                    <a class="img-box i-bottom" href="images/gallery/image-5.jpg">
                                        <i class="fa fa-camera"></i>
                                        <img alt="" src="images/gallery/thumb-5.jpg" />
                                    </a>
                                </div>
                                <div data-sort="7" class="grid-item col-md-4">
                                    <a class="img-box i-bottom" href="images/gallery/image-6.jpg">
                                        <i class="fa fa-camera"></i>
                                        <img alt="" src="images/gallery/thumb-6.jpg" />
                                    </a>
                                </div>
                                <div data-sort="8" class="grid-item col-md-4">
                                    <a class="img-box i-bottom" href="images/gallery/image-7.jpg">
                                        <i class="fa fa-camera"></i>
                                        <img alt="" src="images/gallery/thumb-7.jpg" />
                                    </a>
                                </div>
                                <div data-sort="9" class="grid-item col-md-4">
                                    <a class="img-box i-bottom" href="images/gallery/image-8.jpg">
                                        <i class="fa fa-camera"></i>
                                        <img alt="" src="images/gallery/thumb-8.jpg" />
                                    </a>
                                </div>
                                <div data-sort="10" class="grid-item col-md-4">
                                    <a class="img-box mfp-iframe i-bottom" href="https://www.youtube.com/watch?v=Wd7H311MrWA">
                                        <i class="fa fa-film"></i>
                                        <img alt="" src="images/gallery/thumb-10.jpg" />
                                    </a>
                                </div>
                            </div>
                            <div class="list-nav">
                                <ul class="pagination-sm pagination-grid hide-first-last" data-page-items="3" data-pagination-anima="show-scale"></ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="section center-box">
                    <div class="content">
                        <div class="row">
                            <div class="col-md-4">
                                <h2>ADDRESS</h2>
                                <hr class="h" />
                                <h4>2 Elizabeth St, Melbourne, 3000 Australia</h4>
                                <p>
                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque porttitor fermentum ullamcorper. Consectetur adipiscing elit. Pellentesque porttitor fermentum ullamcorper.
                                    Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere .
                                </p>
                            </div>
                            <div class="col-md-8">
                                <a class="img-box lightbox" href="https://maps.google.com/maps?q=New+York,+United+States" data-lightbox-anima="show-scale">
                                    <img alt="" src="images/map.jpg">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="center-bg"></div>
            <div class="close-button"></div>
        </div>
    </div>
    <footer class="hidden">
        <div class="container">
            <div class="row">
                <div class="col-md-8">
                    <hr class="space xs" />
                    <div class="copy-row">
                        <div class="tag-row">
                            <span>Copyright © 2016</span>
                            <span>47 Chandos Place London WC2N 4HS</span>
                            <span>020 7836 0291</span>
                            <span>info@soundoflondon.com</span>
                        </div>
                    </div>
                </div>
                <div class="col-md-4 text-right">
                    <div class="btn-group social-group">
                        <a target="_blank" href="#"><i class="fa fa-facebook"></i></a>
                        <a target="_blank" href="#"><i class="fa fa-twitter"></i></a>
                        <a target="_blank" href="#"><i class="fa fa-instagram"></i></a>
                        <a target="_blank" href="#"><i class="fa fa-youtube"></i></a>
                    </div>
                </div>
            </div>
        </div>
        <link rel="stylesheet" href="scripts/font-awesome/css/font-awesome.min.css">
        <link rel="stylesheet" href="css/animations.css">
        <script async src="scripts/bootstrap/js/bootstrap.min.js"></script>
        <script src="scripts/imagesloaded.min.js"></script>
        <script src="scripts/jquery.twbsPagination.min.js"></script>
        <script src='scripts/flexslider/jquery.flexslider-min.js'></script>
        <script src='scripts/jquery.progress-counter.js'></script>
        <script src='scripts/google.maps.min.js'></script>
        <script src='scripts/jquery.slimscroll.min.js'></script>
        <script src='https://maps.googleapis.com/maps/api/js?key=AIzaSyDl7p8SWg-5kLe7i-usdYCu5m3eVllMDTs'></script>
        <script src='scripts/jquery.magnific-popup.min.js'></script>
        <script src='scripts/fullpage.twoside.js'></script>
        <script src="scripts/smooth.scroll.min.js"></script>
    </footer>
</body>
</html>