<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 ---------->
<html lang="en"><head>
<title>HTML</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Lato:100,300,400,700|Roboto:300,400,500,700&display=swap" rel="stylesheet">
<!--<link rel="stylesheet" href="./css/bootstrap.min.css"> -->
<script src="https://kit.fontawesome.com/a076d05399.js"></script>
<link rel="stylesheet" href="./css/font-awesome.min.css">
<!--[if IE]> <link href="~/Content/NewHomePage/all-ie-only.css" rel="stylesheet" /> <![endif]-->
<link rel="stylesheet" href="./css/style.css">
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col">
<div class="alert alert-success" role="alert">
1/1 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="alert alert-success" role="alert">
1/2 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
2/2 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="alert alert-success" role="alert">
1/3 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
2/3 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
3/3 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="alert alert-success" role="alert">
1/4 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
2/4 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
3/4 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
4/4 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="alert alert-success" role="alert">
1/5 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
2/5 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
3/5 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
4/5 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
5/5 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="alert alert-success" role="alert">
1/7 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
2/7 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
3/7 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
4/7 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
5/7 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
6/7 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
7/7 A simple success alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="alert alert-success" role="alert">
8/8 A simple success alert with
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
8/8 A simple success alert with
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
8/8 A simple success alert with
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
8/8 A simple success alert with
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
8/8 A simple success alert with
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
8/8 A simple success alert with
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
8/8 A simple success alert with
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
8/8 A simple success alert with
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
<div class="col">
<div class="alert alert-success" role="alert">
12/12
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<!--
<script src="./js/jquery.min.js"></script>
<script src="./js/popper.min.js"></script>
<script src="./js/bootstrap.min.js"></script>
<script src="./js/custom.js"></script>
-->
</body>
</html>
// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) { ... }
// Small devices (landscape phones, less than 768px)
@media (max-width: 767.98px) { ... }
// Medium devices (tablets, less than 992px)
@media (max-width: 991.98px) { ... }
// Large devices (desktops, less than 1200px)
@media (max-width: 1199.98px) { ... }
// Extra large devices (large desktops)
// No media query since the extra-large breakpoint has no upper bound on its width
// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) { ... }
// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) and (max-width: 767.98px) { ... }
// Medium devices (tablets, 768px and up)
@media (min-width: 768px) and (max-width: 991.98px) { ... }
// Large devices (desktops, 992px and up)
@media (min-width: 992px) and (max-width: 1199.98px) { ... }
// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
