|
|
@@ -0,0 +1,278 @@ |
|
|
<!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"> |
|
|
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> |
|
|
<meta name="description" content=""> |
|
|
<meta name="author" content=""> |
|
|
<link rel="icon" href="../../favicon.ico"> |
|
|
|
|
|
<title>Box Industries</title> |
|
|
|
|
|
<!-- Latest compiled and minified CSS --> |
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> |
|
|
|
|
|
<!-- Optional theme --> |
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> |
|
|
|
|
|
<!-- Latest compiled and minified JavaScript --> |
|
|
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> |
|
|
|
|
|
<!-- Custom overide --> |
|
|
<link href="resource/css/overwrite.css" style ="text/css" rel="stylesheet"> |
|
|
|
|
|
<style type = "text/css"> |
|
|
/* Space out content a bit */ |
|
|
body { |
|
|
padding-top: 20px; |
|
|
padding-bottom: 20px; |
|
|
} |
|
|
|
|
|
/* Everything but the jumbotron gets side spacing for mobile first views */ |
|
|
.header, |
|
|
.marketing, |
|
|
.footer { |
|
|
padding-right: 15px; |
|
|
padding-left: 15px; |
|
|
} |
|
|
|
|
|
/* Custom page header */ |
|
|
.header { |
|
|
padding-bottom: 20px; |
|
|
border-bottom: 1px solid #e5e5e5; |
|
|
} |
|
|
/* Make the masthead heading the same height as the navigation */ |
|
|
.header h3 { |
|
|
margin-top: 0; |
|
|
margin-bottom: 0; |
|
|
line-height: 40px; |
|
|
} |
|
|
|
|
|
/* Custom page footer */ |
|
|
.footer { |
|
|
padding-top: 19px; |
|
|
color: #777; |
|
|
border-top: 1px solid #e5e5e5; |
|
|
} |
|
|
|
|
|
/* Customize container */ |
|
|
@media (min-width: 768px) { |
|
|
.container { |
|
|
max-width: 730px; |
|
|
padding:0; |
|
|
} |
|
|
} |
|
|
.container-narrow > hr { |
|
|
margin: 30px 0; |
|
|
} |
|
|
|
|
|
/* Main marketing message and sign up button */ |
|
|
.jumbotron { |
|
|
text-align: center; |
|
|
border-bottom: 1px solid #e5e5e5; |
|
|
} |
|
|
.jumbotron .btn { |
|
|
padding: 14px 24px; |
|
|
font-size: 21px; |
|
|
} |
|
|
|
|
|
/* Supporting marketing content */ |
|
|
.marketing { |
|
|
margin: 40px 0; |
|
|
} |
|
|
.marketing p + h4 { |
|
|
margin-top: 28px; |
|
|
} |
|
|
|
|
|
/* Responsive: Portrait tablets and up */ |
|
|
@media screen and (min-width: 768px) { |
|
|
/* Remove the padding we set earlier */ |
|
|
.header, |
|
|
.marketing, |
|
|
.footer { |
|
|
padding-right: 0; |
|
|
padding-left: 0; |
|
|
} |
|
|
/* Space out the masthead */ |
|
|
.header { |
|
|
margin-bottom: 30px; |
|
|
} |
|
|
/* Remove the bottom border on the jumbotron for visual effect */ |
|
|
.jumbotron { |
|
|
border-bottom: 0; |
|
|
} |
|
|
|
|
|
.container{background-color:white;} |
|
|
|
|
|
.navbar-default{ |
|
|
background-image: none; |
|
|
-webkit-box-shadow: none; |
|
|
border-style : none; |
|
|
background-color: #388e3c; |
|
|
border-bottom: 1px solid #1B5E20; |
|
|
border-radius: 0; |
|
|
width:auto; |
|
|
padding:0; |
|
|
margin:0p |
|
|
} |
|
|
|
|
|
/******************************Nav Bar Branding Logo overide**************************/ |
|
|
.navbar-default .navbar-nav>li>a, .navbar-default .navbar-brand { |
|
|
color: #F5F5F5 ; |
|
|
} |
|
|
|
|
|
a:hover .navbar-brand{ |
|
|
color: #FFEB3B; |
|
|
} |
|
|
|
|
|
.navbar-default .navbar-brand a:hover{ |
|
|
color:blue; |
|
|
} |
|
|
|
|
|
|
|
|
/******************************End Branding Overside*********************************/ |
|
|
|
|
|
|
|
|
|
|
|
/******************************Nav Bar a text on Active overide**************************/ |
|
|
|
|
|
.navbar-default .navbar-nav>.active>a{ |
|
|
/*This is for the text inside the active block including background, |
|
|
and only the default text color not hover*/ |
|
|
|
|
|
color:#F5F5F5; |
|
|
background-color: #1B5E20; |
|
|
} |
|
|
|
|
|
/*This is for the text hover inside the active block, including hover background*/ |
|
|
|
|
|
.navbar-default .navbar-nav>.active>a:hover{ |
|
|
background-color: #1B5E20; |
|
|
color: #FFEB3B; |
|
|
} |
|
|
/******************************End Nav Bar a text on Active overide**************************/ |
|
|
a.drop-down-toggle{ |
|
|
|
|
|
} |
|
|
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{ |
|
|
color:#FFEB3B; |
|
|
background-color:#1B5E20; |
|
|
|
|
|
} |
|
|
|
|
|
* mobile version */ |
|
|
.navbar-default .navbar-toggle { |
|
|
border-color: white; |
|
|
} |
|
|
.navbar-default .navbar-toggle:hover, |
|
|
.navbar-default .navbar-toggle:focus { |
|
|
background-color: #7fbb4d; |
|
|
} |
|
|
.navbar-default .navbar-toggle .icon-bar { |
|
|
background-color:white; |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.navbar-default .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover{ |
|
|
color:green; |
|
|
} |
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
</style> |
|
|
</head> |
|
|
|
|
|
<body> |
|
|
|
|
|
<div class="container"> |
|
|
<div class="page-header"> |
|
|
<img class="center-block" src="resource/css/img/header.png" /> |
|
|
</div> |
|
|
<div class="header clearfix"> |
|
|
|
|
|
<!-- Static navbar --> |
|
|
<nav class="navbar navbar-default"> |
|
|
<div class="container-fluid"> |
|
|
<div class="navbar-header"> |
|
|
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> |
|
|
<span class="sr-only">Toggle navigation</span> |
|
|
<span class="icon-bar"></span> |
|
|
<span class="icon-bar"></span> |
|
|
<span class="icon-bar"></span> |
|
|
</button> |
|
|
<a class="navbar-brand" href="#">Box Ind</a> |
|
|
</div> |
|
|
<div id="navbar" class="navbar-collapse collapse"> |
|
|
<ul class="nav navbar-nav"> |
|
|
<li><a href="#">Home</a></li> |
|
|
<li><a href="#">About</a></li> |
|
|
<li><a href="#">Contact</a></li> |
|
|
<li class="dropdown"> |
|
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a> |
|
|
<ul class="dropdown-menu"> |
|
|
<li><a href="#">Action</a></li> |
|
|
<li><a href="#">Another action</a></li> |
|
|
<li><a href="#">Something else here</a></li> |
|
|
<li role="separator" class="divider"></li> |
|
|
<li class="dropdown-header">Nav header</li> |
|
|
<li><a href="#">Separated link</a></li> |
|
|
<li><a href="#">One more separated link</a></li> |
|
|
</ul> |
|
|
</li> |
|
|
</ul> |
|
|
</div><!--/.nav-collapse --> |
|
|
</div><!--/.container-fluid --> |
|
|
</nav> |
|
|
</div> |
|
|
|
|
|
<div class="jumbotron"> |
|
|
<h1>Jumbotron heading</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> |
|
|
<p><a class="btn btn-lg btn-success" href="#" role="button">Sign up today</a></p> |
|
|
</div> |
|
|
|
|
|
<div class="row marketing"> |
|
|
<div class="col-lg-6"> |
|
|
<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="col-lg-6"> |
|
|
<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> |
|
|
|
|
|
<footer class="footer"> |
|
|
<p>© Company 2014</p> |
|
|
</footer> |
|
|
|
|
|
</div> <!-- /container --> |
|
|
|
|
|
|
|
|
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> |
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> |
|
|
<script src="resource/js/bootstrap.min.js"></script> |
|
|
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> |
|
|
<script src="resource/js/ie10-viewport-bug-workaround.js"></script> |
|
|
</body> |
|
|
</html> |