-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
56 lines (49 loc) · 2.58 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta -->
<meta charset="UTF-8" />
<title>Musem of The Bible Assesment - Andrew Callander</title>
<!-- Styles -->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<link rel="stylesheet" href="styles/index.css">
<!-- Fonts -->
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Raleway:400,500,600,700|Roboto:300,400,500,700">
<!-- Scripts -->
<script src="//code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
</head>
<body>
<section class="block">
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-6">
<div class="card">
<h3 class="card-header">Technology</h3>
<div class="card-block">
<h4 class="card-title">Digital Guide</h4>
<p class="card-text">Mauris nisl velit, aliquet non tellus sit amet, rhoncus rhoncus enim. Aliquam efficitur tempus facilisis. Nulla leo ipsum, maximus vel augue in, luctus rhoncus leo. Maecenas posuere dignissim massa at porttitor.</p>
<a href="#" class="btn btn-lnmore">Learn More</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-6">
<div class="hero">
<div class="overlay"></div>
<div class="hero-img"></div>
</div>
</div>
</div>
</div>
</section>
<!-- Scripts -->
<script type="text/javascript">
$(document).ready(function() {
$(".btn-lnmore").hover(function() {
$('.hero-img').toggleClass("hero-toggle").toggleClass('overlay-toggle').toggleClass('card-toggle').toggleClass('card-header-toggle');
});
});
</script>
</body>
</html>