Getting Started
The Montana Department of Labor & Industry is currently using Bootstrap v3.3.7. Bootstrap is an open-source front-end web framework for designing websites and web applications.
CDN
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="//dlicdn.mt.gov/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="//dlicdn.mt.gov/css/dli-styles.css">
<!-- Latest compiled and minified JS -->
<script type="text/javascript" src="//dlicdn.mt.gov/js/jquery1.12.4.min.js"></script>
<script type="text/javascript" src="//dlicdn.mt.gov/bootstrap/js/bootstrap.min.js"></script>
MT.GOV Template Implementation Guide
Basic Template
<!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">
<title>Document Title</title>
<link href="https://template.mt.gov/resources/template/template-min.css" rel="stylesheet" type="text/css">
<link href="//dlicdn.mt.gov/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="//dlicdn.mt.gov/css/dli-styles.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="template-header-wrapper">
<header id="template-header"></header>
</div>
<div id="template-page-wrapper">
<div id="dli-container" class="container">
<header id="dli-header" class="row">
<div id="dli-logo" class="col-md-6">
<a href="http://dli.mt.gov">
<img src="http://dlicdn.mt.gov/img/dli-hor-logo.png" alt="Montana Department of Labor & Industry"/>
</a>
</div>
<div class="col-md-6">
<div class="row">
<div id="dli-social" class="col-md-5 visible-md visible-lg">
<ul>
<li>
<a href="https://facebook.com/MTDLI/" target="_blank">
<img src="//dlicdn.mt.gov/img/fb_social.png" alt="Visit Our Facebook Page" />
<span class="sr-only">Opens in new window</span>
</a>
</li>
<li>
<a href="http://youtube.com/user/mtlaborandindustry" target="_blank">
<img src="//dlicdn.mt.gov/img/youtube_social.png" alt="Visit Our YouTube Channel"/>
<span class="sr-only">Opens in new window</span>
</a>
</li>
<li>
<a href="https://linkedin.com/company/montana-department-of-labor-&-industry" target="_blank">
<img src="//dlicdn.mt.gov/img/linkedin_social.png" alt="View Our LinkedIn Profile"/>
<span class="sr-only">Opens in new window</span>
</a>
</li>
</ul>
</div>
<div class="col-md-7">
<div id="search-wrapper">
<div id="search-form" class="form-inline" role="search">
<div class="form-group">
<label class="sr-only" for="search-url">Search DLI...</label>
<input id="search-url" class="pull-left"type="text" value="" placeholder="Search DLI..."/>
</div>
<div class="form-group">
<input id="q-submit" type="image" class="srch-btn pull-right" src="//dlicdn.mt.gov/images/search_icon.png" alt="Search"/>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<nav id="dli-breadcrumb" class="row">
<div class="col-lg-12">
//
// Optional breadcrumb. This container can be removed
//
</div>
</nav>
<main id="maincontent" name="maincontent" class="row" tabindex="-1">
//
//Content Here
//
</main>
<nav id="dli-footer" class="row" role="navigation">
<div class="col-lg-12">
//
// Optional footer links. This container can be removed
//
</div>
</nav>
<footer id="sub-footer" class="row">
<div class="col-lg-12 text-center">
<p id="footer-info">Montana Department of Labor & Industry</p>
</div>
</footer>
</div>
</div>
<div id="template-footer-wrapper">
<footer id="template-footer"></footer>
</div>
<script type="text/javascript" src="//dlicdn.mt.gov/js/jquery1.12.4.min.js"></script>
<script type="text/javascript" src="//dlicdn.mt.gov/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://template.mt.gov/resources/template/template-min.js"></script>
</body>
</html>