
.shimmer {
position: relative;
min-height: 500px;
}

.shimmer:before, .shimmer:after {
content: '';
position: absolute;
left: 0;
height: 100%;
width: 100%;
}

.shimmer:before {
z-index: 999;
background-position: top center;
background-repeat: no-repeat;
background-size: cover;
}

.shimmer:after {
background: -webkit-linear-gradient(181deg, transparent 0%, transparent 40%, rgba(253, 253, 253, 0.5) 45%, rgba(253, 253, 253, 0.5) 50%, transparent 55%, transparent 100%);
background: -o-linear-gradient(181deg, transparent 0%, transparent 40%, rgba(253, 253, 253, 0.5) 45%, rgba(253, 253, 253, 0.5) 50%, transparent 55%, transparent 100%);
background: linear-gradient(269deg, transparent 0%, transparent 40%, rgba(253, 253, 253, 0.5) 45%, rgba(253, 253, 253, 0.5) 50%, transparent 55%, transparent 100%);
background-size: 200% 100%;
-webkit-animation: animation .75s linear infinite;
-moz-animation: animation .75s linear infinite;
-o-animation: animation .75s linear infinite;
animation: animation .75s linear infinite;
-webkit-animation-direction: normal;
animation-direction: normal;
z-index: 9999;
}

.shimmer * {
opacity: 0;
}

.shimmer.shimmer-action-desktop:before, .shimmer.shimmer-action-desktop:after {
top: 0px;
}

.shimmer.shimmer-action {
min-height: 500px;
}

.shimmer.shimmer-action:before, .shimmer.shimmer-action:after {
top: 14px;
}

.shimmer.shimmer-action:before {
background-image: url("data:image/svg+xml,%3Csvg width='364' height='500px' viewBox='0 0 364 500px' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect  x='40%' y='25' width='100' height='25' rx='4' fill='%23F7F7F7'/%3E%3Crect y='60' width='364' height='40' rx='4' fill='%23F7F7F7'/%3E%3Crect y='110' width='364' height='40' rx='4' fill='%23F7F7F7'/%3E%3Crect x='0' y='160' width='180' height='40' rx='4' fill='%23F7F7F7'/%3E%3Crect x='190' y='160' width='180' height='40' rx='4' fill='%23F7F7F7'/%3E%3C/svg%3E%0A");
}

.shimmer.shimmer-off * {
opacity: 1;
}

.shimmer.shimmer-off:before, .shimmer.shimmer-off:after {
opacity: 0;
}

@-webkit-keyframes animation {
0% {
background-position: top right;
}
100% {
background-position: top left;
}
}

@-moz-keyframes animation {
0% {
background-position: top right;
}
100% {
background-position: top left;
}
}

@-o-keyframes animation {
0% {
background-position: top right;
}
100% {
background-position: top left;
}
}

@keyframes animation {
0% {
background-position: top right;
}
100% {
background-position: top left;
}
}
