File: /var/www/html/eva.sumar.com.py/resources/views/fronted/ranking.blade.php
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>EVA</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {
background: url(imagenes/fondo-pagina-principal-inicio.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#body {
background-image:
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/planeta5.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/planeta2.png'),
url('imagenes/planeta3.png');
background-repeat: no-repeat;
background-position:
0px 0,
1300px 0,
0px 30%,
1300px 80%,
200px 0,
1000px 100%,
0px 100%,
1300px 0,
100px 100%,
600px 70%,
0px 100%,
1300px 0;
background-size:
30px,
30px,
30px,
30px,
150px,
30px,
30px,
30px,
30px,
30px,
200px,
100px;
animation: 50s para infinite linear;
}
@keyframes para {
100% {
background-position:
1300px 100%,
0px 100%,
1300px 30%,
0px 80%,
200px 100%,
1000px 0,
0px 0%,
1300px 100%,
400px 100%,
1000px 100%,
1300px 100%,
0px 0;
}
}
.preloader {
animation-name: girar;
animation-duration: 20s;
animation-iteration-count: infinite;
}
@keyframes girar {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.p-3{
background-color: white;
border-radius: 10%;
text-align: center;
color: #980B0B;
margin-bottom: 10px;
}
.p-3:hover{
background: rgb(255,30,0);
background: linear-gradient(90deg, rgba(255,30,0,1) 0%, rgba(223,73,53,1) 0%, rgba(255,247,0,1) 100%);
color: white;
transform: scale(1.1);
}
.nav-link{
color:white !important;font-size:16px;font-weight: bold;
}
.p-3 img{
height:150px;
}
@media (max-width: 600px){
.p-3 img{
height:70px;
}
}
</style>
@livewireStyles
</head>
<body>
<div id="body">
<livewire:navbar />
<div class="container">
<livewire:frontrankings />
</div>
</div>
<livewire:notificaciones />
@livewireScripts
</body>
</html>