@charset "utf-8";

/* CSS Document */

body {
	margin: 0px;
	padding: 0px;
	background-color:#Dfe8ff;
	overflow: hidden;
	font-size: 25px;
	font-family:'Calibri';

}

a:link {
	text-decoration:none;
}

#container-login {
	text-align: center;
	margin-top:150px;
}

#login-fail {
	margin-top:50px;
	color:#FF0000;
}

#login-form {
	text-align: center;
	margin-top:50px;
}

#div-preloader {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

#exp-video {
	display:none;
	z-index:1;
}

#video-container {
	position:relative;
}

#video-info {
	background-color:#Dfe8ff;
	color:#000000;
	display:none;
    position:absolute;
    top:0;
    left:0;
    text-align:center;
    width:100%;
    margin-top:70px;
	z-index: 2147483647;
}

#p-video-end a {
	font-weight: bold;
	color:#006699;
}

#canvas {
	position: absolute; 
	display: block;
}

#animation_container {
	position:absolute;
	margin:auto;
	left:0;
	right:0;
	top:0;
	bottom:0;
	width:900px;
	height:500px;
 }

#dom_overlay_container {
	pointer-events:none;
	overflow:hidden;
	width:900px;
	height:500px;
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
}

@font-face {
	font-family: 'Calibri';
	src: url('../fonts/Calibri.eot');
	src: local('Calibri'),
		url('../fonts/Calibri.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Calibri.woff') format('woff'),
		url('../fonts/Calibri.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Calibri';
	src: url('../fonts/Calibri-Bold.eot');
	src: local('Calibri Bold'), local('Calibri-Bold'),
		url('../fonts/Calibri-Bold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Calibri-Bold.woff') format('woff'),
		url('../fonts/Calibri-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

.shortInputText, .longInputText, input[type="text"] {
	text-align:center;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 5px;
    border-radius:7px;
    -webkit-border-radius:7px;
    -moz-border-radius:7px;
    border: 2px solid #DFE8FF;
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
}

.longInputText {
	width: 370px;
}

.shortInputText {
	width: 185px;
	height:50px;
	font-size: 20px;
}

.button-gen {
	background-color:#006699;
	border: none;
	color: white;
	padding:16px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 8px;
	box-shadow: 0 0 5px rgba(0, 0, 0, .5);
}

#button-login {
	display:none;
	margin-top:60px;
}

*:focus {
    outline:none;
}