533 lines
20 KiB
CSS
533 lines
20 KiB
CSS
@charset "UTF-8";
|
|
/*
|
|
¡¡¡ OPGELET !!!
|
|
Deze css bevat lelijke code.
|
|
Dit komt doordat bootstrap lelijk en oud is.
|
|
Ik zal later proberen de css te verbeteren en bootstrap weg te gooien.
|
|
Enige discretie is aangeraden.
|
|
|
|
---=§[ Arnhoudt ]§=---
|
|
|
|
*/
|
|
:root {
|
|
--gray0: #F28705;
|
|
--gray1: white;
|
|
--gray2: #590212;
|
|
--gray3: #590212;
|
|
--gray4: #274001;
|
|
--gray5: #274001;
|
|
--gray6: #F2778D;
|
|
--accent: #F2778D;
|
|
--bg: #2F0000;
|
|
--navbarBg: #F2778D;
|
|
--fontFamily: Radikal, Optima, Segoe, Segoe UI, Candara, Calibri, Arial, sans-serif; }
|
|
|
|
body {
|
|
height: 100%; }
|
|
|
|
@font-face {
|
|
font-family: Radikal;
|
|
src: url("static/fonts/radikal_regular.ttf");
|
|
font-weight: normal; }
|
|
@font-face {
|
|
font-family: Radikal;
|
|
src: url("static/fonts/radikal_light.ttf");
|
|
font-weight: 200; }
|
|
@font-face {
|
|
font-family: Radikal;
|
|
src: url("static/fonts/radikal_medium.ttf");
|
|
font-weight: medium; }
|
|
@font-face {
|
|
font-family: Radikal;
|
|
src: url("static/fonts/radikal_bold.ttf");
|
|
font-weight: bold; }
|
|
.btn {
|
|
border-radius: 5rem;
|
|
color: white;
|
|
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
|
|
background-image: linear-gradient(-40deg, #F53030, #F58B9E); }
|
|
|
|
.btn:hover {
|
|
background-image: linear-gradient(-40deg, #A81111, #FF4B33); }
|
|
|
|
.navbar {
|
|
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
|
|
padding: 1.5rem;
|
|
background-color: transparent;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
text-transform: capitalize; }
|
|
|
|
.nav > li > a {
|
|
padding-left: 1vw;
|
|
padding-right: 1vw; }
|
|
|
|
.main {
|
|
height: 90vh;
|
|
overflow: scroll;
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: column; }
|
|
|
|
.navbar .container {
|
|
width: 100%;
|
|
padding: 0 4vw; }
|
|
|
|
@media (min-width: 768px) {
|
|
.container {
|
|
width: 100%; } }
|
|
@media (min-width: 992px) {
|
|
.main .container, .main .orders {
|
|
width: 970px; } }
|
|
@media (min-width: 1200px) {
|
|
.main .container, .main .orders {
|
|
width: 1170px; } }
|
|
.main {
|
|
padding-top: 2.5rem; }
|
|
|
|
.order_data {
|
|
display: flex;
|
|
flex-direction: row;
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
padding: 0 3rem;
|
|
align-items: baseline; }
|
|
|
|
.order_row {
|
|
background: transparent; }
|
|
|
|
.order_data h5 {
|
|
max-width: 60%;
|
|
padding-bottom: 3rem; }
|
|
|
|
.expand_button {
|
|
padding: 1rem 0rem;
|
|
margin-top: -1rem;
|
|
width: 70%;
|
|
margin-bottom: 1.5rem; }
|
|
|
|
.hi_im_haldis h2 {
|
|
display: none; }
|
|
|
|
.hi_im_haldis h3 {
|
|
width: 100%;
|
|
font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
|
|
text-align: center; }
|
|
|
|
.hi_im_haldis {
|
|
background: linear-gradient(70deg, rgba(203, 52, 68, 0.8), rgba(135, 32, 44, 0.8));
|
|
border-radius: 0;
|
|
width: 100%; }
|
|
|
|
.hi_im_haldis_wrapper {
|
|
width: 100%; }
|
|
|
|
.darker:nth-child(even) {
|
|
background-color: #B62937;
|
|
border-radius: 2rem; }
|
|
|
|
.darker:nth-child(odd) {
|
|
background-color: #821C25;
|
|
border-radius: 2rem; }
|
|
|
|
.darker {
|
|
padding: 1rem; }
|
|
|
|
.order_row:nth-child(even) .order_data {
|
|
background-color: #B62937;
|
|
border-radius: 2rem; }
|
|
|
|
.order_row:nth-child(odd) .order_data {
|
|
background-color: #821C25;
|
|
border-radius: 2rem; }
|
|
|
|
.order_row h5 {
|
|
font-weight: bold; }
|
|
|
|
.order_row {
|
|
margin-bottom: 3rem; }
|
|
|
|
h3 {
|
|
padding-bottom: 1rem; }
|
|
|
|
.home_sir {
|
|
font-weight: bold;
|
|
color: #F45D68; }
|
|
|
|
.expand_button_wrapper {
|
|
margin-top: -1rem;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center; }
|
|
|
|
.time_data {
|
|
text-align: right;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-self: right; }
|
|
|
|
.navbar .navbar-nav .active a {
|
|
color: #ff9bae;
|
|
border-bottom: 1px solid #ff9bae;
|
|
padding-bottom: 1rem; }
|
|
|
|
.navbar-nav {
|
|
padding-left: 2rem; }
|
|
|
|
.jumbotron, .darker {
|
|
display: flex;
|
|
flex-direction: column;
|
|
border-radius: 4rem; }
|
|
|
|
.row > div > h5 {
|
|
font-weight: bold;
|
|
padding-top: 1.5rem;
|
|
font-size: 2.5rem; }
|
|
|
|
.row > div > .amount_of_orders {
|
|
font-weight: lighter;
|
|
font-size: 1.6rem; }
|
|
|
|
.row > div .time {
|
|
font-weight: lighter; }
|
|
|
|
.jumbotron {
|
|
background-color: transparent; }
|
|
|
|
.navbar-default .navbar-nav .active a, .navbar-default .navbar-nav .active a:hover {
|
|
background-color: transparent; }
|
|
|
|
.background {
|
|
-webkit-filter: blur(0px) brightness(80%);
|
|
-moz-filter: blur(0px) brightness(80%);
|
|
-o-filter: blur(0px) brightness(80%);
|
|
-ms-filter: blur(0px) brightness(80%);
|
|
filter: blur(0px) brightness(80%);
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0; }
|
|
|
|
footer a {
|
|
color: #69E8FF; }
|
|
|
|
footer {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
background: #CB3444;
|
|
height: 5rem;
|
|
display: flex;
|
|
align-items: center; }
|
|
|
|
footer > hr {
|
|
display: none; }
|
|
|
|
#mapid {
|
|
width: 100%; }
|
|
|
|
.order_overview, .order_order, .order_items, .order_ordered, .order_depts {
|
|
padding: 1rem 5rem 3rem 5rem; }
|
|
|
|
.order_overview {
|
|
width: 100%; }
|
|
|
|
.order_depts {
|
|
width: 100%;
|
|
margin-bottom: 10rem; }
|
|
|
|
.location_data, .location_products {
|
|
width: 100%; }
|
|
|
|
.location_products {
|
|
margin-bottom: 10rem; }
|
|
|
|
.locations_locations {
|
|
padding: 1rem 5rem 3rem 5rem; }
|
|
|
|
.background_wrapper {
|
|
position: absolute;
|
|
left: 0;
|
|
bottom: 5rem;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden; }
|
|
|
|
.christmas_background {
|
|
z-index: -101;
|
|
width: 300%;
|
|
height: 300%;
|
|
background: linear-gradient(-45deg, #2F0000, #C20A12);
|
|
animation: gradientBG 19s ease infinite; }
|
|
|
|
.sled {
|
|
width: 15rem;
|
|
height: 15rem;
|
|
transition: transform 2s ease-in 5s, rotate 1s ease-in-out 2s;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
background-size: contain;
|
|
background-image: url("static/images/themes/kerstmis/sled.svg"); }
|
|
|
|
.sled_wrapper {
|
|
top: 0.5rem;
|
|
left: -7.5rem;
|
|
position: absolute;
|
|
transform: translate(-50vw, 40vh) rotate(0deg);
|
|
width: 15rem;
|
|
height: 15rem;
|
|
animation: sled 29s ease-in-out infinite; }
|
|
|
|
.train_button:checked ~ .sled_wrapper:hover {
|
|
animation-play-state: paused; }
|
|
|
|
.train_button:checked ~ .sled_wrapper:hover .sled {
|
|
transform: translateY(100vh) rotate(90deg); }
|
|
|
|
.snowman_wrapper {
|
|
height: 17rem;
|
|
width: 10rem;
|
|
position: absolute;
|
|
bottom: 15rem;
|
|
left: -12rem;
|
|
animation: snowman 37s ease infinite;
|
|
transform-origin: right bottom; }
|
|
|
|
.snowman_head {
|
|
position: absolute;
|
|
top: 0;
|
|
width: 10rem;
|
|
height: 10rem;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-image: url("static/images/themes/kerstmis/snowman_head.svg");
|
|
animation: snowman_head 2s ease infinite; }
|
|
|
|
.snowman_body {
|
|
position: absolute;
|
|
top: 9.5rem;
|
|
left: 0.5rem;
|
|
width: 10rem;
|
|
height: 10rem;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-image: url("static/images/themes/kerstmis/snowman_body.svg"); }
|
|
|
|
.train_button:checked ~ .merry_christmas {
|
|
position: absolute;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-position: center;
|
|
background-image: url("static/images/themes/kerstmis/merry_christmas.svg");
|
|
background-size: 25vw;
|
|
background-repeat: no-repeat;
|
|
animation: merry_christmas 5s ease infinite; }
|
|
|
|
.train_button {
|
|
position: absolute;
|
|
transform: scaleX(20) scaleY(8) translateX(-100rem);
|
|
bottom: 5.5rem;
|
|
left: 7rem;
|
|
animation: follow_train 47s linear infinite;
|
|
opacity: 0; }
|
|
|
|
.train_wrapper {
|
|
position: absolute;
|
|
bottom: 0.5rem;
|
|
transform: translateX(-80vw);
|
|
animation: train 47s linear infinite; }
|
|
|
|
.wheel_big, .wheel_small {
|
|
position: absolute;
|
|
bottom: -0.4rem;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-image: url("static/images/themes/kerstmis/wheel.svg"); }
|
|
|
|
.train {
|
|
position: absolute;
|
|
bottom: 0.5rem;
|
|
left: 30rem;
|
|
width: 30rem;
|
|
height: 10rem;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-image: url("static/images/themes/kerstmis/train.svg");
|
|
animation: whobble 1s linear alternate-reverse infinite; }
|
|
|
|
.wheel_big {
|
|
width: 3.2rem;
|
|
height: 3.2rem; }
|
|
|
|
.wheel_small {
|
|
width: 2.5rem;
|
|
height: 2.5rem; }
|
|
|
|
.train .wheel1 {
|
|
animation: turn 2s linear infinite;
|
|
left: 3.5rem; }
|
|
|
|
.train .wheel2 {
|
|
animation: turn 2s linear infinite, -0.1s;
|
|
left: 7rem; }
|
|
|
|
.train .wheel3 {
|
|
animation: turn 2s linear infinite -0.3s;
|
|
left: 10.5rem; }
|
|
|
|
.train .wheel4 {
|
|
animation: turn 1.5s linear infinite -0.5s;
|
|
left: 13.9rem; }
|
|
|
|
.train .wheel5 {
|
|
animation: turn 1.5s linear infinite -0.7s;
|
|
left: 16.6rem; }
|
|
|
|
.zeus_wagon, .mc_wagon {
|
|
position: absolute;
|
|
bottom: 1.25rem;
|
|
width: 30rem;
|
|
height: 7.5rem;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
animation: whobble 1s linear alternate-reverse infinite; }
|
|
|
|
.mc_wagon {
|
|
background-image: url("static/images/themes/kerstmis/mc_wagon.svg");
|
|
left: 0rem; }
|
|
|
|
.zeus_wagon {
|
|
background-image: url("static/images/themes/kerstmis/zeus_wagon.svg");
|
|
left: 15rem; }
|
|
|
|
.zeus_wagon .wheel1, .mc_wagon .wheel1 {
|
|
animation: turn 2s linear infinite;
|
|
bottom: -1.1rem;
|
|
left: 2.2rem; }
|
|
|
|
.zeus_wagon .wheel2, .mc_wagon .wheel2 {
|
|
animation: turn 2s linear infinite, -0.1s;
|
|
bottom: -1.1rem;
|
|
left: 5.75rem; }
|
|
|
|
.zeus_wagon .wheel3, .mc_wagon .wheel3 {
|
|
animation: turn 2s linear infinite -0.3s;
|
|
bottom: -1.1rem;
|
|
left: 9.3rem; }
|
|
|
|
.snow {
|
|
border-radius: 50%;
|
|
opacity: 0.8;
|
|
position: absolute;
|
|
top: -100vh;
|
|
animation-name: fall;
|
|
animation-timing-function: linear;
|
|
animation-iteration-count: infinite; }
|
|
|
|
.layer1 {
|
|
width: 1rem;
|
|
height: 1rem;
|
|
filter: blur(1.5px);
|
|
box-shadow: 38.1vw 38.9vh 0 -0.23rem#fff,63.6vw 92.5vh 0 -0.37rem#fff,26.2vw 19vh 0 -0.13rem#fff,43.8vw 53.8vh 0 -0.32rem#fff,18.9vw 78.9vh 0 -0.48rem#fff,78vw 88.3vh 0 -0.45rem#fff,76.2vw 40.9vh 0 -0.35rem#fff,31vw 100vh 0 -0.35rem#fff,30.9vw 40.6vh 0 -0.38rem#fff,78.3vw 68.7vh 0 -0.38rem#fff,90.8vw 12.9vh 0 -0.25rem#fff,80.4vw 98.6vh 0 -0.33rem#fff,8.8vw 75.2vh 0 -0.36rem#fff,45.3vw 50.7vh 0 -0.36rem#fff,79.6vw 2.2vh 0 -0.39rem#fff,4vw 57.4vh 0 -0.24rem#fff,68.4vw 42.8vh 0 -0.38rem#fff,62.4vw 0.5vh 0 -0.04rem#fff,99.8vw 32.8vh 0 -0.41rem#fff,71.4vw 5.4vh 0 -0.15rem#fff,62.8vw 79.2vh 0 -0.18rem#fff,82.1vw 85.2vh 0 -0.18rem#fff,45.1vw 19.1vh 0 -0.4rem#fff,35.2vw 39.2vh 0 -0.03rem#fff,95.6vw 85.1vh 0 -0.06rem#fff,77.3vw 53.1vh 0 -0.36rem#fff,3.2vw 18.3vh 0 -0.43rem#fff,55vw 88.9vh 0 -0.27rem#fff,73.7vw 1.7vh 0 -0.28rem#fff,16.7vw 45vh 0 -0.37rem#fff,78.8vw 65.8vh 0 -0.19rem#fff,10.9vw 64.9vh 0 -0.4rem#fff,42.6vw 84.1vh 0 -0.44rem#fff,4.6vw 77.8vh 0 -0.39rem#fff,40.6vw 37.6vh 0 -0.19rem#fff,82.6vw 51.2vh 0 -0.4rem#fff,15.9vw 87.9vh 0 -0.06rem#fff,7.3vw 98.7vh 0 -0.23rem#fff,91.6vw 20vh 0 -0.48rem#fff,73.6vw 26.2vh 0 -0.32rem#fff,36.3vw 24.8vh 0 -0.39rem#fff,95.3vw 55.1vh 0 -0.12rem#fff,33.1vw 34.4vh 0 -0.09rem#fff,2.7vw 86.9vh 0 -0.25rem#fff,99.8vw 99.6vh 0 -0.06rem#fff,59.3vw 88.2vh 0 -0.48rem#fff,46.5vw 84.2vh 0 -0.4rem#fff,0.9vw 40.4vh 0 -0.04rem#fff,35.8vw 16.7vh 0 -0.41rem#fff,42.7vw 19.1vh 0 -0.25rem#fff,62.9vw 89.8vh 0 -0.43rem#fff,61.6vw 100vh 0 -0.27rem#fff,61.5vw 76.9vh 0 -0.25rem#fff,33.6vw 33.1vh 0 -0.03rem#fff,59.5vw 15.7vh 0 -0.03rem#fff,13.1vw 17.1vh 0 -0.41rem#fff,39.4vw 27.9vh 0 -0.13rem#fff,70.6vw 15.5vh 0 -0.41rem#fff,29vw 27.7vh 0 -0.46rem#fff,88.2vw 64.1vh 0 -0.33rem#fff,93.3vw 42.2vh 0 -0.38rem#fff,52.4vw 55vh 0 -0.01rem#fff,48.2vw 21.7vh 0 -0.4rem#fff,16.2vw 48.9vh 0 -0.36rem#fff,36.3vw 24.2vh 0 -0.24rem#fff,28.9vw 39.6vh 0 -0.32rem#fff,50.2vw 5.1vh 0 -0.11rem#fff,67.5vw 54.6vh 0 -0.12rem#fff,44.1vw 24.5vh 0 -0.23rem#fff,91.4vw 27.6vh 0 -0.1rem#fff,93.2vw 42.3vh 0 -0.46rem#fff,59.6vw 42.4vh 0 -0.29rem#fff,88vw 39.1vh 0 -0.03rem#fff,74vw 5.6vh 0 -0.31rem#fff,49.7vw 0.1vh 0 -0.36rem#fff,93.1vw 47.2vh 0 -0.21rem#fff,54.8vw 59.2vh 0 -0.38rem#fff,27.1vw 71.9vh 0 -0.3rem#fff,20.8vw 10.8vh 0 -0.46rem#fff,20.2vw 10vh 0 -0.45rem#fff,48.9vw 79.3vh 0 -0.36rem#fff,73.3vw 21.8vh 0 -0.2rem#fff,68.4vw 21.6vh 0 -0.06rem#fff,90.1vw 87.1vh 0 -0.24rem#fff,41.6vw 99.4vh 0 -0.03rem#fff,51.4vw 58.8vh 0 -0.43rem#fff,45.7vw 3.5vh 0 -0.14rem#fff,64.7vw 99.3vh 0 -0.31rem#fff,4vw 48.3vh 0 -0.42rem#fff,86.8vw 87.5vh 0 -0.19rem#fff,81.2vw 56.6vh 0 -0.48rem#fff,95.2vw 83.9vh 0 -0.05rem#fff,30.6vw 15.7vh 0 -0.1rem#fff,32.8vw 24.3vh 0 -0.39rem#fff,83.3vw 7.8vh 0 -0.34rem#fff,41.3vw 13.3vh 0 -0.23rem#fff,63.4vw 16.5vh 0 -0.08rem#fff,57.6vw 98.5vh 0 -0.22rem#fff,78.4vw 63.8vh 0 -0.08rem#fff,49vw 29.5vh 0 -0.01rem#fff;
|
|
animation-duration: 18s; }
|
|
|
|
.layer1.a {
|
|
animation-delay: -9s; }
|
|
|
|
.layer2 {
|
|
width: 0.8rem;
|
|
height: 0.8rem;
|
|
filter: blur(3px);
|
|
box-shadow: 79.8vw 46.8vh 0 -0.07rem#fff,11.3vw 43.8vh 0 -0.4rem#fff,69.3vw 2.8vh 0 -0.27rem#fff,48.8vw 5.8vh 0 -0.13rem#fff,61.1vw 28vh 0 -0.02rem#fff,74.7vw 11.5vh 0 -0.24rem#fff,57.8vw 84.7vh 0 -0.34rem#fff,79.9vw 69.7vh 0 -0.33rem#fff,12vw 68.1vh 0 -0.49rem#fff,47.9vw 86.4vh 0 -0.23rem#fff,82.5vw 46.9vh 0 -0.24rem#fff,21.6vw 20.8vh 0 -0.14rem#fff,9.7vw 80.1vh 0 -0.29rem#fff,6.1vw 47.4vh 0 -0.17rem#fff,59.1vw 97.7vh 0 -0.19rem#fff,11.7vw 40.7vh 0 -0.46rem#fff,92.2vw 58.5vh 0 -0.2rem#fff,71.6vw 91.9vh 0 -0.01rem#fff,9.5vw 12.5vh 0 -0.33rem#fff,73.1vw 91.5vh 0 -0.13rem#fff,53.5vw 55.7vh 0 -0.01rem#fff,7.5vw 95.5vh 0 -0.48rem#fff,11.2vw 13.7vh 0 -0.08rem#fff,3.4vw 81.1vh 0 -0.5rem#fff,40.9vw 43vh 0 -0.4rem#fff,78.3vw 33.4vh 0 -0.35rem#fff,92.7vw 70.1vh 0 -0.36rem#fff,90.1vw 17.5vh 0 -0.18rem#fff,6.6vw 15.7vh 0 -0.41rem#fff,13.8vw 74.1vh 0 -0.38rem#fff,40vw 11.6vh 0 -0.35rem#fff,90.4vw 70.9vh 0 -0.48rem#fff,82.7vw 73.9vh 0 -0.23rem#fff,91.4vw 44.3vh 0 -0.21rem#fff,85.9vw 95.5vh 0 -0.01rem#fff,96.5vw 63.6vh 0 -0.39rem#fff,23.6vw 10.6vh 0 -0.04rem#fff,0.4vw 0.7vh 0 -0.24rem#fff,51.1vw 61.4vh 0 -0.12rem#fff,2.4vw 52.3vh 0 -0.06rem#fff,99.9vw 25.8vh 0 -0.22rem#fff,20.4vw 18.4vh 0 -0.05rem#fff,28vw 64.9vh 0 -0.1rem#fff,95.2vw 34.5vh 0 -0.05rem#fff,43.9vw 96.6vh 0 -0.23rem#fff,10.3vw 27.4vh 0 -0.11rem#fff,2.6vw 91.2vh 0 -0.41rem#fff,85.3vw 12.9vh 0 -0.2rem#fff,50.4vw 32.7vh 0 -0.38rem#fff,12.1vw 76.7vh 0 -0.4rem#fff,24.1vw 83.3vh 0 -0.32rem#fff,80.2vw 30.9vh 0 -0.24rem#fff,30.8vw 34.7vh 0 -0.48rem#fff,94.6vw 65vh 0 -0.08rem#fff,1.3vw 55.1vh 0 -0.36rem#fff,74.8vw 69.7vh 0 -0.04rem#fff,79.4vw 78.9vh 0 -0.19rem#fff,16.7vw 35.6vh 0 -0.19rem#fff,36vw 13.4vh 0 -0.36rem#fff,77.5vw 44.7vh 0 -0.42rem#fff,88.9vw 90.4vh 0 -0.33rem#fff,83vw 74.8vh 0 -0.3rem#fff,67.2vw 98.4vh 0 -0.14rem#fff,10vw 10.9vh 0 -0.27rem#fff,97.3vw 64.2vh 0 -0.03rem#fff,57.8vw 30.6vh 0 -0.37rem#fff,55.2vw 33.3vh 0 -0.39rem#fff,83.8vw 43.2vh 0 -0.28rem#fff,99.4vw 93.6vh 0 -0.45rem#fff,63.2vw 31.2vh 0 -0.16rem#fff,32.5vw 96.4vh 0 -0.49rem#fff,8.9vw 70.8vh 0 -0.27rem#fff,27vw 2.3vh 0 -0.46rem#fff,26.6vw 52.4vh 0 -0.31rem#fff,39.9vw 24.2vh 0 -0.04rem#fff,32.8vw 86.7vh 0 -0.42rem#fff,85.3vw 11.8vh 0 -0.14rem#fff,69vw 85.4vh 0 -0.19rem#fff,84.5vw 54.2vh 0 -0.09rem#fff,22vw 38.9vh 0 -0.34rem#fff,42.8vw 5.4vh 0 -0.35rem#fff,61.2vw 68.5vh 0 -0.26rem#fff,20.8vw 50.7vh 0 -0.01rem#fff,41.6vw 69.5vh 0 -0.15rem#fff,37.8vw 46.8vh 0 -0.05rem#fff,23vw 9.5vh 0 -0.01rem#fff,1.3vw 84.1vh 0 -0.07rem#fff,59.5vw 95.9vh 0 -0.36rem#fff,1.6vw 49.5vh 0 -0.23rem#fff,40.4vw 67.3vh 0 -0.33rem#fff,84vw 12.2vh 0 -0.27rem#fff,53.5vw 55.2vh 0 -0.39rem#fff,98.1vw 39.7vh 0 -0.33rem#fff,68.5vw 53.8vh 0 -0.33rem#fff,6.8vw 4.4vh 0 -0.45rem#fff,35.9vw 51.8vh 0 -0.11rem#fff,42.1vw 77.1vh 0 -0.21rem#fff,9.8vw 37.4vh 0 -0.01rem#fff,99.2vw 13.4vh 0 -0.26rem#fff,88.2vw 21vh 0 -0.33rem#fff;
|
|
animation-duration: 24s; }
|
|
|
|
.layer2.a {
|
|
animation-delay: -12s; }
|
|
|
|
.layer3 {
|
|
width: 0.6rem;
|
|
height: 0.6rem;
|
|
filter: blur(6px);
|
|
box-shadow: 64.8vw 75.7vh 0 -0.14rem#fff,58.4vw 85.5vh 0 -0.16rem#fff,98.2vw 40.9vh 0 -0.03rem#fff,50.5vw 40.3vh 0 -0.42rem#fff,28.8vw 85.1vh 0 -0.3rem#fff,86.8vw 47.7vh 0 -0.47rem#fff,87vw 17.9vh 0 -0.06rem#fff,31.7vw 16.2vh 0 -0.16rem#fff,90.8vw 9.8vh 0 -0.49rem#fff,98.4vw 66.5vh 0 -0.43rem#fff,33.1vw 92vh 0 -0.46rem#fff,44.7vw 23vh 0 -0.21rem#fff,82.8vw 10.7vh 0 -0.1rem#fff,14.2vw 75.9vh 0 -0.33rem#fff,7.7vw 13vh 0 -0.29rem#fff,39.8vw 98.5vh 0 -0.27rem#fff,24.1vw 80.8vh 0 -0.13rem#fff,30.6vw 21.2vh 0 -0.36rem#fff,69.1vw 92.1vh 0 -0.17rem#fff,20.6vw 58.8vh 0 -0.28rem#fff,1vw 86.4vh 0 -0.27rem#fff,32.7vw 56.3vh 0 -0.43rem#fff,83.3vw 12.9vh 0 -0.07rem#fff,19.4vw 82.1vh 0 -0.46rem#fff,59.9vw 27.9vh 0 -0.22rem#fff,45.9vw 40vh 0 -0.11rem#fff,51.5vw 21.6vh 0 -0.03rem#fff,70.8vw 15.1vh 0 -0.1rem#fff,50.7vw 44.1vh 0 -0.18rem#fff,31.3vw 0.6vh 0 -0.19rem#fff,65.4vw 13.1vh 0 -0.19rem#fff,10.6vw 64.5vh 0 -0.15rem#fff,95.5vw 75.9vh 0 -0.12rem#fff,66.4vw 94vh 0 -0.19rem#fff,33.2vw 46.2vh 0 -0.12rem#fff,33.9vw 1.5vh 0 -0.13rem#fff,43.1vw 89vh 0 -0.1rem#fff,30.4vw 39.9vh 0 -0.45rem#fff,9.3vw 93.2vh 0 -0.35rem#fff,62.6vw 99.4vh 0 -0.09rem#fff,6.5vw 68.9vh 0 -0.14rem#fff,53.8vw 8.3vh 0 -0.46rem#fff,5.4vw 96.1vh 0 -0.18rem#fff,2.8vw 60.2vh 0 -0.05rem#fff,79.9vw 46.9vh 0 -0.48rem#fff,20.9vw 40.4vh 0 -0.24rem#fff,82.2vw 44.5vh 0 -0.37rem#fff,2.9vw 94.1vh 0 -0.31rem#fff,87.7vw 28.5vh 0 -0.44rem#fff,7.7vw 46.6vh 0 -0.25rem#fff,78.5vw 59.4vh 0 -0.48rem#fff,4.5vw 72.6vh 0 -0.21rem#fff,83.8vw 73.9vh 0 -0.25rem#fff,99.8vw 8.1vh 0 -0.42rem#fff,86.6vw 31.8vh 0 -0.21rem#fff,38.8vw 77.2vh 0 -0.13rem#fff,4.6vw 16.4vh 0 -0.17rem#fff,61.3vw 85.8vh 0 -0.06rem#fff,20.3vw 97vh 0 -0.21rem#fff,26.7vw 94.3vh 0 -0.06rem#fff,10.3vw 32.7vh 0 -0.37rem#fff,66.1vw 7.3vh 0 -0.24rem#fff,23.7vw 17.2vh 0 -0.48rem#fff,79.9vw 55.4vh 0 -0.03rem#fff,76.9vw 92.2vh 0 -0.43rem#fff,14.7vw 7.2vh 0 -0.35rem#fff,27.5vw 67.1vh 0 -0.23rem#fff,50vw 7.8vh 0 -0.4rem#fff,25.3vw 79.1vh 0 -0.34rem#fff,3vw 26.3vh 0 -0.26rem#fff,81.4vw 75vh 0 -0.38rem#fff,76.9vw 11.4vh 0 -0.18rem#fff,63.1vw 29.7vh 0 -0.16rem#fff,91.5vw 28.9vh 0 -0.47rem#fff,4.4vw 33.7vh 0 -0.35rem#fff,63.5vw 73.1vh 0 -0.1rem#fff,6.6vw 83.1vh 0 -0.45rem#fff,16.4vw 89.5vh 0 -0.01rem#fff,20.2vw 70.9vh 0 -0.18rem#fff,87.6vw 62vh 0 -0.2rem#fff,94vw 56.4vh 0 -0.03rem#fff,56.8vw 71vh 0 -0.26rem#fff,34.2vw 78.5vh 0 -0.4rem#fff,81.6vw 3.9vh 0 -0.21rem#fff,84.6vw 0.4vh 0 -0.5rem#fff,25vw 38.4vh 0 -0.23rem#fff,49.5vw 22.8vh 0 -0.08rem#fff,90.4vw 71.3vh 0 -0.21rem#fff,24.6vw 52.3vh 0 -0.16rem#fff,35.7vw 50.5vh 0 -0.3rem#fff,68.4vw 67.7vh 0 -0.34rem#fff,67.1vw 33.6vh 0 -0.47rem#fff,90.8vw 98.7vh 0 -0.24rem#fff,15.6vw 86.9vh 0 -0.34rem#fff,48.6vw 65vh 0 -0.37rem#fff,38.8vw 2.6vh 0 -0.36rem#fff,55.5vw 16.2vh 0 -0.07rem#fff,58.4vw 29.6vh 0 -0.29rem#fff,35.8vw 1.1vh 0 -0.42rem#fff,61.1vw 69.5vh 0 -0.38rem#fff;
|
|
animation-duration: 30s; }
|
|
|
|
.layer3.a {
|
|
animation-delay: -15s; }
|
|
|
|
@keyframes fall {
|
|
100% {
|
|
transform: translateY(200vh); } }
|
|
@keyframes gradientBG {
|
|
0% {
|
|
transform: translate(-10%, -10%); }
|
|
50% {
|
|
transform: translate(-60%, -60%); }
|
|
100% {
|
|
transform: translate(-10%, -10%); } }
|
|
@keyframes sled {
|
|
0% {
|
|
transform: translate(-50rem, 40vh) rotate(0deg); }
|
|
4% {
|
|
transform: translate(-50rem, 40vh) rotate(0deg); }
|
|
20% {
|
|
transform: translate(50vw, 10vh) rotate(20deg); }
|
|
36% {
|
|
transform: translate(150vw, 40vh) rotate(40deg); }
|
|
100% {
|
|
transform: translate(150vw, 40vh) rotate(40deg); } }
|
|
@keyframes train {
|
|
0% {
|
|
transform: translateX(-80rem); }
|
|
55% {
|
|
transform: translateX(-80rem); }
|
|
85% {
|
|
transform: translateX(100vw); }
|
|
100% {
|
|
transform: translateX(100vw); } }
|
|
@keyframes follow_train {
|
|
0% {
|
|
transform: translateX(-80rem) scaleX(20) scaleY(8); }
|
|
55% {
|
|
transform: translateX(-80rem) scaleX(20) scaleY(8); }
|
|
85% {
|
|
transform: translateX(100vw) scaleX(20) scaleY(8); }
|
|
100% {
|
|
transform: translateX(100vw) scaleX(20) scaleY(8); } }
|
|
@keyframes turn {
|
|
100% {
|
|
transform: rotate(360deg); } }
|
|
@keyframes whobble {
|
|
100% {
|
|
transform: translateY(0.5vh); } }
|
|
@keyframes snowman {
|
|
0% {
|
|
transform: rotate(0); }
|
|
20% {
|
|
transform: rotate(0); }
|
|
30% {
|
|
transform: rotate(80deg); }
|
|
54% {
|
|
transform: rotate(80deg); }
|
|
68% {
|
|
transform: rotate(0); }
|
|
100% {
|
|
transform: rotate(0); } }
|
|
@keyframes snowman_head {
|
|
0% {
|
|
transform: rotate(-3deg); }
|
|
50% {
|
|
transform: rotate(3deg); }
|
|
100% {
|
|
transform: rotate(-3deg); } }
|
|
@keyframes merry_christmas {
|
|
0% {
|
|
opacity: 0.8; }
|
|
50% {
|
|
opacity: 0.6; }
|
|
100% {
|
|
opacity: 0.8; } }
|
|
|
|
/*# sourceMappingURL=christmas_heavy.css.map */
|