*{
		box-sizing: border-box;
	}
    body {
		min-height: 100dvh;
      margin: 0;
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      /*  background: #0b5470;
		background: -webkit-linear-gradient(0deg,rgba(11, 84, 112, 1) 0%, rgba(87, 178, 199, 1) 100%);
		background: -moz-linear-gradient(0deg,rgba(11, 84, 112, 1) 0%, rgba(87, 178, 199, 1) 100%);
		background: linear-gradient(0deg,rgba(11, 84, 112, 1) 0%, rgba(87, 178, 199, 1) 100%); 
		filter: progid:DXImageTransform.Microsoft.gradient(
		startColorstr="#0B5470",
		endColorstr="#57B2C7",
		GradientType=0
		);*/
		
		
		background: url('../img/bg.jpg') no-repeat center center fixed;
		background-size: cover;
		color: #fff;
		padding: 40px 20px;
		position: relative; 
		z-index: 0;
    }

	body>div {
		
	}

	body>div::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
		z-index: 0;
	}
	/* Diagonal */
	body>div::after { 
		content: '';
		position: fixed;
		bottom: 0;
		right: 0;
		width: 100%;
		height: calc(0.5 * 100vw);
		transform: skewY(-50deg);
		transform-origin: bottom right;
		background: rgba(255, 255, 255, 0.1);
		z-index: 1;
	}

    .logo {
      width: 250px;
      height: 250px;
      background: url('../img/logo_white.png') no-repeat center center / contain;  
      margin-bottom: 20px;
    }

    h1 {
      margin: 0;
      font-size: 1.8rem;
    }

    p {
		margin-top: 5px;
		margin-bottom: 35px;
		color: #eee;
    }

    .link {
		/*background-color: #333;*/
		border: 1px solid #eee;
		border-radius: 30px;
		color: #eee;
		text-decoration: none;
		padding: 15px 20px;
		margin: 10px 0;
		width: 100%;
		max-width: 400px;
		text-align: center;  
		transition: 0.3s;
		display: block;
		font-weight: bold;
		/* From https://css.glass */
		background: rgba(255, 255, 255, 0.2);
		border-radius: 16px;
		box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
		backdrop-filter: blur(2px);
		-webkit-backdrop-filter: blur(2px);
		border: 1px solid rgba(255, 255, 255, 0.3);
    }
	
    .link:hover {
		/* From https://css.glass */
		background: rgba(255, 255, 255, 0.4);
		border-radius: 16px;
		box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
		backdrop-filter: blur(2px);
		-webkit-backdrop-filter: blur(2px);
		border: 1px solid rgba(255, 255, 255, 0.6);
    }

    footer {
		margin-top: 70px;
		font-size: 0.8rem;
		color: #eee;
		text-align: center;
    }

	.wrapper{
		position:relative;
		width:100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		z-index: 100;
	}

	.small{
		font-size: 10px;
	}

	.space {
		perspective: 800px;
		width: 140vw;
		height: 140vh;
		position: fixed;
		top: -20%;
		left: 0;
	}

	.particle {
		position: absolute;
		width: 3px;
		height: 3px;
		background: white;
		border-radius: 50%;
		animation: fly 3s infinite linear;
		opacity: 0;
		filter: blur(1px);
		}

		@keyframes fly {
			0% {
				transform: translateZ(-800px) scale(0.1);
				opacity: 0.5;
			}
			100% {
				transform: translateZ(0px) scale(3);
				opacity: 0;
			}
		}


	@media only screen and (max-width: 600px) {
		.logo {
			width: 200px;
			height: 200px;
		}
			
		body>div::after {
			height: calc(0.7 * 100vw);

		}
	}