2012-10-01 06:28:20 +02:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "utf-8" >
2013-01-18 05:39:38 +01:00
< title > Narrow page template · Bootstrap< / title >
2012-10-01 06:28:20 +02:00
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< meta name = "description" content = "" >
< meta name = "author" content = "" >
2013-01-18 05:39:38 +01:00
<!-- Bootstrap core CSS -->
2012-10-01 06:28:20 +02:00
< link href = "../assets/css/bootstrap.css" rel = "stylesheet" >
2013-01-18 05:39:38 +01:00
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- [if lt IE 9]>
< script src = "../assets/js/html5shiv.js" > < / script >
< script src = "../assets/js/respond/respond.min.js" > < / script >
<![endif]-->
<!-- Fav and touch icons -->
< link rel = "apple-touch-icon-precomposed" sizes = "144x144" href = "../assets/ico/apple-touch-icon-144-precomposed.png" >
< link rel = "apple-touch-icon-precomposed" sizes = "114x114" href = "../assets/ico/apple-touch-icon-114-precomposed.png" >
< link rel = "apple-touch-icon-precomposed" sizes = "72x72" href = "../assets/ico/apple-touch-icon-72-precomposed.png" >
< link rel = "apple-touch-icon-precomposed" href = "../assets/ico/apple-touch-icon-57-precomposed.png" >
< link rel = "shortcut icon" href = "../assets/ico/favicon.png" >
<!-- Custom styles for this template -->
< style >
2013-02-01 03:34:12 +01:00
/* Space out content a bit */
2012-10-01 06:28:20 +02:00
body {
2013-02-01 03:34:12 +01:00
padding-top: 20px;
padding-bottom: 20px;
}
/* Everything but the jumbotron gets side spacing for mobile-first views */
.masthead,
.marketing,
.footer {
padding-left: 15px;
padding-right: 15px;
}
/* Custom page header */
.masthead {
border-bottom: 1px solid #e5e5e5;
}
/* Make the masthead heading the same height as the navigation */
.masthead h3 {
margin-top: 0;
margin-bottom: 0;
line-height: 40px;
padding-bottom: 19px;
2012-10-01 06:28:20 +02:00
}
/* Custom container */
.container-narrow {
margin: 0 auto;
max-width: 700px;
}
.container-narrow > hr {
margin: 30px 0;
}
/* Main marketing message and sign up button */
.jumbotron {
text-align: center;
}
.jumbotron h1 {
font-size: 72px;
line-height: 1;
}
.jumbotron .btn {
font-size: 21px;
padding: 14px 24px;
}
/* Supporting marketing content */
.marketing {
2013-02-01 03:34:12 +01:00
margin: 40px 0;
2012-10-01 06:28:20 +02:00
}
.marketing p + h4 {
margin-top: 28px;
}
2013-02-01 03:34:12 +01:00
/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
/* Remove the padding we set earlier */
.masthead,
.marketing,
.footer {
padding-left: 0;
padding-right: 0;
}
/* Space out the masthead */
.masthead {
margin-bottom: 30px;
}
}
2012-10-01 06:28:20 +02:00
< / style >
< / head >
< body >
2013-01-18 05:39:38 +01:00
< div class = "container-narrow" >
2012-10-01 06:28:20 +02:00
< div class = "masthead" >
< ul class = "nav nav-pills pull-right" >
< li class = "active" > < a href = "#" > Home< / a > < / li >
< li > < a href = "#" > About< / a > < / li >
< li > < a href = "#" > Contact< / a > < / li >
< / ul >
< h3 class = "muted" > Project name< / h3 >
< / div >
< div class = "jumbotron" >
< h1 > Super awesome marketing speak!< / h1 >
< p class = "lead" > Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.< / p >
2013-02-01 03:34:12 +01:00
< p > < a class = "btn btn-large btn-success" href = "#" > Sign up today< / a > < / p >
2012-10-01 06:28:20 +02:00
< / div >
2013-01-18 05:39:38 +01:00
< div class = "row marketing" >
2012-10-01 06:28:20 +02:00
< div class = "span6" >
< h4 > Subheading< / h4 >
< p > Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.< / p >
< h4 > Subheading< / h4 >
< p > Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras mattis consectetur purus sit amet fermentum.< / p >
< h4 > Subheading< / h4 >
< p > Maecenas sed diam eget risus varius blandit sit amet non magna.< / p >
< / div >
< div class = "span6" >
< h4 > Subheading< / h4 >
< p > Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.< / p >
< h4 > Subheading< / h4 >
< p > Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras mattis consectetur purus sit amet fermentum.< / p >
< h4 > Subheading< / h4 >
< p > Maecenas sed diam eget risus varius blandit sit amet non magna.< / p >
< / div >
< / div >
< hr >
< div class = "footer" >
2013-01-10 11:14:14 +01:00
< p > © Company 2013< / p >
2012-10-01 06:28:20 +02:00
< / div >
< / div > <!-- /container -->
2013-01-18 05:39:38 +01:00
<!-- Bootstrap core JavaScript
2012-10-01 06:28:20 +02:00
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
< script src = "../assets/js/jquery.js" > < / script >
< script src = "../assets/js/bootstrap-transition.js" > < / script >
< script src = "../assets/js/bootstrap-alert.js" > < / script >
< script src = "../assets/js/bootstrap-modal.js" > < / script >
< script src = "../assets/js/bootstrap-dropdown.js" > < / script >
< script src = "../assets/js/bootstrap-scrollspy.js" > < / script >
< script src = "../assets/js/bootstrap-tab.js" > < / script >
< script src = "../assets/js/bootstrap-tooltip.js" > < / script >
< script src = "../assets/js/bootstrap-popover.js" > < / script >
< script src = "../assets/js/bootstrap-button.js" > < / script >
< script src = "../assets/js/bootstrap-collapse.js" > < / script >
< script src = "../assets/js/bootstrap-carousel.js" > < / script >
< script src = "../assets/js/bootstrap-typeahead.js" > < / script >
< / body >
< / html >
