106 lines
1.6 KiB
CSS
106 lines
1.6 KiB
CSS
@import url('https://static.ppsfleet.navy/fonts/Besley/style.css');
|
|
@import url('https://static.ppsfleet.navy/fonts/Bodoni/style.css');
|
|
body {
|
|
background-image: url("./b3.jpg");
|
|
background-size:cover;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction:column;
|
|
padding:2rem;
|
|
}
|
|
|
|
nav {
|
|
|
|
|
|
display: flex;
|
|
justify-content:center;
|
|
align-items:center;
|
|
gap:1rem;
|
|
flex-wrap:wrap;
|
|
|
|
}
|
|
|
|
|
|
.glass {
|
|
|
|
border: 1px solid rgba(255, 255, 255, .25);
|
|
border-radius: 2px;
|
|
background-color: rgba(255, 255, 255, 0.45);
|
|
box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.25);
|
|
backdrop-filter: blur(1px);
|
|
|
|
}
|
|
|
|
.link {
|
|
padding: 0.4em 0.8em;
|
|
}
|
|
|
|
.glass.blue {
|
|
background-color:rgba(204, 190, 255, 0.6);
|
|
font-size:1.2em;
|
|
color: #2c00ca;
|
|
}
|
|
|
|
button {
|
|
border:none;
|
|
display: block;
|
|
|
|
padding: 0.4em 0.8em;
|
|
/* background: #0B1028;
|
|
border:2px solid #5276FE;
|
|
backdrop-filter: blur(1px);
|
|
color:white;*/
|
|
font-size:1.2em;
|
|
display: flex;
|
|
gap:0.5em;
|
|
|
|
}
|
|
|
|
button.glass {
|
|
border-radius: 39px;
|
|
border-width: 2px;
|
|
}
|
|
|
|
button .label{
|
|
flex:1;
|
|
}
|
|
|
|
button .icon {
|
|
height:1em;
|
|
}
|
|
|
|
main {
|
|
/*flex:1;
|
|
display: flex;
|
|
justify-content:center;
|
|
align-items:center;
|
|
gap:1rem;*/
|
|
margin:auto;
|
|
}
|
|
|
|
|
|
|
|
.mot {
|
|
padding: 3rem;
|
|
font-size:2rem;
|
|
font-weight:700;
|
|
animation-duration: 1.5s;
|
|
animation-name: opacity-on;
|
|
font-family: 'Bodoni';
|
|
width: fit-content;
|
|
display:inline-block;
|
|
margin:1rem;
|
|
}
|
|
|
|
@keyframes opacity-on {
|
|
from {
|
|
opacity:0;
|
|
backdrop-filter: blur(0px);
|
|
}
|
|
|
|
to {
|
|
opacity:1;
|
|
backdrop-filter: blur(1px);
|
|
}
|
|
}
|