STEINNI
125 lines
6.3 KiB
Smarty
125 lines
6.3 KiB
Smarty
<!DOCTYPE html>
|
|
<html lang="en-US">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>European Innovation Council</title>
|
|
{scriptTags}
|
|
{cssTags}
|
|
</head>
|
|
<body eicapp>
|
|
<style>
|
|
body {
|
|
align-items: center;
|
|
background: radial-gradient(#4786da, #1b4986);
|
|
background-position: center;
|
|
color: white;
|
|
display: grid;
|
|
padding: 150px 15px 100px;
|
|
position: relative;
|
|
text-align: center;
|
|
width: 100vw;
|
|
background-size: cover;
|
|
height: 100vh;
|
|
box-sizing: border-box;
|
|
overflow: hidden;
|
|
font-family: sans-serif;
|
|
}
|
|
.sparc-loader {
|
|
position: absolute;
|
|
width: 9rem;
|
|
height: 9rem;
|
|
align-self: center;
|
|
justify-self: center;
|
|
transform: scale(0.7);
|
|
}
|
|
.sparc {
|
|
position: absolute;
|
|
width: 0.1rem;
|
|
height: 0.1rem;
|
|
bottom: 4.3rem;
|
|
left: 4.35rem;
|
|
transform: rotate(var(--loader-rotate));
|
|
}
|
|
.sparc::after {
|
|
content: '';
|
|
display: block;
|
|
position: absolute;
|
|
bottom: 0;
|
|
width: 0.1rem;
|
|
height: 1.3rem;
|
|
border-radius: 0.3rem;
|
|
opacity: 0;
|
|
background-color: #d8ecff;
|
|
transform-origin: bottom center;
|
|
animation: ignite 0.5s infinite linear;
|
|
animation-delay: var(--loader-delay);
|
|
}
|
|
@keyframes ignite {
|
|
0% { transform: translateY(-0.5rem) scaleY(0.2); opacity: 0; }
|
|
10% { transform: translateY(-1rem) scaleY(0.5); opacity: 0.35; }
|
|
30% { transform: translateY(-2rem) scaleY(0.5); opacity: 0.7; }
|
|
50% { transform: translateY(-4rem) scaleY(1.5); opacity: 0.7; }
|
|
51% { transform: translateY(-4rem) scaleY(1); opacity: 0; }
|
|
100% { transform: translateY(0) scaleY(0.2); opacity: 0; }
|
|
}
|
|
.auth-error{
|
|
display: none!important;
|
|
max-width: 40vw!important;
|
|
margin: auto!important;
|
|
}
|
|
</style>
|
|
<div class="sparc-loader">
|
|
<div class="sparc" style="--loader-rotate: 10deg; --loader-delay: 223ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 20deg; --loader-delay: 842ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 30deg; --loader-delay: 131ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 40deg; --loader-delay: 746ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 50deg; --loader-delay: 925ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 60deg; --loader-delay: 390ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 70deg; --loader-delay: 483ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 80deg; --loader-delay: 621ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 90deg; --loader-delay: 814ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 100deg; --loader-delay: 802ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 110deg; --loader-delay: 837ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 120deg; --loader-delay: 238ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 130deg; --loader-delay: 642ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 140deg; --loader-delay: 60ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 150deg; --loader-delay: 405ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 160deg; --loader-delay: 575ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 170deg; --loader-delay: 945ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 180deg; --loader-delay: 635ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 190deg; --loader-delay: 205ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 200deg; --loader-delay: 91ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 210deg; --loader-delay: 829ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 220deg; --loader-delay: 970ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 230deg; --loader-delay: 861ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 240deg; --loader-delay: 201ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 250deg; --loader-delay: 173ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 260deg; --loader-delay: 967ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 270deg; --loader-delay: 548ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 280deg; --loader-delay: 392ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 290deg; --loader-delay: 273ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 300deg; --loader-delay: 6ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 310deg; --loader-delay: 1ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 320deg; --loader-delay: 854ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 330deg; --loader-delay: 159ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 340deg; --loader-delay: 60ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 350deg; --loader-delay: 986ms"></div>
|
|
<div class="sparc" style="--loader-rotate: 360deg; --loader-delay: 559ms"></div>
|
|
</div>
|
|
|
|
<article class="auth-error" eiccard="" aria-enabled="true" >
|
|
<header><h1>Server error</h1></header>
|
|
<section>
|
|
<div>
|
|
<section>
|
|
<alert eicalert="" danger="">
|
|
Unfortunately, the server cannot authenticate you at the moment,<br>
|
|
Please try again later.
|
|
</alert>
|
|
</section>
|
|
</div>
|
|
</section>
|
|
</article>
|
|
</body>
|
|
</html>
|