File: /var/www/html/eva.sumar.com.py/resources/views/fronted/espaciocolaborativo.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/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/nave1.png'),
url('imagenes/nave1.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,
30px,
30px,
30px,
30px,
30px,
30px,
100px,
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>
</head>
<body>
<livewire:navbar />
<div id="body">
<div class="container overflow-hidden">
<div class="row">
<div class="col-12">
<br><h1 style="color:#fff;text-align:center;font-size: 65px;"><b>ESPACIO COLABORATIVO </b></h1>
</div>
<div class="col-md-12">
<br />
<br />
<br />
</div>
</div>
<div class="row gx-5">
<div class="col-md-4">
<a href="/gestiondelcambio" style="text-decoration: none;"><div class="p-3 border bg-light"><br />
<img src="imagenes/satelite001.png" width="190px"><br /><br />
<b>GESTIÓN DEL CAMBIO</b><br />
</div></a>
</div>
<div class="col-md-4">
<a href="/infosolar" style="text-decoration: none;"><div class="p-3 border bg-light"><br />
<img src="imagenes/estrellas001.png" width="190px" ><br /><br />
<b>INFO SOLAR</b><br />
</div></a>
</div>
<div class="col-md-4">
<a href="/boletinessolar" style="text-decoration: none;"><div class="p-3 border bg-light"><br />
<img src="imagenes/sol.png" width="190px" ><br /><br />
<b>BOLETINES SOLAR</b><br />
</div></a>
</div>
<div class="col-md-4">
<a href="#" style="text-decoration: none;"><div class="p-3 border bg-light"><br />
<img src="imagenes/antena001.png" width="190px" ><br /><br />
<b>SUGERENCIAS</b><br />
</div></a>
</div>
<div class="col-md-4">
<a href="/afteroffice" style="text-decoration: none;"><div class="p-3 border bg-light"><br />
<img src="imagenes/estrellas002.png" width="190px" ><br /><br />
<b>AFTER OFFICE</b><br />
</div></a>
</div>
<div class="col-md-4">
<a href="/encuestas" style="text-decoration: none;"><div class="p-3 border bg-light"><br />
<img src="imagenes/mundo001.png" width="190px" ><br /><br />
<b>ENCUESTAS</b><br />
</div></a>
</div>
</div>
</div>
</div>
<livewire:notificaciones />
</body>
</html>