You are on page 1of 3

<!

DOCTYPE html>
<html>
<head>
<title>Naturaleza</title>
<link rel="stylesheet" href="ajuste.css"/>
<link rel="stylesheet" type="text/css"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="shortcut icon" type="image/icon"
href="https://pbs.twimg.com/profile_images/437591547320602624/JibBRl-l.jpeg">
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">
</head>
<body>
<div class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-
target="#myNavbar"></button>
<img src="images/banner8.jpg" class="logo">
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li>
<a href="#about">Quienes Somos</a>
</li>
<li>
<a href="#service">Servicios</a>
</li>
<li>
<a href="#contact">Contactenos</a>
</li>
<li>
<a href="#historia">Historia</a>
</li>
<li>
<a href="#product">Productos</a>
</li>
</ul>
</div>
</div>
</div>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="images/banner4.jpg" class="imagenes">
</div>
<div class="item">
<img src="images/banner5.jpg" class="imagenes">
</div>
<div class="item">
<img src="images/banner6.jpg" class="imagenes">
</div>
</div>
<a class="left carousel-control" href="#myCarousel" role="button" data-
slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hiden="true"></span>
<span class="sr-only">Anterior</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-
slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hiden="true"></span>
<span class="sr-only">Siguiente</span>
</a>
</div>
</div>
<div class="jumbotron">
<div class="container text-center">
<h2 class="title">Servicios</h2>
<p>La naturaleza de Colombia</p>
</div>
</div>
<section id="service" class="video">
<video preload="auto" autoplay="true" loop="loop">
<source src="videos/Naturaleza.mp4" type="videos.mp4">

</video>
</section>

</body>
<script type="text/javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript"
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</html>

.logo{
height:50px;
width: 50px;

}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img{
margin: auto;

}
.imagenes
{
height: 1150px;
width: 1150px
}
a, p, h1, h2, h3, h4, h5{
font-family: 'Lobster', cursive;
}
.navbar-inverse .navbar-nav>li>a{
font-family: 'Lobster', cursive;
}
.title{
font-family: 'Lobster', cursive;
}
.video{
width 95px;
margin: 0 auto;
display: block;
}

You might also like