-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
113 lines (105 loc) · 8.29 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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!DOCTYPE html>
<html>
<head>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
<!--custom css-->
<link type="text/css" rel="stylesheet" href="css/style.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<nav class="nav-extended carbonsafety-primary-background">
<div class="container">
<div class="nav-wrapper">
<a nohref="#!" class="brand-logo center"><img class="responsive-img" src="img/carbon-safety-logo-trans.png" width="175" height="auto" alt="Carbon Safety"></a>
<a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="material-icons">menu</i></a>
<ul class="left hide-on-med-and-down">
<li class="active"> <a href="#">Home</a></li>
<li><a href="http://carbonsafety.ca/">Carbon Safety</a></li>
</ul>
</div>
</div>
</nav>
<ul class="sidenav" id="mobile-demo">
<li class="active"> <a href="#">Home</a></li>
<li><a href="http://carbonsafety.ca/">Carbon Safety</a></li>
</ul>
<!-- End nav bar start actual content -->
<section class="container">
<!--
Trying to fit the image into the viewport with old large image size was proving difficult,
as scaling the image with css is harder when we are using an img tag to src the background,
rather than using css's url functionality, cant do that because we have coordinates.
So manually resized the image in Glimpse, and created a more proffessional software generated
image map. the IBC culture atoms start at 0 and count top to bottom left to right.
-->
<img class="responsive-img" src="img/carbon-image-trans-scaled.png" width="1000" height="913" border="0" usemap="#map" />
<map name="map">
<area class="tooltipped " data-tooltip="Identify the activities, tasks, hazards, energy and harm that may exist in the workplace" shape="circle" coords="500,193,34" alt="Identify-Energy-Harm" href="identify-energy.html"/>
<area class="tooltipped" data-tooltip="The targets that may be exposed to the sources of energy or harm" shape="circle" coords="502,717,33" alt="Identify-targets" href="identify-targets.html"/>
<area class="tooltipped" data-tooltip="RISK – Identifying and applying reasonable safety expectations (Objectives and targets)" shape="circle" coords="224,176,35" alt="Reasonable-expectations" nohref="#"/>
<area class="tooltipped" data-tooltip="Review existing interventions, barriers and controls for effectiveness, consider any new IBC’s " shape="circle" coords="778,179,35" alt="IBC" nohref="#"/>
<area class="tooltipped" data-tooltip="Adapting to internal and external influences that may impact safety within the organization, or that the organization itself " shape="circle" coords="890,456,34" alt="External" nohref="#"/>
<area class="tooltipped" data-tooltip="Defining safety within the organization" shape="circle" coords="778,733,34" alt="Safety" nohref="#"/>
<area class="tooltipped" data-tooltip="What knowledge is required in order to manage the energy/harm, and targets" shape="circle" coords="222,733,34" alt="Knowledge" nohref="#"/>
<area class="tooltipped" data-tooltip="Adapting to internal and external influences that may impact safety within the organization, or that the organization itself " shape="circle" coords="109,456,32" alt="Internal" nohref="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm" shape="circle" coords="500,346,22" alt="culture-0" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm" shape="circle" coords="438,395,23" alt="culture-1" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="498,406,22" alt="culture-2" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="562,395,22" alt="culture-3" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="391,456,22" alt="culture-4" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="464,456,22" alt="culture-5" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="537,457,23" alt="culture-6" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="610,455,23" alt="culture-7" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="438,518,22" alt="culture-8" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="501,506,21" alt="culture-9" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="561,518,22" alt="culture-10" href="#"/>
<area class="tooltipped" data-tooltip="Identify what existing interventions, barriers and controls exist to prevent energy release or cause of harm " shape="circle" coords="499,565,22" alt="culture-11" href="#"/>
</map>
</section>
<!-- Footer -->
<footer class="page-footer carbonsafety-primary-background">
<div class="container">
<div class="row">
<div class="col l6 s12">
<h5 class="white-text">Carbon Solutions</h5>
<p class="grey-text text-lighten-4">Write something about the company here</p>
</div>
<div class="col l4 offset-l2 s12">
<h5 class="white-text">Maybe quick links to other usefull websites</h5>
<ul>
<li><a class="grey-text text-lighten-3" href="#!">Something customer should know</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Something customer should know</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Something customer should know</a></li>
<li><a class="grey-text text-lighten-3" href="#!">Something customer should know</a></li>
</ul>
</div>
</div>
</div>
<div class="footer-copyright">
<div class="container">
© 2020 Carbon Safety Ltd. All rights reserved.
<a class="grey-text text-lighten-4 right" href="#!">Other links to usefull important relavent information</a>
</div>
</div>
</footer>
<!-- Add Jquery cdn before materialize -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- add custom responsive image mapping code -->
<script src="js/jquery.rwdImageMaps.min.js"></script>
<!--JavaScript at end of body for optimized loading-->
<script type="text/javascript" src="js/materialize.min.js"></script>
<!-- Custom javascript files to be included last -->
<!-- script.js is just for materialize functionality -->
<script type="text/javascript" src="js/script.js"></script>
<!-- This Jquery call is for the responsive image mapping -->
<script>
$(document).ready(function(e) {
$('img[usemap]').rwdImageMaps();
});
</script>
</body>
</html>