You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
54 lines
1.1 KiB
54 lines
1.1 KiB
// Preloader |
|
|
|
#preloader { |
|
position: fixed; |
|
top: 0; |
|
left: 0; |
|
width: 100%; |
|
height: 100%; |
|
z-index: 999; |
|
background-color: var(--white); |
|
} |
|
|
|
#loader { |
|
display: block; |
|
position: relative; |
|
left: 50%; |
|
top: 50%; |
|
width: 150px; |
|
height: 150px; |
|
margin: -75px 0 0 -75px; |
|
border-radius: 50%; |
|
border: 3px solid transparent; |
|
border-top-color: var(--main-color-one); |
|
-webkit-animation: cxuSpin 2s linear infinite; |
|
animation: cxuSpin 2s linear infinite; |
|
|
|
&::before { |
|
content: ""; |
|
position: absolute; |
|
top: 5px; |
|
left: 5px; |
|
right: 5px; |
|
bottom: 5px; |
|
border-radius: 50%; |
|
border: 3px solid transparent; |
|
border-top-color: var(--black-2); |
|
-webkit-animation: cxuSpin 3s linear infinite; |
|
animation: cxuSpin 3s linear infinite; |
|
} |
|
|
|
&::after { |
|
content: ""; |
|
position: absolute; |
|
top: 15px; |
|
left: 15px; |
|
right: 15px; |
|
bottom: 15px; |
|
border-radius: 50%; |
|
border: 3px solid transparent; |
|
border-top-color: var(--secondary); |
|
-webkit-animation: cxuSpin 1.5s linear infinite; |
|
animation: cxuSpin 1.5s linear infinite; |
|
} |
|
} |