JavaScriptProjectPictureInPicture/style.css at master · jthinlay/JavaScriptProjectPictureInPicture · GitHub

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
@importurl('https://fonts.googleapis.com/css2?family=Barlow:wght@100&display=swap');
html {
box-sizing: border-box;
}
body {
margin:0;
height:100vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color:rgb(1,37,7,23);
}
h1{
font-size:3rem;
color: darkgray;
text-shadow:02px5pxrgba(255,255,255,0.7);
margin-top:0px;
}
.button-container {
border:2px solid black;
padding:10px;
border-radius:7px;
box-shadow: inset 020px4px-19pxrgba(255,255,255,0.7);
}

button {
cursor: pointer;
outline: none;
width:120px;
height:75px;
font-family: Barlow, sans-serif;
font-size:25px;
color: white;
text-shadow:02px5px black;
background:linear-gradient(to top,#696969,#575757);
border:2px solid black;
border-radius:7px;
box-shadow: inset 020px4px-19pxrgba(255,255,255,0.4),012px12px0rgba(0,0,0,0.3);
}
button:hover {
background:linear-gradient(to bottom,#696969,#575757);
}
button:active {
transform:translate(3px);
box-shadow:06px6px0rgba(0,0,0,0.3);
}