-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathindex.html
236 lines (236 loc) · 12.6 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
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="University Research Group is the official website for the bioengineering team of the university of Granada">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/Wruczek/Bootstrap-Cookie-Alert@gh-pages/cookiealert.css">
<!-- Fontawesome -->
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/>
<!-- Favicon -->
<link rel="apple-touch-icon" sizes="180x180" href="assets/favicon_io/favicon.ico">
<link rel="icon" type="image/png" sizes="32x32" href="assets/favicon_io/favicon.ico">
<link rel="icon" type="image/png" sizes="16x16" href="assets/favicon_io/favicon.ico">
<!-- CSS -->
<link rel="stylesheet" href="assets/css/style.css" type="text/css">
<title>Magnetic Soft Matter Group</title>
</head>
<body>
<!-- Header -->
<header>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="index.html">
<img id="top-logo" src="assets/images/logo/final_logo.png" alt="logo">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-lg-end" id="navbarNavDropdown">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link current" href="index.html">Home
<span class="sr-only">(current)</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="people.html">People</a>
</li>
<li class="nav-item">
<a class="nav-link" href="projects.html">Projects</a>
</li>
<li class="nav-item">
<a class="nav-link" href="publications.html">Publications</a>
</li>
</ul>
</div>
</nav>
</header>
<!-- Introductory jumbotron -->
<div class="jumbotron jumbotron-fluid bg-dark" id="index_jtron_top">
<div class="mid-jumbotron-background">
<img src="assets/images/index/jtron_index_intro.jpeg" alt="jumbotron background" class="blur">
</div>
<div class="text-white container">
<h2 class="display-4">Magnetic Soft Matter Group</h2>
<p class="lead">Research on sustainable materials</p>
<hr class="my-4">
</div>
</div>
<!-- Introductory carousel -->
<div>
<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="assets/images/index/lab5.jpg" class="d-block w-100 img-resize" alt="laboratory">
</div>
<div class="carousel-item">
<img src="assets/images/index/lab1.jpeg" class="d-block w-100 img-resize" alt="laboratory">
</div>
<div class="carousel-item">
<img src="assets/images/index/lab6.jpg" class="d-block w-100 img-resize" alt="laboratory">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
<!-- Intro card 1-->
<div class="container" id="home-card-1">
<div class="card">
<div class="card-body">
<h5 class="card-title-home">A Mission</h5>
<p class="card-text">Oil reserves are dwindling, carbon dioxide concentrations in the atmosphere are increasing at an unmatched dizzying pace and levels of pollution in mega cities are unbearable.
All these problems are rooted in the way we power our economies; that is still mainly by fossil fuels. Hence, newly engineered green materials based on renewable and abundant resources as well as less energy consuming processing strategies are highly needed.
</p>
<p class="card-text">
<small class="text-muted"></small>
</p>
</div>
<img src="assets/images/index/scientist.jpg" class="card-img-bottom" alt="scientist">
</div>
</div>
<!-- Jumbotron with a call to action btn -->
<div class="jumbotron jumbotron-fluid bg-dark">
<div class="mid-jumbotron-background">
<img src="assets/images/index/jtron_mpage_index.jpg" class="blur " alt="jumbotron background books">
</div>
<div class="mid-container text-white">
<h2 class="display-4">Welcome to the Campus!</h2>
<p class="lead">An international well established team with the passion for Magnetic research</p>
<hr class="my-4">
<p>Discover our research group
<span>
<i class="fas fa-atom" id="btn-icon"></i>
</span>
</p>
<a class="btn btn-secondary btn-lg" id="main-page-btn" href="people.html" role="button">Learn more</a>
</div>
</div>
<!-- Intro card 2-->
<div class="container" id="home-card-2">
<div class="card mb-3">
<img src="assets/images/index/microscope.jpeg" class="card-img-top" alt="microscope">
<div class="card-body">
<h5 class="card-title-home">Researching thoroughly</h5>
<p class="card-text">The vast majority of materials we prepare are carbon-based and are synthesised through benign processing methods, like hydrothermal carbonisation and electrospinning.
After synthesis and characterization, we test our materials in the target applications on a full device level.
Thus, we cover the entire process chain from the raw material to the final application which gives us the opportunity to tailor materials properties towards the final application. .
</p>
<p class="card-text">
<small class="text-muted"></small>
</p>
</div>
</div>
</div>
<!-- Footer -->
<footer>
<div class="footer-style">
<div class="container">
<div class="row justify-content-center">
<div class="col-sm-4 col-md-3 item">
<ul>
<li>
<!-- Link University -->
<a href="https://www.ugr.es/en" aria-label="granada university link" target="_blank">
<img src="assets/images/index/granada_logo2.jpg" id="granada_logo" alt="university logo">
</a>
</li>
</ul>
</div>
<div class="col-sm-4 col-md-3 item">
<h3>Location</h3>
<ul>
<li>
<span class="footer-icon">
<i class="fas fa-map-marker-alt"></i>
</span>
<!-- Link Google Maps -->
<a href="https://www.google.ie/maps/place/Universit%C3%A0+di+Granada/@37.1838203,-3.6028988,17z/data=!3m1!4b1!4m5!3m4!1s0xd71fcdc123151a3:0x580c6fbc4062f1f5!8m2!3d37.183816!4d-3.6007101?hl=it" target="_blank">Hospital Real, Avenida del Hospicio, S/N C.P. 18010 CP:18071 Granada, Spain</a>
</li>
</ul>
</div>
<div class="col-sm-4 col-md-3 item">
<h3>Contacts</h3>
<ul>
<li>
<span class="footer-icon">
<i class="far fa-envelope"></i>
</span>
<!-- Mailto -->
<a id="email-link" class="footer-text" href="mailto:[email protected]">[email protected]</a>
</li>
<li>
<span class="footer-icon">
<i class="fas fa-map-fas fa-phone"></i>
</span>
<!-- Callto -->
<a id="phone-link" aria-label="phone link" class="footer-text" href="+34958243000">+34 958 24 30 00</a>
</li>
</ul>
</div>
<div class="col-lg-3 item social">
<!-- Link Facebook -->
<a href="https://www.facebook.com/" aria-label="facebook link" target="_blank">
<i class="fab fa-facebook"></i>
</a>
<!-- Link Twitter -->
<a href="https://twitter.com/?lang=en" aria-label="twitter link" target="_blank">
<i class="fab fa-twitter-square"></i>
</a>
<!-- Link LinkedIn -->
<a href="https://www.linkedin.com/" aria-label="linkedinlink" target="_blank">
<i class="fab fa-linkedin"></i>
</a>
<!-- Link Instagram -->
<a href="https://www.instagram.com/" aria-label="instagram link" target="_blank">
<i class="fab fa-instagram"></i>
</a>
<p class="copyright">Powered by F_N_ © 2021</p>
</div>
</div>
</div>
<!--Button that takes you back to the top to facilitate - especially mobile- navigation-->
<div class="container">
<div class="row top-nav-button justify-content-center">
<div class="btn-align">
<a href="#" class="btn">Back to the top
<i class="fas fa-level-up-alt"></i>
</a>
</div>
</div>
</div>
</div>
</footer>
<!-- Cookie-Alert -->
<div class="container">
<div class="alert text-center cookiealert" role="alert">
<b>Do you like cookies?</b> 🍪 We use cookies to ensure you get the best experience on our website.
<a href="https://cookiesandyou.com/" target="_blank"><span id="learn-more">Learn More</span></a>
<button type="button" class="btn btn-secondary btn-sm acceptcookies">
I agree
</button>
</div>
</div>
<!-- CDN JQuery -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<!-- CDN Bootstrap 4.6 -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-+YQ4JLhjyBLPDQt//I+STsc9iw4uQqACwlvpslubQzn4u2UU2UFM80nGisd026JF" crossorigin="anonymous"></script>
<!-- CDN Cookies -->
<script src="https://cdn.jsdelivr.net/gh/Wruczek/Bootstrap-Cookie-Alert@gh-pages/cookiealert.js"></script>
<!-- Index JS -->
<script src="assets/js/index.js"></script>
</body>
</html>