60 lines
No EOL
1.1 KiB
CSS
60 lines
No EOL
1.1 KiB
CSS
/* Change this breakpoint if you change the breakpoint of the navbar */
|
|
|
|
@media (min-width: 992px) {
|
|
.animate {
|
|
animation-duration: 0.3s;
|
|
-webkit-animation-duration: 0.3s;
|
|
animation-fill-mode: both;
|
|
-webkit-animation-fill-mode: both;
|
|
}
|
|
}
|
|
|
|
@keyframes slideIn {
|
|
0% {
|
|
transform: translateY(1rem);
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
transform:translateY(0rem);
|
|
opacity: 1;
|
|
}
|
|
0% {
|
|
transform: translateY(1rem);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
@-webkit-keyframes slideIn {
|
|
0% {
|
|
-webkit-transform: transform;
|
|
-webkit-opacity: 0;
|
|
}
|
|
100% {
|
|
-webkit-transform: translateY(0);
|
|
-webkit-opacity: 1;
|
|
}
|
|
0% {
|
|
-webkit-transform: translateY(1rem);
|
|
-webkit-opacity: 0;
|
|
}
|
|
}
|
|
|
|
.slideIn {
|
|
-webkit-animation-name: slideIn;
|
|
animation-name: slideIn;
|
|
}
|
|
|
|
|
|
.fadeIn {
|
|
animation: fadeInAnimation ease 1s;
|
|
animation-iteration-count: 1;
|
|
animation-fill-mode: forwards;
|
|
}
|
|
@keyframes fadeInAnimation {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
} |