@font-face {
        font-family: 'Aeonik-Regular';
        src: url("../fonts/Aeonik-Regular.otf");
	}

/* Basic */

	html {
		box-sizing: border-box;
	}

	*, *:before, *:after {
		box-sizing: inherit;
	}

	body {
		background: #fff;
		overflow: hidden;
	}

		body.is-preload *, body.is-preload *:before, body.is-preload *:after {

			animation: none !important;
			transition: none !important;
		}

	body, input, select, textarea {
		color: #fff;
		font-family: 'Aeonik-Regular', sans-serif;
		font-size: 15pt;
		font-weight: 300 !important;
		letter-spacing: -0.025em;
		line-height: 1.75em;
	}

	a {
		transition: border-color 0.2s ease-in-out;
		font-size: 1.25em;
		border-bottom: dotted 1px;
		color: inherit;
		outline: 0;
		text-decoration: none;
	}

		a:hover {
			border-color: transparent;
		}

		.video_wrapper {
			position: absolute;
			top: 0;
			bottom: 0;
			width: 100%;
			height: 100%; 
			overflow: hidden;
		}
		
		.video_wrapper video {
			/* Make video to at least 100% wide and tall */
			min-width: 100%; 
			min-height: 100%;
	
			/* Setting width & height to auto prevents the browser from stretching or squishing the video
			width: auto;
			height: auto; */

			
			/* Center the video */
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);
		}
/* Wrapper */

	@keyframes wrapper {
		0% {
			opacity: 0;
		}

		100% {
			opacity: 1;
		}
	}

	#wrapper {
		animation: wrapper 3s forwards;
		height: 100%;
		left: 0;
		opacity: 0;
		position: fixed;
		top: 0;
		width: 100%;
	}

	/* bgstars */
	@keyframes bgstars {
		0% {
			transform: translate3d(0,0,0);
		}

		100% { 
			transform: translate3d(-3408px,0,0);
		}
	}
	

	form {
		background: linear-gradient(to top right, #0a0a5a 35%, #00aaf5);
	}
	/* bgstars */	
	#bgstars {
		animation: bgstars 60s linear infinite;
		backface-visibility: hidden;
		transform: translate3d(0,0,0);
	/* Background Neles Blue*/
		background: #00aaf5 url("../images/bgstars.jpg") bottom left;
		background-repeat: repeat-x;
		height: 100%;
		left: 0;
		opacity: 1;
		position: fixed;
		top: 0;
		background-size: 3408px auto; /* real size  3408is 852 width x 480. Scale it 4 times double so it fills the screen >screen size bigger than 1680*/
		width: 6816px; /* 8x */
	}

/* headline */

	#headline {
		height: 100%;
		left: 0;
		position: fixed;
		text-align: center;
		top: 0;
		width: 100%;
	}

		#headline::before {
			content: '';
			display: inline-block; /* top and bottom margins/paddings are respected,*/
			height: 100%;
			margin-right: 0;
			vertical-align: middle;
			width: 1px;
		}

	@keyframes big_head {
		0% {
			transform: translate3d(0,1em,0);
			opacity: 0;
		}

		100% {
			transform: translate3d(0,0,0);
			opacity: 1;
		}
	}

	
	#big_head {

		animation: big_head 1s 1s forwards; /* animation duration and delay */
		backface-visibility: hidden;
		transform: translate3d(0,0,0);
		cursor: default;
		display: inline-block;
		opacity: 0;
		position: relative;
		text-align: center;
		top: -1em;
		vertical-align: middle;
		width: 90%;
	}

		#big_head h1 {
			font-size: 4.35em;
			/*font-weight: 900;*/
		}

		#big_head p {
			font-size: 1.25em;
			margin: 0.75em 0 0.25em 0;
			opacity: 0.75;
		}
		@keyframes blink_loading {
			0% {
				opacity: 0;
			}

			25% {
				opacity: 1;
			}
			100% {
				opacity: 0;
			}			
		}

		#show_calculating {
			animation: blink_loading 2s infinite;
			opacity: 1;
		}
			


/* Footer */

	#footer {
		font-size: 1em;
		bottom: 0;
		cursor: default;
		height: 6em;
		left: 0;
		line-height: 1.5em;
		position: absolute;
		text-align: center;
		width: 100%;
	}

	@media screen and (max-width: 1920px) { /* 1680 */

		/* Basic */

		body, input, select, textarea {
				font-size: 13pt;
		}

		/* bgstars */
		@keyframes bgstars {
			0% {
				transform: translate3d(0,0,0);
			}

			100% { 
				transform: translate3d(-2556px,0,0);
			}
		}
		#bgstars {
			background-size: 2556px auto; /* real size was 2256 is 852 width x 480. Scale it 3 times so it fills the screent*/
			width: 5112px;
		}
		#big_head h1 {
			font-size: 3.5em;
		}
	}
/* Mobile */

	@media screen and (max-width: 736px) {

		/* Basic */

			body {
				min-width: 320px;
			}

			body, input, select, textarea {
				font-size: 11pt;
			}

		/* bgstars */

		@keyframes bgstars {
			0% {

				transform: translate3d(0,0,0);
			}

			100% {

				transform: translate3d(-1704px,0,0);
			}
		}

		#bgstars {
			background-size: 1704px auto;
			width: 3408px;
		}

	/* Header */

		#big_head h1 {
			font-size: 2.0em;
		}

		#big_head p {
			font-size: 1.25em;
		}

	}