.fade-in {
animation: fadeIn 2s;
-webkit-animation: fadeIn 2s;
-moz-animation: fadeIn 2s;
-o-animation: fadeIn 2s;
-ms-animation: fadeIn 2s;
}
@keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-moz-keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-webkit-keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-o-keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-ms-keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
} @keyframes dualSpinner {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@-moz-keyframes dualSpinner {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@-webkit-keyframes dualSpinner {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@-o-keyframes dualSpinner {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@-ms-keyframes dualSpinner {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.spinner-container {
position: relative;
display: none;
height: 30px;
width: 75px;
margin-top: 20px;
}
.spinner-container button {
width:100%;
}
.spinner-container .dual-spinner {
height: 100%;
width: 100%;
top: 0;
left: 0;
display: block;
position: absolute;
align-content: center;
align-items: center;
justify-content: center;
}
.spinner-container .dual-spinner::after {
content: " ";
height: 25px;
width: 25px;
display: block;
margin: auto;
border: 2px solid #fa3048 !important;
border-color: #fa3048 transparent #fa3048 transparent !important;
border-radius: 50%;
animation: dualSpinner 1.2s linear infinite;
-webkit-animation: dualSpinner 1.2s linear infinite;
-moz-animation: dualSpinner 1.2s linear infinite;
-o-animation: dualSpinner 1.2s linear infinite;
-ms-animation: dualSpinner 1.2s linear infinite;
}