-
Notifications
You must be signed in to change notification settings - Fork 0
/
start.html
130 lines (115 loc) · 3.8 KB
/
start.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
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-UK">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Testing Range</title>
<!-- <link href="style.css" rel="stylesheet" type="text/css" ; /> -->
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Noto+Serif|Noto+Sans:wght@100|Barlow:wght@0,100;">
<style>
body {
background-color: #222222;
opacity: 1;
background-image: linear-gradient(30deg, #333333 12%, transparent 12.5%, transparent 87%, #333333 87.5%, #333333), linear-gradient(150deg, #333333 12%, transparent 12.5%, transparent 87%, #333333 87.5%, #333333), linear-gradient(30deg, #333333 12%, transparent 12.5%, transparent 87%, #333333 87.5%, #333333), linear-gradient(150deg, #333333 12%, transparent 12.5%, transparent 87%, #333333 87.5%, #333333), linear-gradient(60deg, #33333377 25%, transparent 25.5%, transparent 75%, #33333377 75%, #33333377), linear-gradient(60deg, #33333377 25%, transparent 25.5%, transparent 75%, #33333377 75%, #33333377);
background-size: 54px 95px;
background-position: 0 0, 0 0, 27px 47px, 27px 47px, 0 0, 27px 47px;
}
h2 {
color: blue;
}
h1.noto {
font-family: "Noto Serif", serif;
font-weight: 800;
}
q {
color: yellow;
font-family: verdana;
border: 2px solid goldenrod;
padding: 5;
margin: 50px;
}
.centered1 {
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
font-family: 'Barlow', sans-serif;
font-size: 4vw;
font-weight: 100;
margin-top: 0em;
color: #ffffff;
text-shadow: 0px 0px 20px #000000;
}
.centered1sub {
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
font-family: 'Barlow', sans-serif;
font-size: 4vw;
font-weight: 100;
margin-top: -1.6em;
margin-bottom: 2em;
color: #999999;
text-shadow: 0px 0px 20px #000000;
}
.centered2 {
margin-right: 10vw;
margin-left: -10vw;
text-align: left;
font-family: 'Barlow', sans-serif;
font-size: 4vw;
font-weight: 100;
color: #ffffff;
margin-top: 0em;
text-shadow: 0px 0px 20px #000000;
}
.centered2b {
margin-right: 10vw;
margin-left: -10vw;
text-align: left;
font-family: 'Barlow', sans-serif;
font-size: 3vw;
font-weight: 100;
color: #999999;
margin-top: -0.5em;
text-shadow: 0px 0px 20px #000000;
}
.container {
margin-top: -0.1em;
display: grid;
align-items: center;
grid-template-columns: 1fr 1fr;
column-gap: 10vw;
}
align-items: center;
.shadow {
filter: drop-shadow(0px 0px 10px #000000);
}
.shadow:hover{
filter: invert(1);
}
</style>
</head>
<body>
<h1 class="centered1">Provenzani Maxim</h1>
<div class="container">
<a href="/who.html"><img class="shadow" src="FileClosed.svg" alt="File" style="max-width: 70%; height: 90%;margin-left: 10vw;"></a>
<div>
<h1 class="centered2">First of all, who am I ?</h1>
<h1 class="centered2b">Get to know me a little better than a simple url !</h1>
</div>
</div>
<div class="container">
<a href="/works.html"><img class="shadow" src="FileClosed.svg" alt="File" style="max-width: 70%; height: 90%;margin-left: 10vw;"></a>
<div>
<h1 class="centered2">Some of my work !</h1>
<h1 class="centered2b">A peek at what I've been up to recently !</h1>
</div>
</div>
<div class="container">
<a href="/start.html"><img class="shadow" src="FileClosed.svg" alt="File" style="max-width: 70%; height: 90%;margin-left: 10vw;"></a>
</div>
</body>
</html>