1.form {
2  width: 290px;
3  height: 380px;
4  display: flex;
5  flex-direction: column;
6  border-radius: 15px;
7  background-color: white;
8  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
9  transition: .4s ease-in-out;
10}
11
12.form:hover {
13  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
14  scale: 0.99;
15}
16
17.heading {
18  position: relative;
19  text-align: center;
20  color: black;
21  top: 3em;
22  font-weight: bold;
23}
24
25.check {
26  position: relative;
27  align-self: center;
28  top: 4em;
29}
30
31.input {
32  position: relative;
33  width: 2.5em;
34  height: 2.5em;
35  margin: 1em;
36  border-radius: 5px;
37  border: none;
38  outline: none;
39  background-color: rgb(235, 235, 235);
40  box-shadow: inset 3px 3px 6px #d1d1d1,
41            inset -3px -3px 6px #ffffff;
42  top: 6.5em;
43  left: 1.5em;
44  padding-left: 15px;
45  transition: .4s ease-in-out;
46}
47
48.input:hover {
49  box-shadow: inset 0px 0px 0px #d1d1d1,
50            inset 0px 0px 0px #ffffff;
51  background-color: lightgrey;
52}
53
54.input:focus {
55  box-shadow: inset 0px 0px 0px #d1d1d1,
56            inset 0px 0px 0px #ffffff;
57  background-color: lightgrey;
58}
59
60.btn1 {
61  position: relative;
62  top: 8.5em;
63  left: 2.4em;
64  width: 17em;
65  height: 3em;
66  border-radius: 5px;
67  border: none;
68  outline: none;
69  transition: .4s ease-in-out;
70  box-shadow: 1px 1px 3px #b5b5b5,
71             -1px -1px 3px #ffffff;
72}
73
74.btn1:active {
75  box-shadow: inset 3px 3px 6px #b5b5b5,
76            inset -3px -3px 6px #ffffff;
77}
78
79.btn2 {
80  position: relative;
81  top: 9.5em;
82  left: 2.4em;
83  width: 17em;
84  height: 3em;
85  border-radius: 5px;
86  border: none;
87  outline: none;
88  transition: .4s ease-in-out;
89  box-shadow: 1px 1px 3px #b5b5b5,
90             -1px -1px 3px #ffffff;
91}
92
93.btn2:active {
94  box-shadow: inset 3px 3px 6px #b5b5b5,
95            inset -3px -3px 6px #ffffff;
96}