source: source/freeparkingspace/src/main/resources/static/css/style.css@ 31d67c0

Last change on this file since 31d67c0 was 31d67c0, checked in by zlatko2810 <zlatko.stojanovski@…>, 22 months ago

proekt

  • Property mode set to 100644
File size: 4.9 KB
Line 
1@import url('https://fonts.googleapis.com/css?family=Montserrat:500');
2@import url('https://fonts.googleapis.com/css2?family=Crete+Round&family=Roboto:ital,wght@0,900;1,900&display=swap');
3
4:root {
5 --shadow-color: #FF9E9E;
6 --shadow-color-light: white;
7}
8
9.navbar {
10 max-width: 100%;
11 height: 100%;
12 background: rgba(0,0,0,0.25);
13}
14
15header {
16 display: flex;
17 justify-content: center;
18 align-items: center;
19 padding: 30px 10%;
20 max-width: 100%;
21 height: 10%;
22 background-color: rgb(0, 0, 0, 0.25);
23 border: none;
24}
25
26table{
27 color: white;
28 font-size: 0.3rem;
29 background: rgba(255,255,255,0.05);
30}
31
32img {
33 width: 120px;
34 height: 120px;
35}
36html{
37 text-align: center;
38}
39body {
40 padding: 0;
41 margin: 0;
42 max-width: 100%;
43 background-image: url('../images/background2.jpg');
44 object-fit: cover;
45 height: 100vh;
46 background-size: cover;
47 background-repeat: no-repeat;
48 text-align: center;
49}
50
51
52li,
53a:not(.btn) {
54 font-family: "Montserrat", sans-serif;
55 font-weight: 500;
56 font-size: 1.2rem;
57 text-decoration: none;
58 color: white;
59 padding: 10%;
60 list-style: none;
61}
62
63h1{
64 font-family: 'Roboto', sans-serif;
65 font-width: 900;
66 font-size: 5rem;
67
68}
69
70.right {
71 display: flex;
72 align-items: center;
73 justify-content: center;
74 background-color: rgb(0, 225, 255, 0.05);
75 border-radius: 10%;
76 flex-direction: row;
77 margin-left: 25%;
78 width: 17%;
79 height: 2%;
80}
81
82.right a {
83 margin: -5px;
84}
85.navbar{
86 max-width: 100%;
87 height: 100vh;
88}
89
90.reg {
91 color: rgb(255, 0, 0);
92}
93
94ul {
95 display: flex;
96 flex-direction: row;
97}
98
99li,
100a:hover {
101 color: red;
102 font-size: 1.3rem;
103}
104
105.reg:hover {
106 color: white;
107}
108.container-main{
109 display: flex;
110 flex-direction: column;
111 align-items: center;
112 justify-content: center;
113 width: 100%;
114 height: 100%
115}
116P{
117 font-family: "Montserrat", sans-serif;
118 font-weight: 500;
119 font-size: 4rem;
120 text-decoration: none;
121 color: white;
122 width: 80%;
123 list-style: none;
124 margin-top: -2%;
125}
126
127.glow{
128 text-transform: uppercase;
129 height: auto;
130 text-align: center;
131}
132
133.glow {
134 color: white;
135 animation: neon 3s infinite;
136}
137
138.h1Combined{
139 display: flex;
140 flex-direction: row;
141 align-items: center;
142 justify-content: center;
143 max-width: 100%;
144}
145
146@keyframes neon {
147 0% {
148 text-shadow: -1px -1px 1px var(--shadow-color-light), -1px 1px 1px var(--shadow-color-light), 1px -1px 1px var(--shadow-color-light), 1px 1px 1px var(--shadow-color-light),
149 0 0 3px var(--shadow-color-light), 0 0 10px var(--shadow-color-light), 0 0 20px var(--shadow-color-light),
150 0 0 30px var(--shadow-color), 0 0 40px var(--shadow-color), 0 0 50px var(--shadow-color), 0 0 70px var(--shadow-color), 0 0 100px var(--shadow-color), 0 0 200px var(--shadow-color);
151 }
152 50% {
153 text-shadow: -1px -1px 1px var(--shadow-color-light), -1px 1px 1px var(--shadow-color-light), 1px -1px 1px var(--shadow-color-light), 1px 1px 1px var(--shadow-color-light),
154 0 0 5px var(--shadow-color-light), 0 0 15px var(--shadow-color-light), 0 0 25px var(--shadow-color-light),
155 0 0 40px var(--shadow-color), 0 0 50px var(--shadow-color), 0 0 60px var(--shadow-color), 0 0 80px var(--shadow-color), 0 0 110px var(--shadow-color), 0 0 210px var(--shadow-color);
156 }
157 100% {
158 text-shadow: -1px -1px 1px var(--shadow-color-light), -1px 1px 1px var(--shadow-color-light), 1px -1px 1px var(--shadow-color-light), 1px 1px 1px var(--shadow-color-light),
159 0 0 3px var(--shadow-color-light), 0 0 10px var(--shadow-color-light), 0 0 20px var(--shadow-color-light),
160 0 0 30px var(--shadow-color), 0 0 40px var(--shadow-color), 0 0 50px var(--shadow-color), 0 0 70px var(--shadow-color), 0 0 100px var(--shadow-color), 0 0 200px var(--shadow-color);
161 }
162}
163
164.btn{
165 text-shadow: -1px -1px 10px rgba(255,255,255,0.5);
166 border: 1px solid #b70000;
167 color: white;
168 font-size: 3vw;
169 border:none;
170 background: #af0101;
171 padding: 0.5rem 1.3rem;
172 border-radius: 10%;
173 cursor: pointer;
174 transition: 1s ease;
175 display:block;
176 box-shadow: 3px 2px 10px #d50101,
177 -1px -1px 1px #e60000;
178 font-family: 'Roboto', sans-serif;
179 font-weight: 500;
180 text-decoration: none;
181 transition: infinite 1s ease;
182}
183
184.btn:hover{
185 background-color: #58ACFA;
186 color: white;
187}
188
189.btn2{
190 text-shadow: -1px -1px 10px rgba(255,255,255,0.5);
191 border: 1px solid #b70000;
192 color: white;
193 font-size: 1.5rem;
194 border:none;
195 background: #af0101;
196 padding: 0.5rem 1.3rem;
197 border-radius: 10%;
198 cursor: pointer;
199 transition: 1s ease;
200 display:block;
201 box-shadow: 3px 2px 10px #d50101,
202 -1px -1px 1px #e60000;
203 font-family: 'Roboto', sans-serif;
204 font-weight: 500;
205 text-decoration: none;
206 transition: infinite 1s ease;
207}
208
209.btn2:hover{
210 background-color: #58ACFA;
211 color: white;
212}
213
Note: See TracBrowser for help on using the repository browser.