"Index-Ah_bordo"
Bootstrap 4.1.1 Snippet by Milene

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE HTML> <!--Página do aplicativo Ah Bordo. Autor: Milene Santos, Izabelle Neves, Paulo Dias, Patrícia Sales, Amanda Rodrigues Data:28/09/2020 Versão:0.001 data 25/09/2020 Versão atual: 0.004 --> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Ah Bordo| Viajar nunca foi tão fácil!!</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content="Free HTML5 Website Template by FreeHTML5.co" /> <meta name="keywords" content="free website templates, free html5, free template, free bootstrap, free website template, html5, css3, mobile first, responsive" /> <meta name="author" content="FreeHTML5.co" /> <!-- Facebook and Twitter integration --> <meta property="og:title" content=""/> <meta property="og:image" content=""/> <meta property="og:url" content=""/> <meta property="og:site_name" content=""/> <meta property="og:description" content=""/> <meta name="twitter:title" content="" /> <meta name="twitter:image" content="" /> <meta name="twitter:url" content="" /> <meta name="twitter:card" content="" /> <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet"> <!-- Animate.css --> <link rel="stylesheet" href="css/animate.css"> <!-- Icomoon Icon Fonts--> <link rel="stylesheet" href="css/icomoon.css"> <!-- Themify Icons--> <link rel="stylesheet" href="css/themify-icons.css"> <!-- Bootstrap --> <link rel="stylesheet" href="css/bootstrap.css"> <!-- Magnific Popup --> <link rel="stylesheet" href="css/magnific-popup.css"> <!-- Magnific Popup --> <link rel="stylesheet" href="css/bootstrap-datepicker.min.css"> <!-- Owl Carousel --> <link rel="stylesheet" href="css/owl.carousel.min.css"> <link rel="stylesheet" href="css/owl.theme.default.min.css"> <!--links nav ---> <link rel="stylesheet" href="css/light-box.css"> <link rel="stylesheet" href="css/owl-carousel.css"> <link rel="stylesheet" href="css/templatemo-style.css"> <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/bootstrap-theme.min.css"> <script src="js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script> <script src="js/vendor/bootstrap.min.js"></script> <script src="js/plugins.js"></script> <script src="js/meu.js"></script> <!--CSS Cards --> <link href="csscards/bootstrap.css" rel="stylesheet" /> <link href="csscards/rotating-card.css" rel="stylesheet" /> <link href="https://netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet" /> <!-- Theme style --> <link rel="stylesheet" href="css/style.css"> <!-- Modernizr JS --> <script src="js/modernizr-2.6.2.min.js"></script> </head> <body> <div class="gtco-loader"></div> <div id="page"> <!-- Navbar --> <nav class="gtco-nav" role="navigation"> <div class="gtco-container"> <div class="row"> <div class="col-sm-4 col-xs-12"> <div id="gtco-logo"><img src="images/logo.jpg" width="100px" height="50px"a href="index.html"> <em>.</em></a></div> </div> <div class="col-xs-8 text-right menu-1"> <ul> <li><a href="destination.html">Pacotes</a></li> <li class="has-dropdown"> <a href="#">Destinos</a> <ul class="dropdown"> <li><a href="internacional.html">Internacionais</a></li> <li><a href="destinosnacionais.html">Nacionais</a></li> </ul> </li> <li><a href="transportes.html">Transporte</a></li> <li><a href="anuncio/form.html">Anuncie aqui</a></li> <li><a href="perfil/cadastro.html">Meu perfil</a></li> <li><a href="cadastros/login.html">Login</a></li> </ul> </div> </div> </div> </nav> <div class="slider"> <div class="Modern-Slider content-section" id="top";> <!--Slide 1--> <div class="item item-1"style="background-image: url(images/slide_2.jpg)"> <div class="img-fill"> <div class="image"></div> <div class="info"> <div> <span style="color: white">Seja Bem - Vindo</span> <h1>Ah Bordo</h1><br> <p>Aqui possibilitamos a você realizar suas viagens sem custos.</p> <div class="white-button button"> <a href="#featured">Ver mais</a> </div> </div> </div> </div> </div> <!-- Fim do slide 1 --> <!--Slide 2--> <div class="item item-2" style="background-image: url(images/baixado1.jpg)"> <div class="img-fill"> <div class="image" ></div> <div class="info"> <div> <h1>Aproveite suas férias!!<br></h1> <p>A falta de dinheiro não é mais um problema. <br></p> <div class="white-button button"> <a href="#featured">Ver mais</a> </div> </div> </div> </div> </div> <!--fim do slide 2 --> <!-- Slide 3 --> <div class="item item-3" style="background-image: url(images/tokyo3.jpg)"> <div class="img-fill"> <div class="image"></div> <div class="info"> <div> <h1>Variedade de destinos!!<br></h1> <p>Oferecemos viajens nacionais e internacionais <br>buscando atender todos os nossos clientes.</p> <div class="white-button button"> <a href="#featured">Ver mais</a> </div> </div> </div> </div> </div> <!--Fim do slide 3 --> </div> </div> <!--Top Destinos---> <div class="gtco-section"> <div class="gtco-container"> <div class="row"> <div class="col-md-8 col-md-offset-2 text-center gtco-heading"> <h2>Top Destinos</h2> <p>Conheça os destinos mais populares pelos viajantes.</p> </div> </div> <!--Destino 1---> <div class="row"> <div class="col-lg-4 col-md-4 col-sm-6"> <a href="images/topdestinos/bahiatrancoso.jpg" class="fh5co-card-item image-popup"> <figure> <div class="overlay"><i class="ti-plus"></i></div> <img src="images/topdestinos/bahiatrancoso.jpg" alt="Image" class="img-responsive"> </figure> <div class="fh5co-text"> <h2>Bahia - Trancoso</h2> <p>Trancoso foi um antigo povoado de pescadores, e hoje combina a tranquilidade com a típica beleza das praias do sul da Bahia.</p> <p><span class="btn btn-primary">Visitar</span></p> </div> </a> </div> <!-- fim Destino 1---> <!--Destino 2---> <div class="col-lg-4 col-md-4 col-sm-6"> <a href="images/topdestinos/maragogialagoas.jpg" class="fh5co-card-item image-popup"> <figure> <div class="overlay"><i class="ti-plus"></i></div> <img src="images/topdestinos/maragogialagoas.jpg" alt="Image" class="img-responsive"> </figure> <div class="fh5co-text"> <h2>Maragogi - Alagoas</h2> <p>Maragogi é uma das praias mais bonitas do Brasil, é perfeita para quem quer conhecer gente do mundo todo, praticar novos idiomas e ainda curtir o lindo o visual. </p> <p><span class="btn btn-primary">Visitar</span></p> </div> </a> </div> <!--Fim Destino 2---> <!--Destino 3---> <div class="col-lg-4 col-md-4 col-sm-6"> <a href="images/topdestinos/buzios.jpg" class="fh5co-card-item image-popup"> <figure> <div class="overlay"><i class="ti-plus"></i></div> <img src="images/topdestinos/buzios.jpg" alt="Image" class="img-responsive"> </figure> <div class="fh5co-text"> <h2>Búzios</h2> <p>Localizada a aproximadamente 173 quilômetros do centro da capital do Rio de Janeiro — é considerada uma das mais belas cidades do litoral do Brasil.</p> <p><span class="btn btn-primary">Visitar</span></p> </div> </a> </div> </div> <!--Fim Destino 3---> <!--Destino 4---> <div class="col-lg-4 col-md-4 col-sm-6"> <a href="images/topdestinos/australia.jpg" class="fh5co-card-item image-popup"> <figure> <div class="overlay"><i class="ti-plus"></i></div> <img src="images/topdestinos/australia.jpg" alt="Image" class="img-responsive"> </figure> <div class="fh5co-text"> <h2>Australia</h2> <p>É a capital do estado de Nova Gales do Sul e a cidade mais populosa de toda a Austrália e Oceania</p> <p><span class="btn btn-primary">Visitar</span></p> </div> </a> </div> <!-- Fim Destino 4---> <!--Destino 5---> <div class="col-lg-4 col-md-4 col-sm-6"> <a href="images/topdestinos/europa.jpg" class="fh5co-card-item image-popup"> <figure> <div class="overlay"><i class="ti-plus"></i></div> <img src="images/topdestinos/europa.jpg" alt="Image" class="img-responsive"> </figure> <div class="fh5co-text"> <h2>Europa</h2> <p> Confira uma seleção com alguns dos points mais incríveis do velho continente</p> <p><span class="btn btn-primary">Visitar</span></p> </div> </a> </div> <!-- Fim Destino 5---> <!--Destino 6---> <div class="col-lg-4 col-md-4 col-sm-6"> <a href="images/topdestinos/manodelgigante.jpg" class="fh5co-card-item image-popup"> <figure> <div class="overlay"><i class="ti-plus"></i></div> <img src="images/topdestinos/manodelgigante.jpg" alt="Image" class="img-responsive"> </figure> <div class="fh5co-text"> <h2>Mano del Gigante</h2> <p>Montaña La Mano del Gigante,Projeto ecoturístico donde se combina a arte e o paisagem</p> <p><span class="btn btn-primary">Visitar</span></p> </div> </a> </div> </div> </div> <!--fim Destino 6---> <!--Nosso time---> <div id="gtco-features"> <div class="gtco-container"> <div class="row"> <div class="col-md-8 col-md-offset-2 text-center gtco-heading animate-box"> <h2>Nosso Time</h2> <p>Conheça um pouco mais dos criadores e desenvolvedores do projeto Ah Bordo</p> </div> </div> <!--Inicio Card 1--> <div class="row"> <div class="col-md-4 col-sm-6"> <!--Card 1 frente--> <div class="card-container"> <div class="card"> <div class="front"> <div class="cover"> <img src="images/blog_2.jpg"/> </div> <div class="user"> <img class="img-circle" src="images/team/iza.jpeg"/> </div> <div class="content"> <div class="main"> <h3 class="name">Izabelle Neves</h3> <p class="profession">Gerente</p> <p class="text-center">"Somos desenvolvedores web juniors!!"</p> </div> <div class="footer"> <div class="rating"> <i class="fa fa-mail-forward"></i> Verso </div> </div> </div> </div> <!-- Fim da parte frontal --> <!-- Inicio do verso --> <div class="back"> <div class="header"> <h5 class="motto"></h5> </div> <div class="content"> <div class="main"> <h4 class="text-center">Descrição do trabalho</h4> <p class="text-center"> HTML5, CSS, JavaScript,PHP entre outros...</p> <div class="stats-container"> <div class="stats"> <h4>429</h4> <p> Seguidores </p> </div> <div class="stats"> <h4>431</h4> <p> Seguindo </p> </div> <div class="stats"> <h4>8</h4> <p> Projetos </p> </div> </div> </div> </div> <div class="footer"> <div class="social-links text-center"> <a href="https://izabellegn@hotmail.com" class="google"><i class="fa fa-google-plus fa-fw"></i></a> <a href="https://www.instagram.com/izabelleneves01/" class="instagram"><i class="fa fa-instagram fa-fw"></i></a> </div> </div> </div> <!-- Fim do verso --> </div> <!-- Fim do Card --> </div> <!--Fim card-container --> </div> <!-- Início Card 2 --> <div class="col-md-4 col-sm-6"> <div class="card-container"> <div class="card"> <!-- Card 2 frente --> <div class="front"> <div class="cover"> <img src="images/blog_2.jpg"/> </div> <div class="user"> <img class="img-circle" src="images/team/mi.jpg"/> </div> <div class="content"> <div class="main"> <h3 class="name">Milene Santos</h3> <p class="profession">Designer</p> <p class="text-center">"Somos desenvolvedores web juniors!!"</p> </div> <div class="footer"> <div class="rating"> <i class="fa fa-mail-forward"></i> Verso </div> </div> </div> </div> <!-- Fim da parte frontal --> <!-- Início do verso --> <div class="back"> <div class="header"> <h5 class="motto"></h5> </div> <div class="content"> <div class="main"> <h4 class="text-center">Descrição de trabalho</h4> <p class="text-center">Web design, Adobe Photoshop, HTML5, CSS, JavaScript,PHP entre outros...</p> <div class="stats-container"> <div class="stats"> <h4>1547</h4> <p> Seguidores </p> </div> <div class="stats"> <h4>982</h4> <p> Seguindo </p> </div> <div class="stats"> <h4>8</h4> <p> Projetos </p> </div> </div> </div> </div> <div class="footer"> <div class="social-links text-center"> <a href="https://www.facebook.com/miih.santos.712/" class="facebook"><i class="fa fa-facebook fa-fw"></i></a> <a href="milenesc0123@gmail.com" class="google"><i class="fa fa-google-plus fa-fw"></i></a> <a href="https://twitter.com/Milene_Snts" class="twitter"><i class="fa fa-twitter fa-fw"></i></a> <a href="https://www.instagram.com/milenesc_makeup/" class="instagram"><i class="fa fa-instagram fa-fw"></i></a> </div> </div> </div> <!-- end back panel --> </div> <!-- end card --> </div> <!-- end card-container --> </div> <div class="col-md-4 col-sm-6"> <div class="card-container"> <div class="card"> <div class="front"> <div class="cover"> <img src="images/blog_2.jpg"/> </div> <div class="user"> <img class="img-circle" src="images/team/paulo.jpeg"/> </div> <div class="content"> <div class="main"> <h3 class="name">Paulo Dias</h3> <p class="profession">Programador</p> <p class="text-center">"Somos desenvolvedores web juniors!!"</p> </div> <div class="footer"> <div class="rating"> <i class="fa fa-mail-forward"></i> Verso </div> </div> </div> </div> <!-- end front panel --> <div class="back"> <div class="header"> <h5 class="motto"></h5> </div> <div class="content"> <div class="main"> <h4 class="text-center">Job Description</h4> <p class="text-center">Programador, JavaScript, HTML5, CSS, PHP entre outros...</p> <div class="stats-container"> <div class="stats"> <h4>109</h4> <p> Seguidores </p> </div> <div class="stats"> <h4>352</h4> <p> Seguindo </p> </div> <div class="stats"> <h4>8</h4> <p> Projetos </p> </div> </div> </div> </div> <div class="footer"> <div class="social-links text-center"> <a href="https://www.instagram.com/pvdias62/" class="instagram"><i class="fa fa-instagram fa-fw"></i></a> <a href="paulovictordls@gmail.com" class="google"><i class="fa fa-google-plus fa-fw"></i></a> </div> </div> </div> <!-- end back panel --> </div> <!-- end card --> </div> <!-- end card-container --> </div> <div class="row"> <div class="col-md-4 col-sm-6"> <div class="card-container"> <div class="card"> <div class="front"> <div class="cover"> <img src="images/blog_2.jpg"/> </div> <div class="user"> <img class="img-circle" src="images/team/paty.jpeg"/> </div> <div class="content"> <div class="main"> <h3 class="name">Patrícia Sales</h3> <p class="profession">Pesquisadora</p> <p class="text-center">"Somos desenvolvedores web juniors!!" <div class="footer"> <div class="rating"> <i class="fa fa-mail-forward"></i> Verso </div> </div> </div> </div> <!-- end front panel --> <div class="back"> <div class="header"> <h5 class="motto"></h5> </div> <div class="content"> <div class="main"> <h4 class="text-center">Descrição de trabalho</h4> <p class="text-center">JavaScript, HTML5, CSS, Bootstrap entre outros...</p> <div class="stats-container"> <div class="stats"> <h4>235</h4> <p> Seguidores </p> </div> <div class="stats"> <h4>114</h4> <p> Seguindo </p> </div> <div class="stats"> <h4>35</h4> <p> Projetos </p> </div> </div> </div> </div> <div class="footer"> <div class="social-links text-center"> <a href="patriciasales126@gmail.com" class="google"><i class="fa fa-google-plus fa-fw"></i></a> <a href="https://creative-tim.com" class="instagram"><i class="fa fa-instagram fa-fw"></i></a> </div> </div> </div> <!-- end back panel --> </div> <!-- end card --> </div> <!-- end card-container --> </div> </div> <div class="row"> <div class="col-md-4 col-sm-6"> <div class="card-container"> <div class="card"> <div class="front"> <div class="cover"> <img src="images/blog_2.jpg"/> </div> <div class="user"> <img class="img-circle" src="images/team/Aman.jpeg"/> </div> <div class="content"> <div class="main"> <h3 class="name">Amanda Rodrigues</h3> <p class="profession">Analista</p> <p class="text-center">"Somos desenvolvedores web juniors!!"</p> </div> <div class="footer"> <div class="rating"> <i class="fa fa-mail-forward"></i> Verso </div> </div> </div> </div> <!-- end front panel --> <div class="back"> <div class="header"> <h5 class="motto"></h5> </div> <div class="content"> <div class="main"> <h4 class="text-center">Descrição de trabalho</h4> <p class="text-center">JavaScript, HTML5, CSS, Bootstrap entre outros...</p> <div class="stats-container"> <div class="stats"> <h4>45</h4> <p> Seguidores </p> </div> <div class="stats"> <h4>87</h4> <p> Seguindo </p> </div> <div class="stats"> <h4>8</h4> <p> Projetos </p> </div> </div> </div> </div> </div> <div class="footer"> <div class="social-links text-center"> <a href="" class="facebook"><i class="fa fa-facebook fa-fw"></i></a> <a href="amandarodrigues20021999@gmail.com" class="google"><i class="fa fa-google-plus fa-fw"></i></a> <a href="https://creative-tim.com" class="instagram"><i class="fa fa-instagram fa-fw"></i></a> </div> </div> </div> <!-- end back panel --> </div> <!-- end card --> </div> <!-- end card-container --> </div> </div> </div> </div> </div> <!--Banner Letreiro--> <div class="gtco-cover gtco-cover-sm" style="background-image: url(images/topo.jpg)" data-stellar-background-ratio="0.5"> <div class="overlay"></div> <div class="gtco-container text-center"> <div class="display-t"> <div class="display-tc"> <h1>Temos serviços de alta qualidade que com certeza você vai adorar!</h1> </div> </div> </div> </div> <div id="gtco-counter" class="gtco-section"> <div class="gtco-container"> <!--Nosso Desempenho--> <div class="row"> <div class="col-md-8 col-md-offset-2 text-center gtco-heading animate-box"> <h2>Nosso desempenho</h2> <p>Buscando a satisfação e tornando viagens de uma forma prática, obtemos a satisfação dos nossos viajantes.Suba a bordo conosco.</p> </div> </div> <div class="row"> <div class="col-md-3 col-sm-6 animate-box" data-animate-effect="fadeInUp"> <div class="feature-center"> <span class="counter js-counter" data-from="0" data-to="196" data-speed="5000" data-refresh-interval="50">1</span> <span class="counter-label">Destinos</span> </div> </div> <div class="col-md-3 col-sm-6 animate-box" data-animate-effect="fadeInUp"> <div class="feature-center"> <span class="counter js-counter" data-from="0" data-to="97" data-speed="5000" data-refresh-interval="50">1</span> <span class="counter-label">Hostels e Pousadas</span> </div> </div> <div class="col-md-3 col-sm-6 animate-box" data-animate-effect="fadeInUp"> <div class="feature-center"> <span class="counter js-counter" data-from="0" data-to="12402" data-speed="5000" data-refresh-interval="50">1</span> <span class="counter-label">Viajantes</span> </div> </div> <div class="col-md-3 col-sm-6 animate-box" data-animate-effect="fadeInUp"> <div class="feature-center"> <span class="counter js-counter" data-from="0" data-to="12202" data-speed="5000" data-refresh-interval="50">1</span> <span class="counter-label">Clientes satisfeitos</span> </div> </div> </div> </div> </div> <!-- Fim Nosso desempenho --> <!-- Email para novidades--> <div id="gtco-subscribe"> <div class="gtco-container"> <div class="row animate-box"> <div class="col-md-8 col-md-offset-2 text-center gtco-heading"> <h2>Se inscreva</h2> <p>Seja o primeiro a saber de nossas novidades.</p> </div> </div> <div class="row animate-box"> <div class="col-md-8 col-md-offset-2"> <form class="form-inline"> <div class="col-md-6 col-sm-6"> <div class="form-group"> <label for="email" class="sr-only">Email</label> <input type="email" class="form-control" id="email" placeholder="Seu email"> </div> </div> <div class="col-md-6 col-sm-6"> <button type="submit" class="btn btn-default btn-block">Inscrever</button> </div> </form> </div> </div> </div> </div> <!-- Fim Email para novidades--> <!-- Side bar--> <footer id="gtco-footer" role="contentinfo"> <div class="gtco-container"> <div class="row row-p b-md"> <div class="col-md-4"> <div class="gtco-widget"> <h3>Sobre nós</h3> <p>Formado em 2020 por Izabelle, Milene, Patrícia, Paulo e Amanda, AhBordo é um aplicativo desenvolvido para gerenciar e realizar suas viagens de uma forma prática e acessível.</p> </div> </div> <div class="col-md-2 col-md-push-1"> <div class="gtco-widget"> <h3>Destinos</h3> <ul class="gtco-footer-links"> <li><a href="#">Nacionais</a></li> <li><a href="#">Internacionais</a></li> <li><a href="#">Pacotes</a></li> </ul> </div> </div> <div class="col-md-2 col-md-push-1"> <div class="gtco-widget"> <h3>Hostels</h3> <ul class="gtco-footer-links"> <li><a href="#">Hostel Lobo</a></li> <li><a href="#">Maraga Beach Hostel</a></li> <li><a href="#">Haleakala Hostel</a></li> <li><a href="#">Bamboo Groove Hostel</a></li> <li><a href="#">Hostel Nómada Glamping</a></li> </ul> </div> </div> <div class="col-md-3 col-md-push-1"> <div class="gtco-widget"> <h3>Contato</h3> <ul class="gtco-quick-contact"> <li><a href="#"><i class="icon-phone"></i> +55 31 99847-7847</a></li> <li><a href="#"><i class="icon-mail2"></i> ahbordo01@gmail.com</a></li> <li><a href="#"><i class="icon-chat"></i> Live Chat</a></li> </ul> </div> </div> </div> <div class="row copyright"> <div class="col-md-12"> <p class="pull-left"> <small class="block">© 2020 Free HTML5. All Rights Reserved.</small> <small class="block">Designed by <a href="https://www.instagram.com/milenesc_makeup/" target="_blank">Milene Santos</a></small> </p> <p class="pull-right"> <ul class="gtco-social-icons pull-right"> <li><a href="#"><i class="icon-twitter"></i></a></li> <li><a href="#"><i class="icon-facebook"></i></a></li> <li><a href="#"><i class="icon-linkedin"></i></a></li> <li><a href="https://www.instagram.com/ah_bordo2020/"><i class="icon-instagram"></i></a></li> </ul> </p> </div> </div> </div> </footer> <!-- </div> --> </div> <div class="gototop js-top"> <a href="#" class="js-gotop"><i class="icon-arrow-up"></i></a> </div> <!-- jQuery --> <script src="js/jquery.min.js"></script> <!-- jQuery Easing --> <script src="js/jquery.easing.1.3.js"></script> <!-- Bootstrap --> <script src="js/bootstrap.min.js"></script> <!-- Waypoints --> <script src="js/jquery.waypoints.min.js"></script> <!-- Carousel --> <script src="js/owl.carousel.min.js"></script> <!-- countTo --> <script src="js/jquery.countTo.js"></script> <!-- Stellar Parallax --> <script src="js/jquery.stellar.min.js"></script> <!-- Magnific Popup --> <script src="js/jquery.magnific-popup.min.js"></script> <script src="js/magnific-popup-options.js"></script> <!-- Datepicker --> <script src="js/bootstrap-datepicker.min.js"></script> <!-- Main --> <script src="js/main.js"></script> </body> </html>

Related: See More


Questions / Comments: